/* ==========================================================
   Fragancias Factory — corrección final (3.9.1)

   Producto individual: la rejilla de dos columnas se traslada al envoltorio
   .ff-product-top, que solo contiene galería y resumen. div.product vuelve a
   ser un simple flujo en bloque, así que ningún bloque hermano puede
   superponerse. Esto sustituye —no complementa— los intentos de V3.6, V3.8
   y V3.9 de repartir celdas dentro de div.product.
   ========================================================== */

body.ff-storefront-final.single-product .woocommerce div.product {
  display:block!important;
  grid-template-columns:none!important;
  grid-template-rows:none!important;
}
body.ff-storefront-final.single-product .woocommerce div.product > * {
  grid-column:auto!important;
  grid-row:auto!important;
  grid-area:auto!important;
  float:none!important;
  clear:both!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

/* El envoltorio es la única rejilla. */
body.ff-storefront-final.single-product .ff-product-top {
  display:block;
  width:100%;
  min-width:0;
}
@media (min-width:1024px) {
  body.ff-storefront-final.single-product .ff-product-top {
    display:grid!important;
    grid-template-columns:minmax(0,52%) minmax(0,48%)!important;
    column-gap:clamp(32px,3.4vw,58px)!important;
    align-items:start!important;
  }
  body.ff-storefront-final.single-product .ff-product-top > .woocommerce-product-gallery {
    grid-column:1!important;
    grid-row:1!important;
    position:relative!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding-left:0!important;
    float:none!important;
  }
  body.ff-storefront-final.single-product .ff-product-top > .summary {
    grid-column:2!important;
    grid-row:1!important;
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding-top:2px!important;
    float:none!important;
    top:auto!important;
  }
  /* Nada más puede entrar en esta rejilla. */
  body.ff-storefront-final.single-product .ff-product-top > *:not(.woocommerce-product-gallery):not(.summary) {
    grid-column:1 / -1!important;
    grid-row:auto!important;
  }
  /* Miniaturas siempre en flujo, nunca absolutas. */
  body.ff-storefront-final.single-product .woocommerce div.product div.images .flex-control-thumbs {
    position:static!important;
    flex-direction:row!important;
    width:auto!important;
    max-height:none!important;
    margin:12px 0 0!important;
  }
}

/* Las miniaturas son un <ol>: sin marcadores numéricos. */
body.ff-storefront-final.single-product .woocommerce div.product div.images .flex-control-thumbs {
  list-style:none!important;
  padding-left:0!important;
  gap:9px!important;
  display:flex!important;
  overflow-x:auto;
  scrollbar-width:none;
}
body.ff-storefront-final.single-product .woocommerce div.product div.images .flex-control-thumbs::-webkit-scrollbar { display:none; }
body.ff-storefront-final.single-product .woocommerce div.product div.images .flex-control-thumbs li {
  list-style:none!important;
  flex:0 0 auto!important;
  margin:0!important;
}
body.ff-storefront-final.single-product .woocommerce div.product div.images .flex-control-thumbs li::marker { content:none!important; }

/* Título de compra, no de portada. */
body.ff-storefront-final.single-product .product_title {
  font-size:clamp(27px,2.3vw,37px)!important;
  line-height:1.07!important;
  margin:0 0 6px!important;
}

/* ==========================================================
   Un solo sistema de pestañas, horizontal y en flujo
   ========================================================== */
body.ff-storefront-final.single-product .ff-product-subnav {
  position:static!important;
  transform:none!important;
  left:auto!important; right:auto!important; top:auto!important; bottom:auto!important;
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:clamp(18px,2.4vw,34px)!important;
  width:100%!important;
  margin:34px 0 0!important;
  padding:13px 0!important;
  border-top:1px solid rgba(29,42,36,.12)!important;
  border-bottom:1px solid rgba(29,42,36,.12)!important;
  background:transparent!important;
  writing-mode:horizontal-tb!important;
}
body.ff-storefront-final.single-product .ff-product-subnav > a {
  flex:0 0 auto!important;
  padding:2px 0!important;
  font-size:11px!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  color:#5a6a61!important;
  text-decoration:none!important;
  border-bottom:1px solid transparent!important;
  white-space:nowrap!important;
}
body.ff-storefront-final.single-product .ff-product-subnav > a:hover,
body.ff-storefront-final.single-product .ff-product-subnav > a:focus-visible { color:#17392f!important; border-bottom-color:#17392f!important; }

/* La fila de botones nativa de WooCommerce sobra: la subnav ya navega.
   Los paneles de contenido se conservan íntegros. */
body.ff-storefront-final.single-product .woocommerce-tabs > ul.tabs { display:none!important; }
body.ff-storefront-final.single-product .woocommerce-tabs .panel { display:block!important; max-width:960px!important; }
body.ff-storefront-final.single-product .woocommerce-tabs { margin-top:26px!important; }

/* El bloque de historia, en banda propia y con su tipografía real. */
body.ff-storefront-final.single-product .ff-product-story {
  position:static!important;
  width:100%!important;
  margin:26px 0 0!important;
}
body.ff-storefront-final.single-product .ff-product-story__heading h2 {
  font-size:clamp(25px,2.2vw,33px)!important;
  line-height:1.12!important;
  margin:4px 0 0!important;
}

/* ==========================================================
   Cinta de métodos de pago — una sola, bajo el botón
   ========================================================== */
body.ff-storefront-final .ff-payment-methods,
body.ff-storefront-final .ff-payment-rail { display:none!important; }

body.ff-storefront-final .ff-paymarquee {
  display:block!important;
  clear:both!important;
  float:none!important;
  width:100%!important;
  max-width:100%!important;
  margin:14px 0 0!important;
  padding:12px 0 0!important;
  border-top:1px solid rgba(29,42,36,.1)!important;
  overflow:hidden!important;
}
body.ff-storefront-final .ff-paymarquee + .ff-paymarquee { display:none!important; }
body.ff-storefront-final .ff-paymarquee__label {
  display:block;
  margin-bottom:9px;
  font-size:9px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7b8780;
}
body.ff-storefront-final .ff-paymarquee__viewport {
  width:100%;
  max-width:100%;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
body.ff-storefront-final .ff-paymarquee__track {
  display:flex;
  align-items:center;
  gap:10px;
  width:max-content;
  animation:ff-paymarquee var(--ff-marquee-duration,26s) linear infinite;
}
body.ff-storefront-final .ff-paymarquee:hover .ff-paymarquee__track { animation-play-state:paused; }
@keyframes ff-paymarquee { from { transform:translate3d(0,0,0); } to { transform:translate3d(-50%,0,0); } }

body.ff-storefront-final .ff-paylogo {
  flex:0 0 auto;
  display:grid;
  place-items:center;
  height:26px;
  min-width:42px;
  padding:0 8px;
  border:1px solid rgba(29,42,36,.09);
  border-radius:5px;
  background:#fff;
}
body.ff-storefront-final .ff-paylogo svg,
body.ff-storefront-final .ff-paylogo img { height:13px!important; width:auto!important; max-width:38px!important; display:block; }

@media (prefers-reduced-motion:reduce) {
  body.ff-storefront-final .ff-paymarquee__track { animation:none!important; }
  body.ff-storefront-final .ff-paymarquee__viewport { overflow-x:auto; }
}

/* ==========================================================
   Barra de catálogo: resultados + vista. Sin ordenamiento.
   ========================================================== */
body.ff-storefront-final .ff-catalog-toolbar,
body.ff-storefront-final .ff-catalog-sort,
body.ff-storefront-final .woocommerce-ordering,
body.ff-storefront-final .ff-sort-sheet,
body.ff-storefront-final .ff-catalog-toolbar__right { display:none!important; }

body.ff-storefront-final .ff-catalog-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  margin:0 0 14px;
  padding:9px 0 11px;
  border-bottom:1px solid rgba(29,42,36,.1);
}
body.ff-storefront-final .ff-catalog-bar__count {
  margin:0;
  min-width:0;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#6b7770;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body.ff-storefront-final .ff-catalog-bar__views {
  flex:0 0 auto;
  display:inline-flex;
  gap:2px;
  padding:2px;
  border:1px solid rgba(29,42,36,.14);
  border-radius:9px;
  background:#fff;
}
body.ff-storefront-final .ff-catalog-bar__views button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:40px;
  min-height:38px;
  padding:0 11px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#6b7770;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .16s ease,color .16s ease;
}
body.ff-storefront-final .ff-catalog-bar__views button[aria-pressed="true"] { background:#eff3ed; color:#17392f; }
body.ff-storefront-final .ff-catalog-bar__views button:focus-visible { outline:2px solid #17392f; outline-offset:2px; }
body.ff-storefront-final .ff-view-ico { width:14px; height:14px; background-color:currentColor; }
body.ff-storefront-final .ff-view-ico--grid {
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='8' height='8'/%3E%3Crect x='13' y='3' width='8' height='8'/%3E%3Crect x='3' y='13' width='8' height='8'/%3E%3Crect x='13' y='13' width='8' height='8'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='8' height='8'/%3E%3Crect x='13' y='3' width='8' height='8'/%3E%3Crect x='3' y='13' width='8' height='8'/%3E%3Crect x='13' y='13' width='8' height='8'/%3E%3C/svg%3E");
  -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
body.ff-storefront-final .ff-view-ico--list {
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='4' width='18' height='4'/%3E%3Crect x='3' y='10' width='18' height='4'/%3E%3Crect x='3' y='16' width='18' height='4'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='4' width='18' height='4'/%3E%3Crect x='3' y='10' width='18' height='4'/%3E%3Crect x='3' y='16' width='18' height='4'/%3E%3C/svg%3E");
  -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
@media (max-width:719px) {
  body.ff-storefront-final .ff-view-txt { display:none; }
  body.ff-storefront-final .ff-catalog-bar__views button { min-width:42px; padding:0; }
}

/* ==========================================================
   Vista cuadrícula / lista — móvil y escritorio
   ========================================================== */

/* Los selectores no pueden exigir .woocommerce como DESCENDIENTE: WooCommerce
   pone esa clase también en el <body>, y entonces "body .woocommerce ul.products"
   no encuentra nada. Se apunta directamente a ul.products. */

/* Cuadrícula: dos columnas en móvil, tres en tablet, cuatro en escritorio. */
body.ff-storefront-final.ff-view-grid ul.products {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  list-style:none!important;
  margin:0!important;
  padding:0!important;
}
body.ff-storefront-final.ff-view-grid ul.products li.product {
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  float:none!important;
}
@media (min-width:720px) {
  body.ff-storefront-final.ff-view-grid ul.products { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px!important; }
}
@media (min-width:1024px) {
  body.ff-storefront-final.ff-view-grid ul.products { grid-template-columns:repeat(4,minmax(0,1fr))!important; }
}

/* Lista: una fila por producto, tarjeta horizontal. */
body.ff-storefront-final.ff-view-list ul.products {
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:9px!important;
  list-style:none!important;
  margin:0!important;
  padding:0!important;
}
/* Flotado en lugar de rejilla: no hay que contar filas, el texto fluye al
   costado de la foto y el contenedor cierra el flotado con overflow. */
body.ff-storefront-final.ff-view-list ul.products li.product {
  display:block!important;
  overflow:hidden!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:9px!important;
  background:#fff!important;
  border:1px solid rgba(29,42,36,.1)!important;
  text-align:left!important;
  float:none!important;
}
body.ff-storefront-final.ff-view-list ul.products li.product > a:first-child,
body.ff-storefront-final.ff-view-list ul.products li.product > .woocommerce-loop-product__link:first-child,
body.ff-storefront-final.ff-view-list ul.products li.product > .ff-card-v2__media:first-child,
body.ff-storefront-final.ff-view-list ul.products li.product > .ff-card-v2__media-wrap:first-child {
  float:left!important;
  width:36%!important;
  max-width:36%!important;
  margin:0 13px 0 0!important;
  display:block!important;
}
/* Cada bloque de texto abre su propio contexto de formato: así respeta el
   flotado en lugar de extenderse por debajo de la fotografía. */
body.ff-storefront-final.ff-view-list ul.products li.product > *:not(:first-child) {
  clear:none!important;
  overflow:hidden!important;
  text-align:left!important;
}
body.ff-storefront-final.ff-view-list ul.products li.product img {
  width:100%!important;
  max-width:100%!important;
  aspect-ratio:1/1;
  object-fit:cover;
  margin:0!important;
}
body.ff-storefront-final.ff-view-list ul.products li.product .ph { width:100%!important; }
@media (min-width:1024px) {
  body.ff-storefront-final.ff-view-list ul.products li.product > a:first-child,
  body.ff-storefront-final.ff-view-list ul.products li.product > .woocommerce-loop-product__link:first-child,
  body.ff-storefront-final.ff-view-list ul.products li.product > .ff-card-v2__media:first-child,
  body.ff-storefront-final.ff-view-list ul.products li.product > .ff-card-v2__media-wrap:first-child {
    width:150px!important; max-width:150px!important; margin-right:20px!important;
  }
}
body.ff-storefront-final.ff-view-list ul.products li.product .woocommerce-loop-product__title {
  font-size:15px!important;
  line-height:1.2!important;
  margin:0 0 2px!important;
  text-align:left!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.ff-storefront-final.ff-view-list ul.products li.product .ff-inspired {
  font-size:11px!important;
  margin:0 0 5px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.ff-storefront-final.ff-view-list ul.products li.product .ff-size-chips { margin:0 0 5px!important; }
body.ff-storefront-final.ff-view-list ul.products li.product .price { font-size:14px!important; text-align:left!important; margin:0!important; }
body.ff-storefront-final.ff-view-list .ff-card-v2 { transform:none!important; }

@media (min-width:1024px) {
  body.ff-storefront-final.ff-view-list ul.products li.product {
    padding:12px!important;
  }
  body.ff-storefront-final.ff-view-list ul.products li.product .woocommerce-loop-product__title { font-size:20px!important; white-space:normal!important; }
  body.ff-storefront-final.ff-view-list ul.products li.product .ff-inspired { font-size:12px!important; }
  body.ff-storefront-final.ff-view-list ul.products li.product .price { font-size:18px!important; }
}

/* Guardas de anchura. */
html, body.ff-storefront-final { max-width:100%; overflow-x:clip; }
body.ff-storefront-final img, body.ff-storefront-final video, body.ff-storefront-final iframe { max-width:100%; height:auto; }


/* V3.9.2 — logos de pago cargados por el comercio. */
.ff-paymark--custom img {
  display:block;
  width:auto;
  height:auto;
  max-width:76px;
  max-height:18px;
  object-fit:contain;
  margin:0;
}
.single-product .ff-product-top .summary form.cart + .ff-paymarquee {
  display:block!important;
  width:100%!important;
  clear:both!important;
  margin-top:14px!important;
}

/* ========================================================================
   V3.9.3 — selector avanzado de variantes (desktop drawer + mobile sheet)
   ======================================================================== */
.single-product .ff-product-variant-picker{
  margin:22px 0 14px;
  padding-top:18px;
  border-top:1px solid rgba(29,42,36,.12);
}
.single-product .ff-product-variant-picker__label{
  display:block;
  margin:0 0 9px;
  font-size:9px;
  line-height:1;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:#6d7a72;
}
.single-product .ff-product-variant-picker__button{
  width:100%;
  min-height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:13px 15px;
  border:1px solid rgba(29,42,36,.16);
  border-radius:10px;
  background:#fff;
  color:#1d2a24;
  text-align:left;
  cursor:pointer;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.single-product .ff-product-variant-picker__button:hover{
  border-color:rgba(23,57,47,.48);
  box-shadow:0 10px 28px rgba(20,35,28,.07);
  transform:translateY(-1px);
}
.single-product .ff-product-variant-picker__button strong{
  display:block;
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
}
.single-product .ff-product-variant-picker__button small{
  display:block;
  margin-top:3px;
  font-size:10px;
  color:#748078;
}
.single-product .ff-product-variant-picker__arrow{
  flex:0 0 auto;
  font-size:27px;
  line-height:1;
  color:#17392f;
}
.single-product form.variations_form.ff-advanced-variants-ready{
  display:none!important;
}

.ff-variant-title-mobile{display:none}
.ff-variant-sheet__section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  padding:17px 0 8px;
  border-bottom:1px solid rgba(29,42,36,.09);
}
.ff-variant-sheet__section-head span{
  display:block;
  font-size:11px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ff-variant-sheet__section-head small{
  display:block;
  margin-top:4px;
  font-size:10px;
  color:#748078;
  font-weight:400;
  letter-spacing:0;
  text-transform:none;
}
.ff-variant-sheet__section-head>strong{
  display:grid;
  place-items:center;
  min-width:28px;
  height:28px;
  padding:0 8px;
  border-radius:999px;
  background:#eef1eb;
  font-size:11px;
  font-weight:600;
}
.ff-variant-sheet__product-copy{min-width:0}
.ff-variant-sheet__eyebrow{
  display:block;
  margin-bottom:4px;
  font-size:8px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#8a958e;
}
.ff-variant-sheet__product-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
}
.ff-variant-row__copy small{
  display:block;
  margin-top:4px;
  font-size:9px;
  color:#7a857e;
}
.ff-variant-row__price{font-weight:600}
.ff-variant-sheet__subtotal>div{min-width:0}
.ff-variant-sheet__subtotal>div>span{
  display:block;
  margin-bottom:3px;
  font-size:10px;
  color:#6d7972;
}
.ff-variant-sheet__subtotal>div>small{
  display:block;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8b958f;
}

/* Desktop: panel lateral tipo comercio grande. */
@media (min-width: 769px){
  .ff-variant-sheet__backdrop{
    background:rgba(8,14,11,.42);
    backdrop-filter:blur(2px);
  }
  .ff-variant-sheet__panel{
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:auto!important;
    width:min(590px,92vw)!important;
    max-height:none!important;
    height:100dvh!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    border-radius:0!important;
    transform:translateX(103%)!important;
    box-shadow:-28px 0 80px rgba(10,20,14,.18)!important;
    background:#fbfbf8!important;
  }
  .ff-variant-sheet.is-open .ff-variant-sheet__panel{
    transform:translateX(0)!important;
  }
  .ff-variant-sheet__handle{display:none!important}
  .ff-variant-sheet__panel>header{
    min-height:74px;
    padding:17px 24px!important;
    border-bottom:1px solid rgba(29,42,36,.1)!important;
  }
  .ff-variant-sheet__panel>header h2{
    max-width:430px;
    font-family:var(--ff-sans, "Work Sans", sans-serif)!important;
    font-size:19px!important;
    line-height:1.2;
    font-weight:650!important;
    letter-spacing:-.01em;
  }
  .ff-variant-sheet__panel>header .ff-icon-btn{
    width:42px;
    height:42px;
  }
  .ff-variant-sheet__content{
    overflow:auto!important;
    overscroll-behavior:contain;
    padding:0 24px 24px!important;
  }
  .ff-variant-sheet__product{
    grid-template-columns:86px minmax(0,1fr)!important;
    gap:15px!important;
    padding:19px 0 17px!important;
  }
  .ff-variant-sheet__hero-image img{
    width:86px!important;
    height:86px!important;
    border-radius:9px;
    object-fit:cover;
  }
  .ff-variant-sheet__product h3{
    font-size:22px!important;
    line-height:1.08;
  }
  .ff-variant-sheet__rows{padding-top:2px}
  .ff-variant-row{
    grid-template-columns:70px minmax(0,1fr) auto!important;
    gap:14px!important;
    min-height:96px;
    padding:13px 0!important;
  }
  .ff-variant-row__image img{
    width:70px!important;
    height:70px!important;
    border-radius:8px;
  }
  .ff-variant-row__copy strong{font-size:13px!important}
  .ff-variant-row__copy .ff-variant-row__price{font-size:14px!important;margin-top:5px}
  .ff-variant-row__qty{
    grid-template-columns:38px 34px 38px!important;
    min-height:40px!important;
  }
  .ff-variant-row__qty button{height:38px!important;font-size:20px!important}
  .ff-variant-row__qty span{font-size:13px!important}
  .ff-variant-sheet__panel>footer{
    padding:14px 24px 18px!important;
    border-top:1px solid rgba(29,42,36,.12)!important;
    background:rgba(251,251,248,.98)!important;
  }
  .ff-variant-sheet__subtotal{margin-bottom:12px!important}
  .ff-variant-sheet__subtotal strong{font-size:24px!important}
  .ff-variant-sheet__actions{grid-template-columns:1fr 1.08fr!important;gap:10px!important}
  .ff-variant-sheet__actions button{min-height:52px!important;border-radius:999px!important;font-size:10px!important}
  .ff-sheet-add{background:#fff!important;color:#17392f!important;border-color:#17392f!important}
  .ff-sheet-buy{background:#17392f!important;color:#fff!important;border-color:#17392f!important}
}

/* Mobile: bottom sheet alto con footer fijo, inspirado en la UX de marketplace. */
@media (max-width: 768px){
  .ff-variant-title-desktop{display:none}
  .ff-variant-title-mobile{display:inline}
  .ff-variant-sheet__panel{
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    max-height:92dvh!important;
    height:min(92dvh,820px)!important;
    transform:translateY(103%)!important;
    border-radius:20px 20px 0 0!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
  }
  .ff-variant-sheet.is-open .ff-variant-sheet__panel{transform:translateY(0)!important}
  .ff-variant-sheet__panel>header{
    min-height:58px;
    padding:7px 16px 9px!important;
  }
  .ff-variant-sheet__panel>header h2{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    font-family:var(--ff-sans, "Work Sans", sans-serif)!important;
    font-size:20px!important;
    font-weight:650!important;
  }
  .ff-variant-sheet__panel>header .ff-icon-btn{margin-left:auto;width:42px;height:42px}
  .ff-variant-sheet__content{
    overflow:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:0 14px 18px!important;
  }
  .ff-variant-sheet__product{
    grid-template-columns:74px minmax(0,1fr)!important;
    gap:12px!important;
    padding:12px 0 14px!important;
  }
  .ff-variant-sheet__hero-image img{
    width:74px!important;
    height:74px!important;
    border-radius:9px;
  }
  .ff-variant-sheet__product h3{font-size:17px!important}
  .ff-variant-sheet__product p{font-size:10px!important;margin:2px 0 5px!important}
  .ff-variant-sheet__section-head{padding:13px 0 8px}
  .ff-variant-sheet__section-head small{display:none}
  .ff-variant-row{
    grid-template-columns:62px minmax(0,1fr) auto!important;
    gap:10px!important;
    min-height:86px;
    padding:10px 0!important;
  }
  .ff-variant-row__image img{
    width:62px!important;
    height:62px!important;
    border-radius:7px;
  }
  .ff-variant-row__copy strong{font-size:13px!important}
  .ff-variant-row__copy .ff-variant-row__price{font-size:12px!important;margin-top:4px}
  .ff-variant-row__copy small{font-size:8px}
  .ff-variant-row__qty{
    grid-template-columns:36px 31px 36px!important;
    min-height:40px!important;
  }
  .ff-variant-row__qty button{height:38px!important;font-size:20px!important}
  .ff-variant-row__qty span{font-size:13px!important}
  .ff-variant-sheet__panel>footer{
    padding:11px 14px calc(12px + env(safe-area-inset-bottom))!important;
    background:rgba(255,255,252,.985)!important;
  }
  .ff-variant-sheet__subtotal{margin-bottom:9px!important}
  .ff-variant-sheet__subtotal strong{font-size:21px!important}
  .ff-variant-sheet__actions{grid-template-columns:1fr 1.1fr!important;gap:8px!important}
  .ff-variant-sheet__actions button{min-height:50px!important;border-radius:999px!important;font-size:9px!important;padding:8px 10px!important}
  .ff-sheet-add{background:#fff!important;color:#17392f!important;border-color:#17392f!important}
  .ff-sheet-buy{background:#17392f!important;color:#fff!important;border-color:#17392f!important}
  .single-product .ff-product-variant-picker{margin-top:14px;padding-top:14px}
  .single-product .ff-product-variant-picker__button{min-height:62px;padding:11px 13px}
  .single-product .ff-product-variant-picker__button strong{font-size:12px}
  .single-product .ff-product-variant-picker__button small{font-size:9px}
}

@media (prefers-reduced-motion:reduce){
  .ff-variant-sheet__panel,.ff-variant-sheet__backdrop,.ff-product-variant-picker__button{transition:none!important}
}

@keyframes ff-v393-shake-drawer{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-7px)}
  75%{transform:translateX(7px)}
}
@keyframes ff-v393-shake-sheet{
  0%,100%{transform:translate(0,0)}
  25%{transform:translate(-6px,0)}
  75%{transform:translate(6px,0)}
}
@media (min-width:769px){
  .ff-variant-sheet.is-shaking .ff-variant-sheet__panel{animation:ff-v393-shake-drawer .28s linear!important}
}
@media (max-width:768px){
  .ff-variant-sheet.is-shaking .ff-variant-sheet__panel{animation:ff-v393-shake-sheet .28s linear!important}
}

/* ========================================================================
   V3.9.4 — variantes visibles en ficha + modal robusto vía WC-AJAX
   ======================================================================== */
.single-product .ff-product-variant-picker{
  margin:20px 0 14px;
  padding-top:17px;
  border-top:1px solid rgba(29,42,36,.12);
}
.single-product .ff-product-variant-picker__groups{
  display:flex;
  flex-direction:column;
  gap:13px;
}
.single-product .ff-product-variant-picker__group{
  display:grid;
  gap:7px;
}
.single-product .ff-product-variant-picker__group-label{
  display:block;
  font-size:9px;
  line-height:1.2;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#718078;
}
.single-product .ff-product-variant-picker__options{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  min-width:0;
}
.single-product .ff-product-variant-option{
  appearance:none;
  min-height:40px;
  max-width:100%;
  padding:9px 14px;
  border:1px solid rgba(29,42,36,.18);
  border-radius:8px;
  background:#fff;
  color:#1d2a24;
  font:500 11px/1.2 "Work Sans",sans-serif;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:pointer;
  box-shadow:0 1px 0 rgba(20,35,28,.02);
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease;
}
.single-product .ff-product-variant-option:hover,
.single-product .ff-product-variant-option:focus-visible{
  border-color:#17392f;
  background:#f6f7f3;
  box-shadow:0 6px 18px rgba(20,35,28,.06);
  outline:none;
  transform:translateY(-1px);
}
.single-product .ff-product-variant-option--wide{width:100%;text-align:left}
.single-product .ff-product-variant-picker__note{
  display:block;
  margin-top:9px;
  color:#7a857f;
  font-size:9px;
  line-height:1.45;
}

/* El modal puede recibir muchas filas; se mantiene dentro del viewport y el
   scroll pertenece al contenido, nunca al body. */
.ff-variant-sheet__content{overscroll-behavior:contain}
.ff-variant-sheet__rows{min-width:0}
.ff-variant-row{min-width:0}
.ff-variant-row__copy{min-width:0}
.ff-variant-row__copy strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media (max-width: 767px){
  .single-product .ff-product-variant-picker{margin-top:13px;padding-top:13px}
  .single-product .ff-product-variant-picker__groups{gap:11px}
  .single-product .ff-product-variant-picker__options{gap:6px}
  .single-product .ff-product-variant-option{
    min-height:38px;
    padding:8px 11px;
    border-radius:7px;
    font-size:10px;
  }
  .single-product .ff-product-variant-picker__note{font-size:8.5px}
  .ff-variant-sheet__panel{max-width:100vw!important}
  .ff-variant-row{grid-template-columns:54px minmax(0,1fr) auto!important}
  .ff-variant-row__image img{width:54px!important;height:54px!important}
}
