/* AJUSTES DE DISEÑO DE LA FICHA DE PRODUCTO (producto.html)
   Se cargan al final para tener la última palabra sobre los demás estilos. */

/* 1) WhatsApp: más pequeño y pegado al borde, para no tapar precios ni botones. */
body .whatsapp-widget{right:8px!important;bottom:16px!important}
body .whatsapp-widget svg{width:46px!important;height:46px!important;padding:10px!important}

/* 2) Precio y meses sin intereses dentro de la caja de compra (los mueve product-polish.js). */
body.product-editorial-page .buy-box>.price{display:flex!important;align-items:baseline;gap:7px;margin:0 0 8px!important;padding:0!important;border:0!important;color:#151515;font:700 34px/1 Raleway,Arial,sans-serif!important;letter-spacing:-.05em}
body.product-editorial-page .buy-box>.price small{display:inline;margin:0;color:#777774;font:700 10px Raleway,Arial,sans-serif;letter-spacing:.1em}
body.product-editorial-page .buy-box>.product-payment-note{max-width:260px;margin:0 0 14px!important;padding:3px 0 3px 8px;border-left:2px solid #426b91;color:#526373;font:500 10.5px/1.45 Raleway,Arial,sans-serif!important}

/* 3) Título editorial más compacto: el jersey y el botón de compra se ven más arriba. */
body.product-editorial-page .product-title-banner{min-height:0!important;padding:4px 8vw 16px!important}
body.product-editorial-page .product-title-banner h1,body.product-editorial-page .product-title-banner h1.product-title-fit{font-size:clamp(28px,2.7vw,44px)!important;line-height:.98!important;text-wrap:balance;max-width:min(40ch,100%)!important}
body.product-editorial-page .product-page .detail-layout{padding-top:16px!important}

/* 4) El nombre ya está en el título grande: en "Archivo" dejamos solo el número. */
body.product-editorial-page .archive-identity-team,
body.product-editorial-page .archive-identity-descriptor{display:none!important}
body.product-editorial-page .archive-identity-kicker{margin-bottom:6px!important}
body.product-editorial-page .product-story .archive-identity{margin-bottom:18px!important}

/* 5) Flecha de "Cantidad": dibujada con CSS (antes era una letra que parecía una "V"). */
body.product-editorial-page .product-quantity label i{font-size:0!important;width:8px;height:8px;margin:-4px 2px 0 0;border-right:1.6px solid #151515;border-bottom:1.6px solid #151515;transform:rotate(45deg)}

/* 6) Barra fija de compra en el celular (aparece cuando el botón de compra sale de la pantalla). */
.product-sticky-bar{display:none}
@media(max-width:760px){
  /* Flechas de la galería: dentro de la foto (antes quedaban a medias fuera de la pantalla y la página se corría de lado). */
  body.product-editorial-page .gallery-arrow{width:40px!important;height:40px!important;font-size:22px!important;background:rgba(247,247,245,.88)!important}
  body.product-editorial-page .gallery-arrow-previous{left:8px!important}
  body.product-editorial-page .gallery-arrow-next{right:8px!important}
  .product-sticky-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #151515;transform:translateY(110%);transition:transform .2s}
  body.has-sticky-bar .product-sticky-bar{transform:translateY(0)}
  .product-sticky-bar .sticky-price{font:700 20px/1 Raleway,Arial,sans-serif;letter-spacing:-.04em;color:#151515;white-space:nowrap}
  .product-sticky-bar .sticky-price small{margin-left:4px;color:#777774;font:700 9px Raleway,Arial,sans-serif;letter-spacing:.1em}
  .product-sticky-bar button{flex:1;min-height:46px;border:0;background:#151515;color:#fff;font:700 11px Raleway,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
  body.has-sticky-bar{padding-bottom:70px}
  body.has-sticky-bar .whatsapp-widget{bottom:82px!important}
}