/* SU Especialidades — badge overlay (grid + single product) */
/* Anchor the overlay to the image container (Woodmart already positions labels there) */
.wd-product-thumb,.product-element-top{position:relative}
.su-esp-badges{position:absolute;bottom:10px;left:10px;z-index:5;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 20px);pointer-events:none}
.su-esp-badges>*{pointer-events:auto}
.su-esp-badge{position:relative;display:inline-flex;width:28px;height:28px;border-radius:999px;align-items:center;justify-content:center;color:#fff;background:var(--su-esp-c,#A2CA60);text-decoration:none;outline:none;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease;-webkit-tap-highlight-color:transparent}
.su-esp-badge:hover{color:#fff}
.su-esp-badge svg{width:16px;height:16px;display:block}
.su-esp-badge svg.su-esp-flag{width:100%;height:100%;border-radius:inherit}
.su-esp-badge .su-esp-k{font:700 14px/1 "Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:.02em}
.su-esp-badge .su-esp-k--sm{font-size:11.5px;letter-spacing:0}
.su-esp-badge:hover,.su-esp-badge:focus-visible{transform:translateY(-1px) scale(1.06);box-shadow:0 3px 10px rgba(0,0,0,.18)}
.su-esp-badge:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--su-esp-c,#A2CA60)}
/* Tooltip: custom pill (never browser-default title) */
.su-esp-badge::after{content:attr(data-label);position:absolute;left:0;bottom:36px;transform:translateY(4px) scale(.98);opacity:0;visibility:hidden;transition:opacity .15s ease,transform .15s ease,visibility 0s linear .15s;white-space:nowrap;padding:4px 9px;border-radius:999px;background:#fff;border:1.5px solid var(--su-esp-c,#A2CA60);color:var(--su-esp-c,#A2CA60);font:700 11px/1 "Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;box-shadow:0 2px 8px rgba(0,0,0,.08);pointer-events:none;z-index:9999}
.su-esp-badge:hover::after,.su-esp-badge:focus-visible::after,.su-esp-badge.is-open::after{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
/* "+N" overflow control (visible-count caps are injected inline from settings) */
.su-esp-more{position:relative;display:inline-flex;width:28px;height:28px;border-radius:999px;align-items:center;justify-content:center;background:#6B7280;color:#fff;border:0;padding:0;margin:0;cursor:pointer;font:700 11px/1 "Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;transition:transform .18s ease;-webkit-tap-highlight-color:transparent;box-shadow:none}
.su-esp-more::before{content:"+" attr(data-more)}
.su-esp-more:hover,.su-esp-more:focus-visible{transform:translateY(-1px) scale(1.06);background:#4B5563}
.su-esp-more--mobile-only{display:none}
.su-esp-badges.is-expanded .su-esp-more{display:none}
.su-esp-badges.is-expanded .su-esp-badge{animation:suEspPop .22s cubic-bezier(.34,1.56,.64,1) backwards}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(1){animation-delay:0s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(2){animation-delay:.03s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(3){animation-delay:.06s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(4){animation-delay:.09s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(5){animation-delay:.12s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(6){animation-delay:.15s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(7){animation-delay:.18s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(8){animation-delay:.21s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(9){animation-delay:.24s}
.su-esp-badges.is-expanded .su-esp-badge:nth-of-type(10){animation-delay:.27s}
@keyframes suEspPop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){
  .su-esp-badge,.su-esp-more{transition:none}
  .su-esp-badges.is-expanded .su-esp-badge{animation:none}
}
@media (max-width:768px){
  .su-esp-more::before{content:"+" attr(data-more-sm)}
  .su-esp-more--mobile-only{display:inline-flex}
}
/* Coexistence with legacy .su-k-badge (until kosher takeover): shift our row
   past the theme's K badge so they never overlap */
.su-esp-badges--after-k{left:56px;max-width:calc(100% - 66px)}
/* Single product: bottom-right of main gallery, right-aligned tooltips */
.su-esp-badges--single{left:auto;right:20px;bottom:15px;justify-content:flex-end;z-index:10}
.su-esp-badges--single .su-esp-badge::after{left:auto;right:0}
.su-esp-badges--single.su-esp-badges--after-k{left:auto;right:54px;max-width:calc(100% - 64px)}
/* Ensure Woodmart containers allow the overlay (mirrors legacy badge rules) */
.single-product .wd-carousel-container.wd-gallery-images,
.single-product .woocommerce-product-gallery,
.single-product .product-images,
.single-product .images{position:relative}
/* Informational (linkless) badges — tooltip only, no navigation */
.su-esp-badges--nolink .su-esp-badge{cursor:default}
/* Complementa checkout funnel: match its 8px badge inset; its own K badge
   (28px at left 8px) keeps rendering, so the offset there is 44px */
.superunico-complementa-page .su-product-image{position:relative}
.superunico-complementa-page .su-esp-badges{bottom:8px;left:8px}
.superunico-complementa-page .su-esp-badges--after-k{left:44px;max-width:calc(100% - 52px)}
