/* ==========================================================
   Fragancias Factory Storefront V3.9
   Producto individual en PC: se abandona CSS Grid.

   Por qué. v36.css convertía div.product en rejilla de dos columnas y asignaba
   celda a una lista de hijos conocidos. Los bloques que añadieron V3.1 y V3.3
   —.ff-product-subnav y .ff-product-story— no estaban en esa lista, así que el
   auto-placement de Grid los colocaba en la fila 1, encima de la galería y del
   resumen. V3.8 intentó cubrirlos con un :not() universal, pero cualquier
   bloque futuro vuelve a depender de que el auto-placement acierte.

   Flexbox no tiene ese problema: un contenedor en fila con wrap coloca cada
   hijo después del anterior, nunca encima. La galería y el resumen se
   dimensionan con flex-basis y todo lo demás ocupa el 100% en su propia línea.
   Cualquier bloque que se añada mañana cae solo en su sitio.
   ========================================================== */

@media (min-width:1024px) {
  body.ff-storefront-v39.single-product .woocommerce div.product {
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:wrap!important;
    align-items:flex-start!important;
    column-gap:clamp(34px,3.6vw,60px)!important;
    row-gap:0!important;
    grid-template-columns:none!important;
    grid-template-rows:none!important;
    grid-auto-flow:row!important;
  }

  /* Cada hijo vuelve a flujo normal: sin celda, sin flotación, sin absoluto. */
  body.ff-storefront-v39.single-product .woocommerce div.product > * {
    grid-column:auto!important;
    grid-row:auto!important;
    grid-area:auto!important;
    float:none!important;
    position:static!important;
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* Las dos únicas columnas de la primera línea. */
  body.ff-storefront-v39.single-product .woocommerce div.product > .woocommerce-product-gallery {
    flex:1 1 clamp(420px,52%,660px)!important;
    width:auto!important;
    order:1!important;
    position:relative!important;
  }
  body.ff-storefront-v39.single-product .woocommerce div.product > .summary {
    flex:1 1 clamp(380px,42%,520px)!important;
    width:auto!important;
    order:2!important;
    padding-top:2px!important;
  }

  /* Todo lo demás, en bandas propias y en orden legible. */
  body.ff-storefront-v39.single-product .woocommerce div.product > .ff-product-subnav { order:3!important; margin-top:38px!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product > .ff-product-story  { order:4!important; margin-top:8px!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product > .woocommerce-tabs  { order:5!important; margin-top:14px!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product > .upsells           { order:6!important; margin-top:20px!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product > .related           { order:7!important; margin-top:20px!important; }

  /* La subnav puede volver a ser sticky: ahora tiene banda propia. */
  body.ff-storefront-v39.single-product .ff-product-subnav {
    position:sticky!important;
    top:78px!important;
    z-index:8!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    gap:26px!important;
    padding:12px 0!important;
    background:rgba(250,251,248,.94)!important;
    backdrop-filter:blur(8px);
    border-top:1px solid rgba(29,42,36,.1)!important;
    border-bottom:1px solid rgba(29,42,36,.1)!important;
  }

  /* El bloque de historia recupera su tipografía: antes se veía enorme porque
     estaba comprimido en una columna de pocos píxeles. */
  body.ff-storefront-v39.single-product .ff-product-story > h2,
  body.ff-storefront-v39.single-product .ff-product-story > h3 {
    font-size:clamp(26px,2.4vw,34px)!important;
    line-height:1.12!important;
    margin:0 0 16px!important;
  }

  /* El título de la ficha es de compra, no de portada. */
  body.ff-storefront-v39.single-product .product_title {
    font-size:clamp(28px,2.4vw,38px)!important;
    line-height:1.06!important;
    margin:0 0 6px!important;
  }

  /* La galería no puede volver a superponerse al resumen. */
  body.ff-storefront-v39.single-product .woocommerce-product-gallery { z-index:1!important; }
  body.ff-storefront-v39.single-product .summary { z-index:2!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product div.images .flex-control-thumbs { position:static!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product > .woocommerce-product-gallery { padding-left:0!important; }
}

/* Por debajo de 1024px el producto ya era un flujo en bloque correcto: solo se
   garantiza que ningún resto de rejilla o posicionamiento sobreviva. */
@media (max-width:1023px) {
  body.ff-storefront-v39.single-product .woocommerce div.product { display:block!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product > * { float:none!important; width:100%!important; max-width:100%!important; }
  body.ff-storefront-v39.single-product .woocommerce div.product div.images .flex-control-thumbs { position:static!important; flex-direction:row!important; }
}

/* ==========================================================
   Un solo rail de pagos
   El duplicado se retira en PHP; esto es la red de seguridad por si un plugin
   volviera a imprimir un rail de una versión anterior.
   ========================================================== */
body.ff-storefront-v39 .ff-payment-methods,
body.ff-storefront-v39 .ff-payment-rail { display:none!important; }
body.ff-storefront-v39 .ff-paymarquee { display:block!important; }

/* ==========================================================
   Un solo bloque de presentaciones en la ficha
   ========================================================== */
body.ff-storefront-v39.single-product .summary .ff-size-chips { display:none!important; }
body.ff-storefront-v39 .woocommerce ul.products .ff-size-chips { display:flex!important; }