/** Shopify CDN: Minification failed

Line 1344:0 Unexpected "}"

**/
/* =========================================
   Celest • Mobile PDP — FIX set
   - Botones talla/guía 70/30 ancho total y 30% más delgados
   - Estilos con mayor especificidad / !important para vencer al tema
   ========================================= */


#celest-mobile-pdp{ font-family: inherit; }
.celestPdp{ position: relative; padding-bottom: 24px; }
.celestPdp__sentinel{ position:absolute; top:0; height:56px; width:1px; }


/* Header transparente / sólido */
header.celest-header--transparent{
  background: transparent !important;
  box-shadow: none !important;
  transition: background-color .28s ease, box-shadow .28s ease;
}
header.celest-header--solid{
  transition: background-color .28s ease, box-shadow .28s ease;
}


/* ===== Galería ===== */
.celestPdp__gallery{ position: relative; background:#fff; }
.celestPdp__slides{
  display: flex;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  gap: 0;
}
.celestPdp__slides::-webkit-scrollbar{ display:none; }
.celestPdp__slides{ -ms-overflow-style: none; scrollbar-width: none; }
.celestPdp__slide{
  flex: 0 0 100%;
  scroll-snap-align: center;
  position: relative;
  background:#f7f7f7;
  display:flex; align-items:center; justify-content:center;
}
.celestPdp__slide img,
.celestPdp__slide video{ width:100%; height:auto; display:block; }


/* Barra Gucci */
.celestPdp__progress{
  position: absolute; left:0; right:0; bottom: 6px;
  padding: 0 16px; display:flex; align-items:center; gap:8px;
  pointer-events: none;
}
.celestPdp__progressTrack{
  position:absolute; left:16px; right:16px; bottom:0;
  height:2px; background:#e6e6e6; border-radius:2px;
}
.celestPdp__progressBar{
  position:absolute; left:16px; bottom:0;
  height:2px; background:#111; border-radius:2px;
  width:16%; transition: width .22s ease;
}
.celestPdp__counter{ margin-left:auto; font-size:12px; color:#333; }


/* ===== Info ===== */
.celestPdp__info{ padding:16px; }
.celestPdp__title{ font-size:22px; line-height:1.2; margin:4px 0 8px; }
.celestPdp__price{ font-size:18px; margin-bottom:12px; display:flex; gap:8px; align-items:baseline; }
.celestPdp__price .compare{ color:#888; }
.price--sale{ color:#c40000; font-weight:700; }


/* Swatches */
.celestPdp__option{ margin:10px 0; }
.celestPdp__optionLabel{ font-size:14px; margin-bottom:8px; }
.celestPdp__swatches{ display:flex; gap:10px; flex-wrap:wrap; }
.celestPdp__swatch{
  width:54px; height:54px; border-radius:12px; overflow:hidden;
  border:1px solid #d9d9d9; padding:0; background:#fff; position:relative;
  cursor: pointer;
}
.celestPdp__swatch img{ width:100%; height:100%; object-fit:cover; }
.celestPdp__swatch.is-active{ outline:2px solid #111; }


/* ===== Selector de talla ===== */
.celestPdp__sizeWrap{ position: relative; }


/* 70/30 de ancho total */
.celestPdp__sizeRow{
  display:grid; grid-template-columns:7fr 3fr; gap:10px; margin:8px 0 2px;
}


/* ——— Botones más DELGADOS (30% menos alto) y ancho total como el CTA ——— */
.celestPdp__sizeBtn,
.celestPdp__guideBtn{
  width:100% !important;
  border-radius:12px !important;
  font-size:14px !important;
  line-height:1.1 !important;
  padding:8px 12px !important;       /* ↓ más delgado */
  min-height:42px !important;        /* control visual consistente */
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease !important;
}
.celestPdp__sizeBtn{
  background:#fff !important; border:1px solid #111 !important; color:#111 !important;
}
.celestPdp__sizeBtn.is-open,
.celestPdp__sizeBtn.has-selection{
  background:#111 !important; color:#fff !important; border-color:#111 !important;
}
.celestPdp__guideBtn{
  background:#111 !important; color:#fff !important; border:1px solid #111 !important;
}


/* Popover / Sheet de tallas */
.celestPdp__sizeSheet{ will-change: transform, opacity; }
.celestPdp__sheetHead{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:8px; font-weight:600;
}
.celestPdp__closeSheet{
  border:none; background:#111; color:#fff; border-radius:50%; width:32px; height:32px; font-size:18px; line-height:1;
}
.celestPdp__sizes{ display:flex; flex-wrap:wrap; gap:10px; }
.celestPdp__size{
  min-width:58px; padding:10px 12px; border:1px solid #d9d9d9;
  border-radius:12px; background:#fff; font-size:14px; cursor:pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.celestPdp__size.is-disabled{ opacity:.35; text-decoration:line-through; cursor:not-allowed; }
.celestPdp__size.is-active{ background:#111; color:#fff; border-color:#111; }


/* CTA */
.celestPdp__cta{ margin-top:14px; }
.celestPdp__addBtn{
  width:100%; border:none; border-radius:12px; padding:14px 16px;
  font-size:16px; font-weight:600; background:#111; color:#fff;
  opacity:.45; transition:opacity .2s ease, transform .06s ease;
}
.celestPdp__addBtn[disabled]{ pointer-events:none; }
.celestPdp__addBtn.is-ready{ opacity:1; }
.celestPdp__addBtn:active{ transform:scale(.995); }


/* Modales base */
.celestModal[hidden]{ display:none; }
.celestModal{ position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9998; }


/* Guía */
.celestPdp__guideBody{
  background:#fff; border-top-left-radius:16px; border-top-right-radius:16px;
  position:fixed; left:0; right:0; bottom:0; padding:16px;
  max-height:85vh; overflow:auto;
  box-shadow:0 -22px 40px rgba(0,0,0,.28);
  transform: translateY(12px); opacity:0; transition: transform .18s ease, opacity .18s ease;
}
.celestPdp__guideBody.is-open{ transform: translateY(0); opacity:1; }
.celestPdp__guideClose{
  position:absolute; right:12px; top:12px;
  background:#111; color:#fff; border:none; border-radius:50%;
  width:32px; height:32px;
}


/* Mini-cart */
.celestPdp__cartBody{
  background:#fff; border-top-left-radius:16px; border-top-right-radius:16px;
  position:fixed; left:0; right:0; bottom:0; padding:16px;
  max-height:85vh; overflow:auto;
  box-shadow:0 -22px 40px rgba(0,0,0,.28);
  transform: translateY(-12px); opacity:0; transition: transform .28s ease, opacity .28s ease;
}
.celestPdp__cartBody.is-open{ transform: translateY(0); opacity:1; }
.celestPdp__cartClose{
  position:absolute; right:12px; top:12px;
  background:#111; color:#fff; border:none; border-radius:50%;
  width:34px; height:34px;
}
.celestPdp__cartTitle{ font-size:18px; margin-bottom:12px; padding-right:40px; }
.celestPdp__cartItems{ display:grid; gap:12px; margin-bottom:10px; }
.celestPdp__cartItem{ display:grid; grid-template-columns:72px 1fr auto; gap:10px; align-items:center; }
.celestPdp__cartItem img{ width:72px; height:72px; object-fit:cover; border-radius:10px; background:#f7f7f7; }
.celestPdp__cartSubtotal{ display:flex; justify-content:space-between; font-weight:600; padding:10px 0; }


/* Envío gratis + ETA */
.celestPdp__shipBox{ padding:8px 0 14px; }
.celestPdp__shipText{ font-size:13px; margin-bottom:6px; }
.celestPdp__shipProgress{ position:relative; height:6px; background:#eee; border-radius:999px; overflow:hidden; }
.celestPdp__shipProgress span{ position:absolute; left:0; top:0; bottom:0; width:0%; background:#111; }
.celestPdp__eta{ display:flex; align-items:center; gap:8px; font-size:13px; margin-top:6px; }
.celestPdp__etaIcon{ color:#111; }
.celestPdp__eta b{ font-weight:700; }


/* Acordeones + botón personalizado */
.celestPdp__blocks{ margin:12px 0 4px; border-top:1px solid #eee; }
.celestAcc{ border-bottom:1px solid #eee; }
.celestAcc > summary{
  display:flex; align-items:center; gap:10px; justify-content:space-between;
  list-style:none; cursor:pointer; padding:14px 0;
}
.celestAcc > summary::-webkit-details-marker{ display:none; }
.accIcon{ width:20px; height:20px; object-fit:contain; }
.accTitle{ font-weight:600; }
.accPlus{ margin-left:auto; transition:transform .2s ease; }
.celestAcc[open] .accPlus{ transform: rotate(45deg); }
.accBody{ padding:0 0 12px; color:#444; font-size:14px; }


.celestBtnBlockWrap{ margin:10px 0 6px; }
.celestBtnBlock{
  display:inline-block; padding:12px 16px; border-radius:var(--cb-rad,12px);
  background:var(--cb-bg,#111); color:var(--cb-fg,#fff); font-weight:600;
}


/* ===== Desktop ===== */
@media (min-width: 990px){
  #celest-mobile-pdp.celest-hide-desktop{ display:none; }


  .celestPdp{
    max-width: 1200px; margin: 0 auto; padding: 24px 24px 40px;
    display:grid; grid-template-columns: 1.1fr .9fr; gap: 40px;
  }


  .celestPdp__slides{ display:block; overflow:visible; }
  .celestPdp__slide{ flex:auto; margin-bottom:16px; }
  .celestPdp__progress{ display:none; }
  .celestPdp__gallery{ position:relative; }


  .celestPdp__info{ position: sticky; top: 96px; align-self: start; }


  .celestModal{ background:transparent; }
  .celestPdp__guideBody{
    left:auto; right:24px; bottom:auto; top:100px; width:420px;
    border-radius:12px; padding:16px; box-shadow:0 10px 40px rgba(0,0,0,.18);
    transform: translateY(-10px); opacity:0; transition: transform .22s ease, opacity .22s ease;
  }
  .celestPdp__guideBody.is-open{ transform: translateY(0); opacity:1; }


  .celestPdp__cartBody{
    left:auto; right:24px; bottom:auto; top:100px; width:420px;
    max-height:70vh; border-radius:12px; box-shadow:0 10px 40px rgba(0,0,0,.18);
  }


  .celestPdp__sizeSheet{
    position:absolute; left:0; top: calc(100% + 8px); width: min(420px, 100%);
    background:#fff; border:1px solid #eee; border-radius:12px; padding:14px 16px;
    box-shadow:0 10px 40px rgba(0,0,0,.18);
    transform: translateY(-10px); opacity:0; transition: transform .20s ease, opacity .20s ease;
    z-index: 100000;
  }
  .celestPdp__sizeSheet.is-open{ transform: translateY(0); opacity:1; }
}


/* ===== Móvil ===== */
@media (max-width: 989px){
  .celestPdp__sizeRow{
    display:grid; grid-template-columns:7fr 3fr; gap:10px; margin:8px 0 2px;
  }
}
/* Asegura gesto de arrastre horizontal en móviles */
/* Permite arrastrar lateral para fotos y vertical para hacer scroll de la página */
.celestPdp__slides{
  touch-action: pan-x pan-y !important;  /* antes era solo pan-x */
  -ms-touch-action: pan-x pan-y !important;
  pointer-events: auto;
}
/* ---------- Mini-cart Celest (tipo Prada) ---------- */
.celestPdp__cartModal{
  position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9999;
  display:block;
}
.celestPdp__cartModal[hidden]{ display:none; }
.celestPdp__cartBody{
  position:fixed; left:0; right:0; bottom:-100%; background:#fff; border-radius:16px 16px 0 0;
  padding:16px; max-height:82vh; overflow:auto; box-shadow:0 -10px 30px rgba(0,0,0,.25);
  transition:transform .28s ease, bottom .28s ease;
}
.celestPdp__cartBody.is-open{ bottom:0; }
@media (min-width:990px){
  .celestPdp__cartBody{ right:24px; left:auto; width:420px; border-radius:16px; bottom:auto; top:24px; }
}


.celestPdp__cartTitle{ font-size:20px; font-weight:700; margin:4px 0 12px; }
.celestPdp__cartClose{
  position:absolute; top:8px; right:8px; width:32px; height:32px; border-radius:999px; background:#000; border:0;
  display:grid; place-items:center; cursor:pointer;
}
.celestPdp__cartClose .celestPdp__x{
  width:14px; height:14px; position:relative; display:block;
}
.celestPdp__cartClose .celestPdp__x:before,
.celestPdp__cartClose .celestPdp__x:after{
  content:""; position:absolute; left:6px; top:0; width:2px; height:14px; background:#fff; border-radius:1px;
}
.celestPdp__cartClose .celestPdp__x:before{ transform:rotate(45deg); }
.celestPdp__cartClose .celestPdp__x:after{ transform:rotate(-45deg); }


.celestPdp__cartItem{ display:grid; grid-template-columns:72px 1fr auto; gap:12px; align-items:center; padding:10px 0; }
.celestPdp__cartItem + .celestPdp__cartItem{ border-top:1px solid #eee; }
.celestPdp__cartItem img{ width:72px; height:72px; object-fit:cover; border-radius:12px; }
.celestPdp__imgPh{ width:72px; height:72px; background:#eee; border-radius:12px; }
.celestPdp__title{ font-weight:600; }
.celestPdp__opts{ font-size:12px; color:#555; margin-top:2px; }
.celestPdp__price{ font-weight:600; }


.celestPdp__shipBox{ margin:10px 0 16px; }
.celestPdp__shipText{ font-size:13px; margin-bottom:6px; }
.celestPdp__shipTrack{ position:relative; height:4px; background:#e6e6e6; border-radius:999px; overflow:hidden; }
.celestPdp__shipTrack .js-shipBar{ height:100%; width:0%; background:#111; transition:width .25s ease; }


.celestPdp__eta{ margin-top:8px; font-size:13px; color:#333; }


.celestPdp__subtotal{ display:flex; justify-content:space-between; align-items:center; font-weight:600; padding:10px 0; border-top:1px solid #eee; }
.celestPdp__btn{ display:block; width:100%; text-align:center; padding:14px 16px; border-radius:999px; background:#000; color:#fff; font-weight:700; margin-top:10px; }
.celestPdp__btn--ghost{ background:#fff; color:#000; border:1px solid #000; }
.celestPdp__continue{ display:block; width:100%; margin:12px 0 4px; padding:12px; border-radius:12px; background:#f4f4f4; border:0; }


/* --- Mini-cart: tipografías más compactas --- */
.celestPdp__cartTitle{ font-size:18px; font-weight:700; margin:6px 0 10px; }
.celestPdp__cartItem{ display:grid; grid-template-columns:64px 1fr auto; gap:10px; align-items:center; padding:8px 0; }
.celestPdp__cartItem + .celestPdp__cartItem{ border-top:1px solid #efefef; }
.celestPdp__cartItem img{ width:64px; height:64px; object-fit:cover; border-radius:10px; }
.celestPdp__imgPh{ width:64px; height:64px; background:#eee; border-radius:10px; }
.celestPdp__title{ font-size:13px; line-height:1.25; font-weight:600; }
.celestPdp__opts{ font-size:12px; color:#555; margin-top:2px; }
.celestPdp__price{ font-size:13px; font-weight:700; white-space:nowrap; }


/* Botones: solo 2 (checkout negro arriba, seguir comprando blanco) */
.celestPdp__btn{ display:block; width:100%; text-align:center; padding:13px 16px; border-radius:999px; font-weight:700; margin-top:10px; }
.celestPdp__btn{ background:#000; color:#fff; border:1px solid #000; }
.celestPdp__btn--ghost{ background:#fff; color:#000; border:1px solid #000; }


/* Envío gratis + ETA */
.celestPdp__shipBox{ margin:8px 0 14px; }
.celestPdp__shipText{ font-size:13px; margin-bottom:6px; }
.celestPdp__shipTrack{ height:4px; background:#e8e8e8; border-radius:999px; overflow:hidden; }
.celestPdp__shipTrack .js-shipBar{ height:100%; width:0%; background:#111; transition:width .25s ease; }


/* Solo icono "a color" (emoji). Si el tema agrega un pseudoelemento, lo ocultamos */
.celestPdp__eta{ margin-top:8px; font-size:13px; color:#333; position:relative; }
.celestPdp__eta:before{ display:none !important; }


/* Pop-up base (ya lo tenías). Mantengo la ✕ blanca sobre fondo negro */
.celestPdp__cartModal{
  position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9999; display:block;
}
.celestPdp__cartModal[hidden]{ display:none; }
.celestPdp__cartBody{
  position:fixed; left:0; right:0; bottom:-100%; background:#fff; border-radius:16px 16px 0 0;
  padding:16px; max-height:82vh; overflow:auto; box-shadow:0 -10px 30px rgba(0,0,0,.25);
  transition:transform .28s ease, bottom .28s ease;
}
.celestPdp__cartBody.is-open{ bottom:0; }
@media (min-width:990px){
  .celestPdp__cartBody{ right:24px; left:auto; width:420px; border-radius:16px; bottom:auto; top:24px; }
}
.celestPdp__cartClose{
  position:absolute; top:8px; right:8px; width:32px; height:32px; border-radius:999px; background:#000; border:0;
  display:grid; place-items:center; cursor:pointer;
}
.celestPdp__cartClose .celestPdp__x{ width:14px; height:14px; position:relative; display:block; }
.celestPdp__cartClose .celestPdp__x:before,
.celestPdp__cartClose .celestPdp__x:after{
  content:""; position:absolute; left:6px; top:0; width:2px; height:14px; background:#fff; border-radius:1px;
}
.celestPdp__cartClose .celestPdp__x:before{ transform:rotate(45deg); }
.celestPdp__cartClose .celestPdp__x:after{ transform:rotate(-45deg); }


.celestPdp__subtotal{ display:flex; justify-content:space-between; align-items:center; font-weight:700; padding:10px 0; border-top:1px solid #efefef; }
/* Qty selector (±) */
.celestPdp__qty{ display:flex; align-items:center; gap:8px; margin:10px 0 8px; }
.celestPdp__qty .qty__minus,
.celestPdp__qty .qty__plus{
  width:40px; height:40px; border-radius:10px; border:1px solid #000; background:#fff; font-size:22px; line-height:1; font-weight:700;
}
.celestPdp__qty .qty__input{
  width:68px; height:40px; text-align:center; border:1px solid #ddd; border-radius:10px; font-weight:600;
}


/* Pop-up LV: tipografías compactas + 2 botones (negro y blanco) */
.celestPdp__cartItem{ display:grid; grid-template-columns:64px 1fr auto; gap:10px; align-items:center; padding:8px 0; }
.celestPdp__cartItem + .celestPdp__cartItem{ border-top:1px solid #efefef; }
.celestPdp__cartItem img{ width:64px; height:64px; object-fit:cover; border-radius:10px; }
.celestPdp__imgPh{ width:64px; height:64px; background:#eee; border-radius:10px; }
.celestPdp__title{ font-size:13px; line-height:1.25; font-weight:600; }
.celestPdp__opts{ font-size:12px; color:#555; margin-top:2px; }
.celestPdp__price{ font-size:13px; font-weight:700; white-space:nowrap; }


.celestPdp__btn{ display:block; width:100%; text-align:center; padding:13px 16px; border-radius:999px; font-weight:700; margin-top:10px; }
.celestPdp__btn{ background:#000; color:#fff; border:1px solid #000; }        /* Ver su cesta */
.celestPdp__btn--ghost{ background:#fff; color:#000; border:1px solid #000; } /* Continuar Comprando */


/* ETA: quitar icono negro del tema, dejar solo emoji a color */
.celestPdp__eta:before,
.celestPdp__eta svg,
.celestPdp__eta [class*="icon"]{ display:none !important; }
/* 1) Oculta cualquier qty en la PDP (si quedó de versiones anteriores) */
#celest-mobile-pdp .celestPdp__qty{ display:none !important; }


/* 2) Título de producto en la PDP 30% más grande (no afecta pop-up) */
#celest-mobile-pdp h1.product__title,
#celest-mobile-pdp .celestPdp__name{
  font-size: 1.3em;               /* +30% respecto al tamaño actual */
  line-height: 1.15;
}


/* 3) Qty dentro del pop-up */
.celestPdp__side{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.celestPdp__qtyMini{ display:inline-flex; align-items:center; gap:10px; }
.celestPdp__qtyMini .qMinus,
.celestPdp__qtyMini .qPlus{
  width:28px; height:28px; border-radius:8px; border:1px solid #000; background:#fff; font-size:18px; line-height:1; font-weight:700;
}
.celestPdp__qtyMini .qVal{ min-width:16px; text-align:center; font-weight:700; }


/* 4) Pop-up LV: dos botones (negro / blanco borde negro) */
.celestPdp__btn{ display:block; width:100%; text-align:center; padding:13px 16px; border-radius:999px; font-weight:700; margin-top:10px; }
.celestPdp__btn{ background:#000; color:#fff; border:1px solid #000; }        /* Finalizar la compra */
.celestPdp__btn--ghost{ background:#fff; color:#000; border:1px solid #000; } /* Seguir comprando */


/* 5) ETA: elimina icono negro heredado, queda el emoji a color */
.celestPdp__eta:before,
.celestPdp__eta svg,
.celestPdp__eta [class*="icon"]{ display:none !important; }
/* === Título PDP 30% más grande (no afecta al pop-up) === */
main h1.product__title,
main .product__title,
main .ProductMeta__Title,
main .product-single__title {
  font-size: 1.3em !important;      /* +30% */
  line-height: 1.15;
}


/* === Mini-cart LV === */
.celestPdp__cartModal{position:fixed;inset:0;display:flex;align-items:flex-end;background:rgba(0,0,0,.5);z-index:9999;}
.celestPdp__cartModal[hidden]{display:none;}
.celestPdp__cartBody{width:100%;max-height:80vh;background:#fff;border-radius:18px 18px 0 0;padding:16px 16px 20px;transform:translateY(16px);opacity:.0;transition:transform .25s ease,opacity .25s ease;}
.celestPdp__cartBody.is-open{transform:translateY(0);opacity:1;}
.celestPdp__cartClose{position:absolute;right:14px;top:12px;width:34px;height:34px;border-radius:999px;background:#000;border:none;}
.celestPdp__cartClose .celestPdp__x{position:relative;display:block;width:100%;height:100%;}
.celestPdp__cartClose .celestPdp__x:before,
.celestPdp__cartClose .celestPdp__x:after{content:"";position:absolute;left:8px;right:8px;top:16px;height:2px;background:#fff;transform:rotate(45deg);}
.celestPdp__cartClose .celestPdp__x:after{transform:rotate(-45deg);}
.celestPdp__cartTitle{font-weight:800;font-size:18px;margin:4px 40px 10px 0;}
.celestPdp__cartItems{max-height:38vh;overflow:auto;}
.celestPdp__cartItem{display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid #efefef;}
.celestPdp__cartItem:first-child{border-top:0}
.celestPdp__cartItem img{width:64px;height:64px;object-fit:cover;border-radius:10px;}
.celestPdp__title{font-size:13px;line-height:1.25;font-weight:600;}
.celestPdp__opts{font-size:12px;color:#555;margin-top:2px;}
.celestPdp__side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.celestPdp__price{font-size:13px;font-weight:700;white-space:nowrap;}
.celestPdp__subtotal{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-weight:700;}
.celestPdp__shipTrack{height:6px;background:#eee;border-radius:999px;margin:6px 0;}
.celestPdp__shipTrack .js-shipBar{height:100%;width:2%;border-radius:999px;background:#000;transition:width .25s ease;}
.celestPdp__eta:before,
.celestPdp__eta svg,
.celestPdp__eta [class*="icon"]{display:none !important;} /* dejamos solo el emoji a color */


/* Botones estilo LV */
.celestPdp__btn{display:block;width:100%;text-align:center;padding:13px 16px;border-radius:999px;font-weight:700;margin-top:10px;background:#000;color:#fff;border:1px solid #000;}
.celestPdp__btn--ghost{background:#fff;color:#000;border:1px solid #000;}


/* Ocultar cualquier qty que hubiese quedado en la PDP */
#MainContent .celestPdp__qty{display:none !important;}
/* TÍTULO PDP +30% (no afecta dentro del pop-up propio) */
main h1.product__title,
main .product__title,
main .ProductMeta__Title,
main .product-single__title {
  font-size: 1.3em !important;
  line-height: 1.15;
}


/* Barra/contador si tiene que auto-inyectarse */
.celestPdp__progressWrap{display:flex;align-items:center;gap:10px;margin:8px 0 14px;}
.celestPdp__progressWrap .celestPdp__progressBar{height:3px;background:#000;border-radius:999px;flex:1 1 auto;transition:width .25s ease;width:8%;}
.celestPdp__progressWrap .celestPdp__counter{font-size:12px;color:#333;}


/* Mini-cart LV */
.celestPdp__cartModal{position:fixed;inset:0;display:flex;align-items:flex-end;background:rgba(0,0,0,.5);z-index:9999;}
.celestPdp__cartModal[hidden]{display:none;}
.celestPdp__cartBody{width:100%;max-height:80vh;background:#fff;border-radius:18px 18px 0 0;padding:16px 16px 20px;transform:translateY(16px);opacity:.0;transition:transform .25s ease,opacity .25s ease;}
.celestPdp__cartBody.is-open{transform:translateY(0);opacity:1;}
.celestPdp__cartClose{position:absolute;right:14px;top:12px;width:34px;height:34px;border-radius:999px;background:#000;border:none;}
.celestPdp__cartClose .celestPdp__x{position:relative;display:block;width:100%;height:100%;}
.celestPdp__cartClose .celestPdp__x:before,
.celestPdp__cartClose .celestPdp__x:after{content:"";position:absolute;left:8px;right:8px;top:16px;height:2px;background:#fff;transform:rotate(45deg);}
.celestPdp__cartClose .celestPdp__x:after{transform:rotate(-45deg);}
.celestPdp__cartTitle{font-weight:800;font-size:18px;margin:4px 40px 10px 0;}
.celestPdp__cartItems{max-height:38vh;overflow:auto;}
.celestPdp__cartItem{display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid #efefef;}
.celestPdp__cartItem:first-child{border-top:0}
.celestPdp__cartItem img{width:64px;height:64px;object-fit:cover;border-radius:10px;}
.celestPdp__title{font-size:13px;line-height:1.25;font-weight:600;}
.celestPdp__opts{font-size:12px;color:#555;margin-top:2px;}
.celestPdp__side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.celestPdp__price{font-size:13px;font-weight:700;white-space:nowrap;}
.celestPdp__subtotal{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-weight:700;}
.celestPdp__shipTrack{height:6px;background:#eee;border-radius:999px;margin:6px 0;}
.celestPdp__shipTrack .js-shipBar{height:100%;width:2%;border-radius:999px;background:#000;transition:width .25s ease;}
.celestPdp__eta:before, .celestPdp__eta svg, .celestPdp__eta [class*="icon"]{display:none !important;} /* dejamos solo el emoji */


/* Botones estilo LV */
.celestPdp__btn{display:block;width:100%;text-align:center;padding:13px 16px;border-radius:999px;font-weight:700;margin-top:10px;background:#000;color:#fff;border:1px solid #000;}
.celestPdp__btn--ghost{background:#fff;color:#000;border:1px solid #000;}
/* ===== OVERRIDE: Mini-cart escritorio estilo Prada (arriba-derecha) ===== */
@media (min-width: 990px){
  /* Overlay muy leve; ajusta si quieres (0 = sin overlay) */
  .celestPdp__cartModal{
    background: rgba(0,0,0,0.05) !important;
    align-items: flex-start;     /* anclar arriba */
    justify-content: flex-end;   /* anclar a la derecha */
  }


  .celestPdp__cartBody{
    right: 24px !important;
    left: auto !important;
    top: 90px !important;        /* separación del header */
    bottom: auto !important;
    width: 520px !important;     /* ancho tipo Prada; ajusta 480–560px si prefieres */
    max-height: 70vh !important;
    border-radius: 12px !important;
    transform: translateY(-8px); /* entrada suave desde arriba */
  }
  .celestPdp__cartBody.is-open{
    transform: translateY(0);
  }


  /* Botón cerrar dentro, arriba-derecha del panel */
  .celestPdp__cartClose{
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
  }
}


/* Opcional: pantallas <= 1280px, un poco más estrecho */
@media (min-width: 990px) and (max-width: 1280px){
  .celestPdp__cartBody{ width: 460px !important; }
}
/* === Mini-cart acciones al estilo Prada: blanco arriba, negro abajo === */
.celestPdp__cartActions{
  display: flex;
  flex-direction: column;   /* orden vertical */
  gap: 10px;
  margin-top: 12px;
}


.celestPdp__btn{
  display: block;
  width: 100%;
  text-align: center;
  padding: 13px 16px;
  border-radius: 999px;
  font-weight: 700;
}


.celestPdp__btn--primary{
  background: #000;
  color: #fff;
  border: 1px solid #000;
}


.celestPdp__btn--ghost{
  background: #fff;
  color: #000;
  border: 1px solid #000;
}
@media (max-width: 989px){
  .celestPdp__sizeSheet .celestPdp__closeSheet{ display:none !important; }
}
/* === Sizes popover en móvil: abre arriba si no hay espacio abajo === */
@media (max-width: 989px){
  .celestPdp__sizeWrap{ position: relative; }


  /* Popover anclado al botón (no full-screen) */
  .celestPdp__sizeSheet{
    position: absolute;
    left: 0; width: min(420px, 100%);
    background:#fff; border:1px solid #eee; border-radius:12px; padding:14px 16px;
    box-shadow:0 10px 40px rgba(0,0,0,.18);
    transform: translateY(-6px); opacity:0; z-index:10000;
    transition: transform .20s ease, opacity .20s ease;
  }
  .celestPdp__sizeSheet.is-open{ transform:translateY(0); opacity:1; }


  /* Por defecto abre ABAJO del botón */
  .celestPdp__sizeSheet:not(.is-top){ top: calc(100% + 8px); bottom:auto; }
  /* Si no hay espacio, abre ARRIBA del botón */
  .celestPdp__sizeSheet.is-top{ bottom: calc(100% + 8px); top:auto; }


  /* Botón circular de cierre (siempre visible en móvil) */
  .celestPdp__closeSheet{
    border:none; background:#111; color:#fff; border-radius:50%;
    width:32px; height:32px; font-size:18px; line-height:1; display:inline-grid; place-items:center;
  }
  .celestPdp__sheetHead{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; font-weight:600; }
}
/* FIX: asegurar que la ✕ del pop-up de tallas se muestre en móvil */
@media (max-width: 989px){
  .celestPdp__closeSheet{
    display: grid !important;          /* anula cualquier display:none previo */
    place-items: center;
    width: 32px; height: 32px;
    border-radius: 999px;
    background: #111; color: #fff;
  }
  .celestPdp__sheetHead{ display: flex !important; }
}
/* ===== OVERRIDE: Mini-cart escritorio estilo Prada (arriba-derecha) ===== */
@media (min-width: 990px){
  /* Overlay muy leve; ajusta si quieres (0 = sin overlay) */
  .celestPdp__cartModal{
    background: rgba(0,0,0,0.05) !important;
    align-items: flex-start;     /* anclar arriba */
    justify-content: flex-end;   /* anclar a la derecha */
  }

  .celestPdp__cartBody{
    right: 24px !important;
    left: auto !important;
    top: 90px !important;        /* separación del header */
    bottom: auto !important;
    width: 520px !important;     /* ancho tipo Prada; ajusta 480–560px si prefieres */
    max-height: 70vh !important;
    border-radius: 12px !important;
    transform: translateY(-8px); /* entrada suave desde arriba */
  }
  .celestPdp__cartBody.is-open{
    transform: translateY(0);
  }

  /* Botón cerrar dentro, arriba-derecha del panel */
  .celestPdp__cartClose{
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
  }
}

/* Opcional: pantallas <= 1280px, un poco más estrecho */
@media (min-width: 990px) and (max-width: 1280px){
  .celestPdp__cartBody{ width: 460px !important; }
}
/* === Sizes popover en móvil: abre arriba si no hay espacio abajo === */
@media (max-width: 989px){
  .celestPdp__sizeWrap{ position: relative; }

  /* Popover anclado al botón (no full-screen) */
  .celestPdp__sizeSheet{
    position: absolute;
    left: 0; width: min(420px, 100%);
    background:#fff; border:1px solid #eee; border-radius:12px; padding:14px 16px;
    box-shadow:0 10px 40px rgba(0,0,0,.18);
    transform: translateY(-6px); opacity:0; z-index:10000;
    transition: transform .20s ease, opacity .20s ease;
  }
  .celestPdp__sizeSheet.is-open{ transform:translateY(0); opacity:1; }

  /* Por defecto abre ABAJO del botón */
  .celestPdp__sizeSheet:not(.is-top){ top: calc(100% + 8px); bottom:auto; }
  /* Si no hay espacio, abre ARRIBA del botón */
  .celestPdp__sizeSheet.is-top{ bottom: calc(100% + 8px); top:auto; }

  /* Botón circular de cierre (siempre visible en móvil) */
  .celestPdp__closeSheet{
    border:none; background:#111; color:#fff; border-radius:50%;
    width:32px; height:32px; font-size:18px; line-height:1; display:inline-grid; place-items:center;
  }
  .celestPdp__sheetHead{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; font-weight:600; }
}

/* Mini-cart: layout sticky (título arriba + footer abajo visibles) */
.celestPdp__cartBody{
  display:flex;
  flex-direction:column;
  max-height:82vh;
  overflow:hidden; /* el scroll va dentro de la lista */
}

.celestPdp__cartTitle{
  position: sticky;
  top: 0;
  background:#fff;
  z-index: 4;
  margin: 6px 0 8px;
  padding-right: 40px; /* deja espacio a la X */
  box-shadow: 0 6px 10px -10px rgba(0,0,0,.35);
}

.celestPdp__cartClose{ z-index: 5; } /* que quede por encima del título */

.celestPdp__cartItems,
.celestPdp__cartBody .js-cartItems,
.celestPdp__cartBody .is-scrollArea{
  flex:1 1 auto;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}

/* Footer fijo con subtotal + botones (y envío si lo tienes ahí) */
.celestPdp__cartFooter{
  position: sticky;
  bottom: 0;
  background:#fff;
  padding-top: 10px;
  box-shadow: 0 -8px 12px -4px rgba(0,0,0,.15);
  z-index: 3;
}

/* Pequeños ajustes visuales */
.celestPdp__cartFooter .celestPdp__subtotal{
  padding:10px 0;
  border-top:1px solid #efefef;
}
.celestPdp__cartFooter .celestPdp__shipTrack{ margin:6px 0; }
/* === PDP: controla tamaños con variables (fácil de ajustar) === */
#celest-mobile-pdp{
  --pdp-title-m: 18px;  /* Título en móvil */
  --pdp-price-m: 14px;  /* Precio en móvil */
  --pdp-title-d: 20px;  /* Título en escritorio */
  --pdp-price-d: 16px;  /* Precio en escritorio */
}

#celest-mobile-pdp .celestPdp__info > .celestPdp__title{ line-height: 1.15; }
#celest-mobile-pdp .celestPdp__info > .celestPdp__price{ line-height: 1.2; }

/* Móvil */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__info > .celestPdp__title{ font-size: var(--pdp-title-m) !important; }
  #celest-mobile-pdp .celestPdp__info > .celestPdp__price{ font-size: var(--pdp-price-m) !important; }
}

/* Escritorio */
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__info > .celestPdp__title{ font-size: var(--pdp-title-d) !important; }
  #celest-mobile-pdp .celestPdp__info > .celestPdp__price{ font-size: var(--pdp-price-d) !important; }
}

/* Garantía: el pop-up del carrito mantiene sus tamaños */
#celest-mobile-pdp .celestPdp__cartBody .celestPdp__title{ font-size: 13px !important; }
#celest-mobile-pdp .celestPdp__cartBody .celestPdp__price{ font-size: 13px !important; }
/* === PDP: título en negrita, precio sin negrita (solo en la info del PDP) === */
#celest-mobile-pdp .celestPdp__info > .celestPdp__title{
  font-weight: 700 !important; /* negrita */
}

#celest-mobile-pdp .celestPdp__info > .celestPdp__price,
#celest-mobile-pdp .celestPdp__info > .celestPdp__price .price,
#celest-mobile-pdp .celestPdp__info > .celestPdp__price .money,
#celest-mobile-pdp .celestPdp__info > .celestPdp__price s,
#celest-mobile-pdp .celestPdp__info > .celestPdp__price *{
  font-weight: 400 !important; /* normal, incluso si es precio en oferta */
}
/* Centrado de mensajes de envío gratis y ETA (incluye el <small>) */
#celest-mobile-pdp .celestPdp__cartBody .celestPdp__shipBox,
#celest-mobile-pdp .celestPdp__cartBody .celestPdp__shipText,
#celest-mobile-pdp .celestPdp__cartBody .celestPdp__eta,
#celest-mobile-pdp .celestPdp__cartBody .celestPdp__eta .js-etaText{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
/* === Celest PDP • Mini-cart full-bleed en móvil (ocupa todo el ancho) === */
@media (max-width: 989px){
  /* El overlay no limita el ancho */
  #celest-mobile-pdp .celestPdp__cartModal{
    align-items: flex-end;      /* pegado abajo */
    justify-content: stretch;   /* sin centrado */
  }

  /* Cuerpo del pop-up a 100vw, sin “márgenes” laterales */
  #celest-mobile-pdp .celestPdp__cartBody{
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;

    /* Si lo quieres realmente a sangre: deja 0; si prefieres respiro, usa 16px */
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;

    /* A sangre total (sin esquinas). Comenta si prefieres esquinas redondeadas */
    border-radius: 0 !important;
  }

  /* La X respeta el área segura de iOS */
  #celest-mobile-pdp .celestPdp__cartClose{
    right: max(12px, env(safe-area-inset-right)) !important;
  }

  /* Footer (subtotal + barra + botones) ocupa el mismo ancho del pop-up */
  #celest-mobile-pdp .celestPdp__cartFooter{
    left: 0; right: 0;
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
  }
}
/* === Mini-cart full-bleed conservando esquinas redondeadas === */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__cartBody{
    /* ancho completo + áreas seguras */
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;

    /* esquinas redondeadas visibles */
    border-top-left-radius: 18px !important;
    border-top-right-radius: 18px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden; /* recorta contenido en las curvas */
  }

  /* coloca bien la X con área segura */
  #celest-mobile-pdp .celestPdp__cartClose{
    right: max(12px, env(safe-area-inset-right)) !important;
  }

  /* footer a mismo ancho */
  #celest-mobile-pdp .celestPdp__cartFooter{
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
  }
}
/* ===== Beneficios (icono + título + descripción) ===== */
.celestBenefits{
  display: grid;
  gap: 14px;
  margin: 12px 0;
}
.celestBenefit{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: flex-start;
}

.celestBenefit__icon{
  width: var(--benefit-icon, 44px) !important;
  height: var(--benefit-icon, 44px) !important;
  flex: 0 0 auto;
}
.celestBenefit__icon img,
.celestBenefit__iconPh{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.celestBenefit__title{
  font-weight: 700;
  font-size: var(--benefit-title, 16px) !important;
  line-height: 1.25;
}
.celestBenefit__desc{
  font-size: var(--benefit-desc, 14px) !important;
  line-height: 1.45;
  color: #666;
}

/* Desktop: solo refinamos el espaciado, los tamaños siguen viniendo de las variables */
@media (min-width: 990px){
  .celestBenefits{ gap: 16px; }
}
/* ========== CELEST LOADER (inline y overlay) ========== */
.celestLoader {
  display: inline-grid;
  place-items: center;
  vertical-align: middle;
  line-height: 0;
  animation: celestSpin var(--celest-loader-speed, .9s) linear infinite;
}
.celestLoader img {
  display: block;
  width: var(--celest-loader-size, 18px);
  height: var(--celest-loader-size, 18px);
}

@keyframes celestSpin {
  from { transform: rotate(0deg) scale(1); }
  70%  { transform: rotate(300deg) scale(0.98); }
  to   { transform: rotate(360deg) scale(1); }
}

/* Esconde el texto del botón cuando está cargando */
.is-loading .js-addText,
.is-loading .js-btn-label { opacity: 0; }

/* Overlay global cuando se toca la bolsa del header o “Finalizar la compra” */
#celestLoaderOverlay {
  position: fixed; inset: 0;
  display: none; /* visible con .is-active */
  align-items: center; justify-content: center;
  z-index: 12000;
  backdrop-filter: saturate(100%) blur(0px);
}
#celestLoaderOverlay.is-active { display: flex; }
#celestLoaderOverlay::before{
  content:"";
  position:absolute; inset:0;
  background: rgba(0,0,0,var(--celest-overlay-alpha, .4));
}
#celestLoaderOverlay .celestLoader {
  position: relative; z-index: 1;
  --celest-loader-size: 36px;
}

/* Botones: coloca el loader exactamente donde iría el texto */
.celestBtn--hasLoader{
  position: relative;
}
.celestBtn--hasLoader .celestLoader{
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
}

/* Asegura estados de los botones de tu PDP */
.celestPdp__addBtn.celestBtn--hasLoader,
.celestPdp__checkout.celestBtn--hasLoader{
  pointer-events: none;
  opacity: 0.9;
}
/* ================= CELEST PERSONALIZATION ================== */
.celestPz__mount{ margin:12px 0; }
.celestPz__card{
  width:100%; text-align:left; display:grid; grid-template-columns:auto 1fr; gap:12px;
  padding:14px; border-radius:16px;
  border:1.5px solid transparent;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(90deg,#7b5cff,#00c2ff,#ffd166,#ff6ac1,#7b5cff) border-box;
  transition: transform .06s ease, box-shadow .2s ease;
}
.celestPz__card:active{ transform:scale(.995); }
.celestPz__thumb{ width:64px; height:64px; border-radius:12px; overflow:hidden; background:#f6f6f6; }
.celestPz__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.celestPz__content{ display:grid; gap:4px; align-content:center; }
.celestPz__title{ font-weight:700; font-size:16px; }
.celestPz__price{ font-size:13px; color:#777; }
.celestPz__desc{ font-size:14px; color:#555; }

.celestPz__card--summary{ padding:14px 14px 10px; }
.celestPz__summaryHead{ display:flex; align-items:center; gap:10px; }
.celestPz__edit{
  margin-left:auto; padding:8px 12px; border-radius:999px; background:#fff; border:1px solid transparent;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(90deg,#7b5cff,#00c2ff,#ffd166,#ff6ac1,#7b5cff) border-box;
}
.celestPz__summaryBody{ margin-top:6px; }
.celestPz__summaryText{ font-size:14px; color:#333; line-height:1.45; }
.celestPz__summaryPrice{ font-size:13px; color:#777; margin-top:4px; }
.celestPz__remove{
  margin-top:6px; background:none; border:0; color:#111; text-decoration:underline; padding:0;
}

/* Modal */
.celestPz__modal[hidden]{ display:none; }
.celestPz__modal{ position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:10050; display:flex; align-items:flex-end; }
.celestPz__dialog{
  position:fixed; left:0; right:0; bottom:0;
  max-height:88vh; background:#fff; border-radius:18px 18px 0 0; padding:16px;
  transform:translateY(16px); opacity:0; transition:transform .25s ease, opacity .25s ease;
  display:grid; gap:14px;
}
.celestPz__dialog.is-open{ transform:translateY(0); opacity:1; }
.celestPz__close{
  position:absolute; right:12px; top:12px; width:36px; height:36px; border-radius:999px; background:#000; border:0; color:#fff; display:grid; place-items:center; cursor:pointer; z-index:3;
}
.celestPz__header h3{ font-size:18px; margin:0 36px 0 0; }

.celestPz__preview{ position:relative; background:#fafafa; border-radius:12px; overflow:hidden; display:grid; place-items:center; min-height:220px; }
.celestPz__previewImg{ width:100%; height:auto; display:block; }
.celestPz__ph{ width:100%; height:240px; background:repeating-linear-gradient(45deg,#f1f1f1,#f1f1f1 10px,#f7f7f7 10px,#f7f7f7 20px); }
.celestPz__letters{
  position:absolute; transform:translate(-50%, -50%); font-weight:700; letter-spacing:.04em;
  font-size: clamp(14px, var(--pz-font,22%), 64px);
  pointer-events:none;
}

.celestPz__form{ display:grid; gap:14px; }
.celestPz__row{ display:grid; gap:8px; }
.celestPz__label{ font-weight:700; }
.celestPz__inputs{ display:flex; gap:10px; }
.celestPz__in{
  width:64px; height:48px; border-radius:12px; border:1px solid #ddd; text-align:center; font-size:20px; font-weight:700;
}
.celestPz__colors{ display:flex; flex-wrap:wrap; gap:12px; }
.celestPz__sw{ width:36px; height:36px; border-radius:999px; border:2px solid #fff; box-shadow:0 0 0 1px #ccc; padding:0; }
.celestPz__sw span{ display:block; width:100%; height:100%; border-radius:999px; }
.celestPz__sw.is-active{ box-shadow:0 0 0 2px #111; }

.celestPz__radios{ display:flex; gap:14px; }
.celestPz__actions{ display:grid; gap:10px; grid-template-columns:1fr 1fr; }
.celestPz__confirm{
  padding:12px; border-radius:999px; background:#000; color:#fff; border:1px solid #000; font-weight:700;
}
.celestPz__confirm[disabled]{ opacity:.45; }
.celestPz__reset{
  padding:12px; border-radius:999px; background:#fff; color:#000; border:1px solid #000; font-weight:700;
}
.celestPz__legal{ text-align:center; font-size:13px; }
.celestPz__legal a{ color:#111; text-decoration:underline; }

/* Desktop: bajo el header, dialog compacto a la derecha si quieres */
@media (min-width: 990px){
  .celestPz__modal{ align-items:flex-start; }
  .celestPz__dialog{
    top: 96px; bottom:auto; left:50%; right:auto; width:560px; border-radius:12px; transform:translateY(-8px);
  }
  .celestPz__dialog.is-open{ transform:translateY(0); }
}
/* --- Ajustes finos (overrides) --- */
.celestPers{ margin-top: 8px; }                 /* baja un poco el módulo tras el selector de talla */
@media (min-width:990px){ .celestPers{ margin-top: 10px; } }

/* Acciones "Modificar / Eliminar" a la derecha, alineadas con la última línea del resumen */
.celestPers__summary{
  display:grid;
  grid-template-columns: 1fr auto;
  gap: 8px 12px;
  align-items:end;
}
.celestPers__sumList{ grid-column:1; margin:0; }
.celestPers__sumActions{
  grid-column:2;
  align-self:end;
  justify-self:end;
  display:flex;
  gap:8px;
}

/* Botones más compactos */
.celestPers__open,
.celestPers__mod,
.celestPers__del{ min-height:34px; padding:6px 12px; font-size:14px; }

/* Monograma: letra + punto sin espacios y con línea base limpia */
.celestPers__monogram{ letter-spacing:.01em; line-height:1; }
/* === Selector de talla: botón ancho completo con texto a la izq. + chevron === */
#celest-mobile-pdp .celestPdp__sizeWrap{ position:relative; }

/* La fila pasa a tener solo el botón a ancho completo */
#celest-mobile-pdp .celestPdp__sizeRow{
  display:block !important;
  margin: 10px 0 4px !important;
}

/* Botón "seleccione su talla" */
#celest-mobile-pdp .celestPdp__sizeBtn{
  position:relative !important;
  width:100% !important;
  min-height:48px !important;
  padding:14px 44px 14px 14px !important; /* texto a la izq., espacio para el icono */
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#111 !important;
  border:1px solid #111 !important;
  font-weight:600 !important;
}

/* Chevron a la derecha (como desplegable) */
#celest-mobile-pdp .celestPdp__sizeBtn::after{
  content:"";
  position:absolute; right:14px; top:50%; transform:translateY(-50%) rotate(-45deg);
  width:10px; height:10px;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  opacity:.9;
}

/* Estado seleccionado: negro con texto blanco */
#celest-mobile-pdp .celestPdp__sizeBtn.has-selection,
#celest-mobile-pdp .celestPdp__sizeBtn.is-open{
  background:#111 !important; color:#fff !important; border-color:#111 !important;
}

/* Enlace "Guía de tallas" arriba-derecha con subrayado */
#celest-mobile-pdp .celestPdp__guideBtn{
  position:absolute !important;
  right:0; top:-26px;
  background:none !important; border:0 !important;
  padding:0 !important; min-height:auto !important;
  color:#111 !important; font-weight:600 !important; font-size:14px !important;
  text-decoration: underline !important;
}

/* Botón de talla en error (intentan añadir sin talla) */
#celest-mobile-pdp .celestPdp__sizeBtn.is-error{
  color:#c40000 !important;
  border-color:#c40000 !important;
  animation: celestShake .34s ease-in-out both;
}
@keyframes celestShake{
  10%, 90% { transform: translateX(-1px); }
  20%, 80% { transform: translateX(2px); }
  30%, 50%, 70% { transform: translateX(-4px); }
  40%, 60% { transform: translateX(4px); }
}

/* CTA: negro por defecto, gris cuando está AGOTADO */
#celest-mobile-pdp .celestPdp__addBtn{
  background:#111 !important;
  color:#fff !important;
  opacity:1 !important;
}

/* Estado AGOTADO explícito (clase añadida por JS) */
#celest-mobile-pdp .celestPdp__addBtn.is-soldout{
  background:#e5e5e5 !important;   /* gris claro */
  color:#999 !important;
  border-color:#e5e5e5 !important;
  pointer-events:none !important;
}

/* No forzamos el disabled genérico: sólo gris si es .is-soldout */
#celest-mobile-pdp .celestPdp__addBtn[disabled]:not(.is-soldout){
  opacity:1 !important;
}


/* === FIX: "Guía de tallas" a la derecha, misma altura del botón === */
#celest-mobile-pdp .celestPdp__sizeWrap,
#celest-mobile-pdp .celestPdp__sizeRow{
  position: relative !important; /* referencia para el absolute */
}

#celest-mobile-pdp .celestPdp__guideBtn{
  position: absolute !important;
  top: -26px;              /* misma altura que antes */
  right: 0;                /* pegado a la derecha */
  left: auto !important;   /* evita que algún left anterior lo centre */
  width: auto !important;  /* rompe 100% heredado del tema */
  max-width: none !important;
  display: inline-block !important;
  text-align: right !important;

  /* estilo de link */
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  min-height: auto !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111 !important;
  text-decoration: underline !important;
  cursor: pointer;
}

/* Opcional: microajuste por breakpoint */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__guideBtn{ top: -24px; }
}
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__guideBtn{ top: -28px; }
}

/* ===== PDP móvil: header superpuesto y colores negros ===== */
@media (max-width: 989px){
  /* La galería sube “debajo” del header */
  body.celest-pdp-hero .celestPdp__gallery,
  body.celest-pdp-hero .product__media-list,
  body.celest-pdp-hero .media-gallery {
    margin-top: calc(var(--header-height, 64px) * -1) !important;
  }

  /* Estado transparente (sobre foto) */
  body.celest-pdp-hero header.celest-header--transparent{
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Al bajar: fondo blanco (sólido) */
  body.celest-pdp-hero header.celest-header--solid{
    background: #fff !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.08) !important;
  }

  /* Texto e iconos: siempre negros (arriba y abajo) */
  body.celest-pdp-hero header.header{
    color:#111 !important;
  }
  body.celest-pdp-hero header.header a,
  body.celest-pdp-hero header.header .header__nav-icon,
  body.celest-pdp-hero header.header svg{
    color:#111 !important;
    fill: currentColor !important;
    stroke: currentColor !important;
  }

  /* Si existe “transparent_logo” (claro), ocúltalo para usar el logo normal oscuro */
  body.celest-pdp-hero header.header .header__logo-image--transparent{ display:none !important; }
  body.celest-pdp-hero header.header .header__logo-image{ display:inline-block !important; opacity:1 !important; }
}
/* ===== Celest • PDP hero header ===== */

/* 3.1 Header transparente encima de la galería (solo PDP + móvil) */
@media (max-width: 989px){
  .celest-pdp-hero #celest-header{
    position: sticky;      /* ya lo es por la sección, reforzamos */
    top: 0;
    background: transparent !important;
    box-shadow: none !important;
    z-index: 1000;
  }

  /* La galería se "mete" bajo el header */
  .celest-pdp-hero .celestPdp__gallery{
    /* sube la galería para aprovechar todo el alto desde arriba */
    margin-top: calc(-1 * var(--header-height, 64px));
  }

  /* 3.2 Cuando el header está transparente, todo en negro */
  .celest-pdp-hero .celest-header--transparent,
  .celest-pdp-hero .celest-header--transparent *{
    color: #000 !important;
    fill: #000 !important;
    stroke: #000 !important;
  }

  /* Si los iconos son SVG con currentColor, esto basta */
  .celest-pdp-hero .celest-header--transparent svg{
    color: #000 !important;
  }

  /* 3.3 Al hacer scroll, el header se vuelve blanco */
  .celest-pdp-hero #celest-header.is-scrolled{
    background: #fff !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
  }
}

/* Desktop: no tocamos nada visual salvo seguridad de color si quieres */
@media (min-width: 990px){
  .celest-pdp-hero .celest-header--transparent *{
    color: #000;
  }
}
/* ===== PDP • Header negro 100% + iconos con contorno ===== */
@media (max-width: 989px){
  /* 1) Fuerza negro sólido en textos/enlaces del header (sin desvanecidos) */
  .celest-pdp-hero #celest-header,
  .celest-pdp-hero #celest-header * {
    color: #000 !important;
  }
  .celest-pdp-hero #celest-header .link-faded,
  .celest-pdp-hero #celest-header .link-faded-reverse {
    opacity: 1 !important;
  }

  }

  /* 3) Iconos del header: contorno negro, relleno transparente */
  .celest-pdp-hero #celest-header .header__nav-icon,
  .celest-pdp-hero #celest-header .header__nav-icon * {
    fill: transparent !important;
    stroke: #000 !important;
    stroke-width: 1.9px !important;     /* ajusta a 1.6–2.2 si lo quieres más fino/grueso */
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    opacity: 1 !important;
  }

  /* 4) Hamburguesa también a trazo negro (algunos temas la dibujan con fill) */
  .celest-pdp-hero #celest-header .icon-hamburger *,
  .celest-pdp-hero #celest-header .icon--hamburger * {
    fill: transparent !important;
    stroke: #000 !important;
    stroke-width: 2px !important;
  }

  /* 5) Burbuja del carrito (puntito): negro con borde blanco como referencia de tus fotos */
  .celest-pdp-hero #celest-header cart-dot {
    background: #000 !important;
    border: 2px solid #fff !important;
  }
}

/* En desktop mantenemos negro sin opacidad si el header queda transparente por configuración */
@media (min-width: 990px){
  .celest-pdp-hero #celest-header .header__logo-image,
  .celest-pdp-hero #celest-header .header__logo-text { opacity: 1 !important; }
  .celest-pdp-hero #celest-header .header__nav-icon,
  .celest-pdp-hero #celest-header .header__nav-icon *{
    fill: transparent !important; stroke: #000 !important;
  }
}
/* Nota roja dentro del popover */
#celest-mobile-pdp .celestPdp__sizeNote{
  color:#c40000;
  font-size:13px;
  font-weight:600;   /* 600 queda visualmente más limpio */
  margin-left:10px;  /* al lado de “Selecciona tu talla” */
}

/* Estados deshabilitados que SÍ usa el JS */
#celest-mobile-pdp .celestPdp__size.is-disabled,
#celest-mobile-pdp .celestPdp__size:disabled{
  cursor:not-allowed;
  opacity:.35;
}

/* Sacudida cuando eligen una talla sin stock (el JS aplica .is-error al botón grande) */
#celest-mobile-pdp .celestPdp__sizeBtn.is-error{
  animation: celestShake .34s ease-in-out both;
}
/* Nota de disponibilidad al lado del título del sheet */
#celest-mobile-pdp .celestPdp__sizeNote{
  margin-left: 8px;
  color:#c40000;
  font-weight:600;
  font-size:13px;
}
/* ===== CELEST • Swatch de color agotado ===== */
#celest-mobile-pdp .celestPdp__swatch.is-disabled{
  opacity: .45;
  filter: grayscale(1);
  cursor: not-allowed;
  position: relative;
}

/* Diagonal sutil (tachado) sobre el swatch */
#celest-mobile-pdp .celestPdp__swatch.is-disabled::after{
  content:"";
  position:absolute; inset:0;
  border-radius:12px;
  background:
    linear-gradient(135deg, rgba(0,0,0,.22) 2px, transparent 2px) no-repeat;
  background-size: 200% 2px;
  background-position: -10% 50%;
}
/* ===== CELEST • Swatch de color agotado ===== */
#celest-mobile-pdp .celestPdp__swatch.is-soldOut{
  opacity:.45; position:relative; cursor:pointer; /* clicable para informar */
}
#celest-mobile-pdp .celestPdp__swatch.is-soldOut::after{
  content:"";
  position:absolute; inset:6px;
  border-radius:10px;
  pointer-events:none;
  /* línea diagonal */
  background:
    linear-gradient(135deg, transparent 48%, rgba(0,0,0,.75) 49%, rgba(0,0,0,.75) 51%, transparent 52%);
}
#celest-mobile-pdp .celestPdp__swatch.is-soldOut img{
  filter: grayscale(100%);
}
/* === CELEST • Aviso de stock bajo en botón de talla === */
.celestPdp__sizeBtn{
  position: relative;               /* ancla para la etiqueta derecha */
  padding-right: 74px !important;   /* deja espacio al texto + chevron */
}
.celestPdp__sizeBtn .js-sizeBtnLabel{
  display: inline-block;
}

/* Texto de stock bajo a la derecha, centrado vertical */
.celestPdp__sizeStock{
  position: absolute;
  right: 30px;                      /* antes del chevron */
  top: 50%;
  transform: translateY(-50%);
  font-weight: 700;
  font-size: 14px;
  white-space: nowrap;
  pointer-events: none;
}

/* Cuando el botón está “seleccionado” (fondo negro) */
.celestPdp__sizeBtn.has-selection .celestPdp__sizeStock,
.celestPdp__sizeBtn.is-open .celestPdp__sizeStock{
  color: #fff;
}

/* Si tu tema pone el botón claro, forzamos contraste negro */
.celestPdp__sizeBtn:not(.has-selection):not(.is-open) .celestPdp__sizeStock{
  color: #111;
}
/* ===== CELEST • PRE-ORDER UI ============================================== */

/* Fila título + etiqueta a la derecha */
.celestPdp__titleWrap{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
}

/* Etiqueta negra "Pre-orden" */
.celestPdp__pill{
  display:inline-block; padding:4px 10px;
  background:#000; color:#fff; border-radius:999px;
  font-size:12px; font-weight:700; white-space:nowrap;
}

/* Banner de aviso PRE-ORDEN (sobre el footer del mini-cart) */
.celestPdp__preNote{ margin:10px 0 12px; }
.celestPdp__preNoteBox{
  background:#fff4dc; color:#6b4e00; border-radius:10px;
  padding:12px 14px; font-size:14px; line-height:1.45;
  box-shadow:0 10px 18px -8px rgba(0,0,0,.15);
}
.celestPdp__preNoteBox b{ color:#000; }
/* === CELEST • Badges (Pre-orden / Personalizado) === */
.celestBadge{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;         /* <- evita corte tipo “Pre- / orden” */
  vertical-align:middle;
}
.celestBadge--ghost{ background:#fff; color:#111; border:1px solid #111; }

/* Si van debajo del título, un pequeño margen */
.celestCart__titleRow{ display:grid; gap:6px; }
/* === CELEST • Nota bajo el CTA (metacampo) === */
#celest-mobile-pdp .celestPdp__ctaNote{
  margin-top: 8px;
  font-weight: 400 !important;   /* no en negrita */
  font-size: 14px;
  line-height: 1.45;
  color: #555;
}

/* Ajuste en desktop opcional */
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__ctaNote{ font-size: 14.5px; }
}
/* === CELEST • Mini-cart (desktop): mostrar 2–3 productos visibles === */
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__cartBody{
    max-height: 78vh !important;
  }
  #celest-mobile-pdp .celestPdp__cartItems,
  #celest-mobile-pdp .celestPdp__cartBody .js-cartItems,
  #celest-mobile-pdp .celestPdp__cartBody .is-scrollArea{
    max-height: 52vh !important; /* espacio para varias tarjetas */
    min-height: 260px !important;
    overflow: auto !important;
  }
}
/* === CELEST • Mini-cart adaptativo === */
#celest-mobile-pdp .celestPdp__cartBody {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
}

/* Lista de items: scrollable */
#celest-mobile-pdp .celestPdp__cartBody .js-cartItems {
  flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  margin: 4px 0 6px; /* menos aire */
}

/* Footer más compacto */
#celest-mobile-pdp .celestPdp__cartFooter {
  padding-top: 4px;
  padding-bottom: 4px;
}
#celest-mobile-pdp .celestPdp__shipBox,
#celest-mobile-pdp .celestPdp__eta,
#celest-mobile-pdp .celestPdp__cartSubtotal {
  margin: 4px 0 !important; /* reducir espacio vertical */
}

/* Desktop: estirar hasta casi arriba y abajo */
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__cartBody {
    max-height: 86vh; /* aprovecha pantalla */
  }
  #celest-mobile-pdp .celestPdp__cartBody .js-cartItems {
    max-height: 60vh; /* deja espacio para subtotal/envío */
  }
}

/* Mobile: usa casi toda la altura */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__cartBody {
    max-height: 90vh;
  }
  #celest-mobile-pdp .celestPdp__cartBody .js-cartItems {
    max-height: 65vh;
  }
}
/* === FIX: evitar “deformación” bajo la galería (solo pan vertical) === */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__info,
  #celest-mobile-pdp .celestPdp__option,
  #celest-mobile-pdp .celestPdp__sizeWrap,
  #celest-mobile-pdp .celestPdp__cta,
  #celest-mobile-pdp .celestPdp__blocks {
    touch-action: pan-y !important;       /* bloquea horizontales en esta zona */
    -ms-touch-action: pan-y !important;
    overscroll-behavior-x: contain;       /* corta la cadena de overscroll */
  }
}
/* === FIX: evitar “deformación” bajo la galería (solo pan vertical) === */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__info,
  #celest-mobile-pdp .celestPdp__option,
  #celest-mobile-pdp .celestPdp__sizeWrap,
  #celest-mobile-pdp .celestPdp__cta,
  #celest-mobile-pdp .celestPdp__blocks {
    touch-action: pan-y !important;       /* bloquea horizontales en esta zona */
    -ms-touch-action: pan-y !important;
    overscroll-behavior-x: contain;       /* corta la cadena de overscroll */
  }
}
/* === FIX: evitar “deformación” bajo la galería (solo pan vertical) === */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__info,
  #celest-mobile-pdp .celestPdp__option,
  #celest-mobile-pdp .celestPdp__sizeWrap,
  #celest-mobile-pdp .celestPdp__cta,
  #celest-mobile-pdp .celestPdp__blocks {
    touch-action: pan-y !important;       /* bloquea horizontales en esta zona */
    -ms-touch-action: pan-y !important;
    overscroll-behavior-x: contain;       /* corta la cadena de overscroll */
  }
}
/* === FIX móvil: Premium box pegado a la galería (v2) === */
@media (max-width: 989px){

  /* 1) La galería no deja “aire” debajo */
  #celest-mobile-pdp .celestPdp__gallery,
  #celest-mobile-pdp .product__media-list,
  #celest-mobile-pdp .media-gallery{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
  }

  /* Si existe la barra/contador, sin margen extra */
  #celest-mobile-pdp .celestPdp__progress,
  #celest-mobile-pdp .celestPdp__progressWrap{
    margin-bottom: 0 !important;
  }

  /* 2) El contenedor de info arranca “pegado” arriba */
  #celest-mobile-pdp .celestPdp__info{
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* 3) El primer hijo dentro de la info (tu premium box) sin margen superior */
  #celest-mobile-pdp .celestPdp__info > *:first-child{
    margin-top: 0 !important;
  }

  /* 4) El propio premium box (kicker) sin margen arriba */
  #celest-mobile-pdp .celestPdp__info .celestPdp__kicker,
  #celest-mobile-pdp .celestPdp__kicker{
    margin-top: 0 !important;
  }

  /* 5) Por si el tema añade separación entre bloques adyacentes */
  #celest-mobile-pdp .celestPdp__gallery + .celestPdp__info,
  #celest-mobile-pdp .product__media-list + .celestPdp__info,
  #celest-mobile-pdp .media-gallery + .celestPdp__info,
  #celest-mobile-pdp .Product__Info{
    margin-top: 0 !important;
  }
}
/* === CELEST • Galería: ocultar slides filtradas por color === */
#celest-mobile-pdp .celestPdp__slide.is-hidden,
#celest-mobile-pdp .product__media-item.is-hidden{
  display: none !important;
}
/* === FIX CRÍTICO (móvil): asegurar que la ✕ del pop-up de tallas sea visible === */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__sizeSheet .celestPdp__closeSheet{
    display: grid !important;
    place-items: center;
  }
}
/* === FIX: tachado visible también dentro del contenido del botón === */
#celest-mobile-pdp .celestPdp__size.is-disabled,
#celest-mobile-pdp .celestPdp__size[disabled]{
  opacity:.35; cursor:not-allowed; text-decoration: line-through;
}
#celest-mobile-pdp .celestPdp__size.is-disabled * ,
#celest-mobile-pdp .celestPdp__size[disabled] * {
  text-decoration: inherit;
}
/* === CELEST • ETA: grupo centrado, texto alineado a la izquierda (hasta 2 líneas) === */
#celest-mobile-pdp .celestEta{
  display: flex;
  align-items: flex-start;        /* alinea la parte superior de icono y texto */
  justify-content: center;        /* centra el GRUPO (icono + texto) */
  gap: 8px;
  text-align: initial !important; /* evita que herede centrado global */
}

#celest-mobile-pdp .celestEta__icon{
  flex: 0 0 auto;
  line-height: 0;
  display: inline-grid;
  place-items: center;
  translate: 0 .5px;              /* microajuste vertical */
}

#celest-mobile-pdp .celestEta__text{
  /* IZQUIERDA siempre */
  text-align: left !important;

  /* Hasta 2 líneas con ellipsis si se pasa */
  white-space: normal !important;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;          /* máximo 2 líneas */
  line-clamp: 2;
  -webkit-box-orient: vertical;

  max-width: min(100%, var(--eta-max, 680px));
}

/* (Opcional) Si en desktop quieres volver a 1 línea:
@media (min-width: 990px){
  #celest-mobile-pdp .celestEta__text{
    -webkit-line-clamp: 1;
    line-clamp: 1;
  }
}
*/
/* === CELEST • Indicador de inventario (puntito + texto) === */
#celest-inventory-indicator.celestInv{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin: 8px 0 0;
  font-size: 14px;
  color:#111;
}

#celest-inventory-indicator .celestInv__dot{
  --celest-inv-color: #28A745;
  width: 8px; height: 8px;
  border-radius: 999px;
  background: var(--celest-inv-color);
  box-shadow: 0 0 0 0 rgba(0,0,0,0);
  flex: 0 0 auto;
}

#celest-inventory-indicator .celestInv__dot.is-pulsing{
  animation: celestInvPulse 1.6s ease-in-out infinite;
}
@keyframes celestInvPulse{
  0%   { box-shadow: 0 0 0 0 rgba(0,0,0,.12); transform: scale(1); }
  70%  { box-shadow: 0 0 0 6px rgba(0,0,0,0); transform: scale(1.05); }
  100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); transform: scale(1); }
}

#celest-inventory-indicator .celestInv__text b{
  font-weight: 700;
}

/* Alineación y coherencia tipográfica */
#celest-mobile-pdp #celest-inventory-indicator{
  font-family: inherit;
}

/* Ubicación debajo de swatches: si tu bloque de swatches usa estas clases,
   puedes forzar un pequeño margen superior coherente */
#celest-mobile-pdp .celestPdp__swatches + #celest-inventory-indicator{
  margin-top: 6px;
}
/* ============================================================
   CELEST • PDP DESKTOP LAYOUT (tipo Nude Project)
   Aplica SOLO en escritorio. Móvil queda igual.
   Se apoya en:
   - #celest-mobile-pdp
   - .celestPdp
   - .celestPdp__gallery
   - .celestPdp__info
   ============================================================ */

@media (min-width: 1024px) {

  /* Contenedor principal 2 columnas */
  #celest-mobile-pdp .celestPdp{
    max-width: 1440px;
    margin: 0 auto;
    padding: 32px 40px 48px;
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(360px, 1fr);
    column-gap: 48px;
    align-items: flex-start;
    box-sizing: border-box;
  }

  /* Galería grande a la izquierda */
  #celest-mobile-pdp .celestPdp__gallery{
    order: 1;
    width: 100%;
  }

  /* Asegurar imágenes limpias, sin marcos raros */
  #celest-mobile-pdp .celestPdp__gallery img,
  #celest-mobile-pdp .celestPdp__gallery video{
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
    background: #f7f7f7;
  }

  /* Panel de información a la derecha */
  #celest-mobile-pdp .celestPdp__info{
    order: 2;
    width: 100%;
    max-width: 520px;
    margin: 0;
    padding: 0;
    text-align: left;
    position: sticky;
    top: 96px; /* respeta header fijo */
    align-self: flex-start;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  /* Jerarquía limpia dentro del panel derecho */
  #celest-mobile-pdp .celestPdp__info .celestPdp__title{
    margin-top: 6px;
  }

  #celest-mobile-pdp .celestPdp__info .celestPdp__price{
    margin-bottom: 10px;
  }

  /* Bloques extra (beneficios, acordeones, etc.) alineados a izq */
  #celest-mobile-pdp .celestPdp__blocks,
  #celest-mobile-pdp .celestPdp__cta,
  #celest-mobile-pdp .celestPz__mount,
  #celest-mobile-pdp .celestPers,
  #celest-mobile-pdp .celestEta,
  #celest-mobile-pdp .celestBenefits{
    width: 100%;
    text-align: left;
  }

  /* Evitar scroll horizontal indeseado */
  #celest-mobile-pdp,
  #celest-mobile-pdp .celestPdp{
    overflow-x: hidden;
  }
}

/* Nota:
   - No se tocan estilos @media (max-width: 989px) existentes.
   - Todos los scripts que usan las clases/IDs actuales siguen funcionando.
*/
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__slides{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    width: auto !important;
    transform: none !important;
  }
  #celest-mobile-pdp .celestPdp__slide{ width:100%!important; margin:0; }
  #celest-mobile-pdp .celestPdp__slide img,
  #celest-mobile-pdp .celestPdp__slide video{
    width:100%; height:auto; object-fit:cover;
  }
  #celest-mobile-pdp .celestPdp__progress{ display:none!important; }
}
/* =========================================
   CELEST • PDP DESKTOP NUDE-LIKE FINAL v6
   - Galería más protagonista (fotos más grandes)
   - Panel derecho ligeramente más estrecho
   - Solo pequeño espacio entre galería e info
   - Alineado estilo Nude Project
========================================= */
@media (min-width: 1024px){

  /* GRID PRINCIPAL — 2 columnas */
  #celest-mobile-pdp.celestPdp{
    display: grid;
    /* Galería ~65%, Info ~35% */
    grid-template-columns: 1.85fr 1fr;
    column-gap: 22px;          /* pequeño espacio entre fotos y panel */
    max-width: 1920px;
    margin: 0 auto 80px;
    padding-left: 24px;        /* margen lateral izquierdo suave */
    padding-right: 24px;       /* panel derecho casi al borde, pero con respiro */
    align-items: flex-start;
  }

  /* GALERÍA */
  #celest-mobile-pdp .celestPdp__gallery{
    margin: 0;
    padding: 0;
  }

  #celest-mobile-pdp .celestPdp__slides{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;                 /* menos espacio interno, fotos se sienten más grandes */
  }

  #celest-mobile-pdp .celestPdp__slide{
    margin: 0;
  }

  #celest-mobile-pdp .celestPdp__slide img,
  #celest-mobile-pdp .celestPdp__slide video{
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;         /* llena bien cada celda, look Nude Project */
  }

  /* PANEL DE INFORMACIÓN */
  #celest-mobile-pdp .celestPdp__info{
    max-width: 540px;          /* un poco más ancho que antes */
    margin-left: auto;         /* se pega hacia la derecha del grid */
    margin-right: 0;
    padding-top: 0 !important;
    margin-top: 0 !important;
    align-self: flex-start;
  }

  /* Primer bloque del panel (badge / título) pegado arriba */
  #celest-mobile-pdp .celestPdp__info > *:first-child{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Premium box y título sin hueco extra arriba */
  #celest-mobile-pdp .celestPdp__title,
  #celest-mobile-pdp .celestPdp__info .premiumBox{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Asegurar que modales / overlays sigan funcionando correctamente */
  #celest-mobile-pdp .celestPdp__zoomModal,
  #celest-mobile-pdp .celestPdp__cartModal,
  #celest-mobile-pdp .celestLoaderOverlay{
    position: fixed;
    inset: 0;
  }
}
/* =========================================
   CELEST • Desktop: reducir espacios entre
   talla / CTA / personalización (50% menos)
   Solo escritorio (>= 990px)
   ========================================= */
@media (min-width: 990px){

  /* Entre selector de talla y CTA */
  #celest-mobile-pdp .celestPdp__sizeRow{
    margin: 4px 0 2px !important;   /* antes 8px arriba → ahora la mitad */
  }

  /* Separación " */
  #celest-mobile-pdp .celestPdp__cta{
    margin-top: 7px !important;     /* antes 14px → ahora la mitad */
  }

  /* Bloque de personalización principal (tarjeta CelestPz) */
  #celest-mobile-pdp .celestPz__mount{
    margin-top: 6px !important;     /* antes 12px → ahora la mitad */
    margin-bottom: 6px !important;
  }

  /* Resumen / acciones de personalización (CelestPers) */
  #celest-mobile-pdp .celestPers{
    margin-top: 4px !important;     /* antes ~8px → ahora la mitad */
  }

  /* Si hubiera nota bajo el CTA relacionada con personalización,
     también la acercamos un poco para mantener el conjunto compacto */
  #celest-mobile-pdp .celestPdp__ctaNote{
    margin-top: 6px !important;
  }
}
/* =========================================================
   CELEST • PDP — Lupa hover desktop (versión afinada)
   - Solo escritorio
   - Estilo minimal acorde al tema: blanco, fino, elegante
   - Centro totalmente vacío, sin relleno
   ========================================================= */
@media (min-width: 990px){

  /* Contenedor preparado para overlay */
  #celest-mobile-pdp .celestPdp__slide{
    position: relative;
    overflow: hidden;
  }

  /* Transición suave en imagen/video */
  #celest-mobile-pdp .celestPdp__slide img,
  #celest-mobile-pdp .celestPdp__slide video{
    transition: opacity .22s ease, transform .22s ease;
  }

  /* Hover: ligera opacidad, muy sutil */
  #celest-mobile-pdp .celestPdp__slide:hover img,
  #celest-mobile-pdp .celestPdp__slide:hover video{
    opacity: 0.8;
  }

  /* RESET de intentos anteriores de lupa para este selector */
  #celest-mobile-pdp .celestPdp__slide::before,
  #celest-mobile-pdp .celestPdp__slide::after{
    content: "";
    position: absolute;
    pointer-events: none;
    opacity: 0;
    box-sizing: border-box;
    transition: opacity .22s ease, transform .22s ease;
    z-index: 6;
  }

  /* Círculo de la lupa:
     - 52px
     - trazo blanco fino
     - centro transparente
     - ligera sombra para destacar sobre fondos claros
  */
  #celest-mobile-pdp .celestPdp__slide::before{
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.92);
    box-shadow: 0 4px 12px rgba(0,0,0,.22);
    background: transparent;
  }

  /* Mango de la lupa:
     - línea blanca fina
     - parte inferior derecha del círculo
  */
  #celest-mobile-pdp .celestPdp__slide::after{
    width: 22px;
    height: 0;
    border-bottom: 2px solid #ffffff;
    left: 50%;
    top: 50%;
    transform-origin: left center;
    transform: translate(14px, 22px) rotate(42deg) scale(0.92);
  }

  /* Mostrar lupa al hover */
  #celest-mobile-pdp .celestPdp__slide:hover::before{
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
  #celest-mobile-pdp .celestPdp__slide:hover::after{
    opacity: 1;
    transform: translate(14px, 22px) rotate(42deg) scale(1);
  }
}
/* =========================================================
   CELEST • ZOOM FULLSCREEN (tipo Undergold)
   - No elimina estilos anteriores
   - Usa solo imágenes visibles (variante actual)
   ========================================================= */

/* Desactivar scroll del body cuando el zoom está abierto */
body.celestZoom-open {
  overflow: hidden;
}

/* Modal base */
.celestZoom {
  position: fixed;
  inset: 0;
  background: #ECECEC;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  z-index: 13000;
  transition: opacity 0.22s ease-in-out;
}

.celestZoom.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* Contenedor interno */
.celestZoom__inner {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* Imagen centrada con animación de entrada/salida */
.celestZoom__img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transform-origin: center center;
  transform: scale(0.96);
  opacity: 0;
  transition:
    transform 0.22s ease-out,
    opacity 0.22s ease-out;
  will-change: transform;
  cursor: zoom-in;
}

.celestZoom.is-open .celestZoom__img {
  transform: scale(1);
  opacity: 1;
}

/* Estado con zoom activo dentro del modal */
.celestZoom.is-zoomed .celestZoom__img {
  cursor: grab;
  transition:
    transform 0.18s ease-out,
    opacity 0.18s ease-out;
}

/* Controles circulares inferiores */
.celestZoom__controls {
  position: absolute;
  left: 50%;
  bottom: 32px;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 18px;
  z-index: 13002;
}

.celestZoom__btn {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: none;
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18);
  cursor: pointer;
  font-size: 22px;
  color: #222;
  transition:
    transform 0.12s ease-out,
    box-shadow 0.18s ease-out,
    background-color 0.18s ease-out,
    color 0.18s ease-out;
}

.celestZoom__btn span {
  line-height: 1;
  display: block;
  transform: translateY(-1px);
}

.celestZoom__btn:active {
  transform: scale(0.96);
  box-shadow: 0 3px 10px rgba(0,0,0,0.18);
}

/* Hover leve en desktop */
@media (hover: hover) and (pointer: fine) {
  .celestZoom__btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.22);
  }
}

/* ===== CELEST • Icono de lupa minimalista (solo círculo y + transparente) ===== */

/* === FIX: icono + SIEMPRE arriba del contador en móvil === */
@media (max-width: 989px){

  /* Asegura referencia de posicionamiento */
  #celest-mobile-pdp .celestPdp__gallery,
  #celest-mobile-pdp .celestPdp__slide{
    position: relative;
  }

  /* Sube el icono por encima de la barra/contador */
  #celest-mobile-pdp .celestZoom__iconMobile{
    position: absolute !important;

    /* ✅ ANCLADO ABAJO (no depende del alto de la imagen) */
    top: auto !important;
    bottom: calc(6px + 14px) !important;
    /* 6px = tu .celestPdp__progress bottom
       22px = “aire” para que nunca choque con el contador */

    /* Alineación derecha consistente con tu progress padding (16px) */
    right: max(5px, env(safe-area-inset-right, 0px)) !important;

    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: transparent;
    border: none;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    z-index: 2 !important; /* por encima del progress/counter */
    box-shadow: none;
  }

  /* Asegura que el contador quede “debajo” del icono (z-index menor) */
  #celest-mobile-pdp .celestPdp__progress{
    z-index: 2;
  }
}


/* Círculo negro fino con el símbolo + */
.celestZoom__iconMobile span {
  position: relative;
  display: block;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  border: 1.8px solid #111; /* línea negra del círculo */
}

.celestZoom__iconMobile span::before {
  content: "+";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  color: #111; /* símbolo + negro */
  line-height: 1;
}

/* El mango o línea diagonal de lupa se elimina completamente */
.celestZoom__iconMobile span::after {
  content: none;
}

/* Mostrar SOLO en mobile */
.celestZoom__iconMobile{ display:none; } /* default */
@media (max-width: 989px){ .celestZoom__iconMobile{ display:inline-flex; } }



/* Cursor zoom-in en escritorio */
@media (min-width: 990px) {
  #celest-mobile-pdp .celestPdp__slide {
    cursor: zoom-in;
  }
}

/* Transición de cierre */
.celestZoom.is-closing .celestZoom__img {
  transform: scale(0.96);
  opacity: 0;
}
.celestZoom.is-closing {
  opacity: 0;
}

/* Garantiza que nada del tema tape los controles */
.celestZoom,
.celestZoom * {
  box-sizing: border-box;
}

/* =========================================================
   CELEST • Ajuste iconos y botón superior (cerrar)
   ========================================================= */

/* Corrige alineación SVG */
.celestZoom__btn svg {
  display: block;
}

/* Nuevo botón superior (X arriba derecha) */
.celestZoom__btnTop {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #ffffff;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18);
  cursor: pointer;
  z-index: 13005;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.celestZoom__btnTop:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 22px rgba(0,0,0,0.22);
}

.celestZoom__btnTop svg {
  stroke: #111;
}

/* En mobile, reducir tamaño ligeramente */
@media (max-width: 768px) {
  .celestZoom__btnTop {
    width: 46px;
    height: 46px;
    top: 14px;
    right: 14px;
  }
}
/* 5) FIX FINAL PDP MÓVIL:
   - Evitar scroll horizontal y "estiramiento" en la última foto
   - Sin romper el header transparente tipo hero
*/
@media (max-width: 989px){

  /* Aplica solo en páginas de producto / PDP Celest */
  body.template-product,
  body[data-template*="product"],
  body.celest-pdp-hero {
    overflow-x: hidden !important;   /* corta cualquier fuga lateral (barra 4/4, etc.) */
  }

  /* Galería dentro del módulo Celest: segura en ancho */
  #celest-mobile-pdp .celestPdp__gallery{
    max-width: 100vw;
  }

  #celest-mobile-pdp .celestPdp__slides{
    max-width: 100vw;
  }

  #celest-mobile-pdp .celestPdp__slide{
    max-width: 100vw;
  }

  /* Barra de progreso siempre dentro del viewport */
  #celest-mobile-pdp .celestPdp__progressTrack,
  #celest-mobile-pdp .celestPdp__progressBar{
    max-width: calc(100vw - 32px);
  }
}
/* =========================================
   CELEST • Mini-cart badges compactos (v2)
   - Evita que "Pre-orden" / "Personalizado"
     se estiren a todo el ancho
   - Compatible con grid (.celestCart__titleRow)
   - No rompe otros usos de las badges
   ========================================= */

/* 1) Pills dentro del mini-cart: estilo compacto */
#celest-mobile-pdp .celestPdp__cartItem .celestBadge,
#celest-mobile-pdp .celestPdp__cartItem .celestPdp__pill{
  display: inline-flex !important;        /* contenido, no barra */
  align-items: center;
  justify-content: center;
  padding: 4px 14px !important;
  border-radius: 999px !important;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap !important;
  box-sizing: border-box;
  width: auto !important;                 /* que mida según el texto */
  max-width: 100% !important;
}

/* 2) Si el tema las mete dentro de un contenedor, también compacto */
#celest-mobile-pdp .celestPdp__cartItem .celestBadge-wrapper,
#celest-mobile-pdp .celestPdp__cartItem .celestPdp__pill-wrapper{
  display: inline-flex !important;
  width: auto !important;
}

/* 3) Clave: dentro del grid .celestCart__titleRow
      evitamos el stretch (eso es lo que las hacía 100% ancho) */
#celest-mobile-pdp .celestCart__titleRow .celestBadge,
#celest-mobile-pdp .celestCart__titleRow .celestPdp__pill{
  justify-self: flex-start !important;    /* se quedan al inicio */
  align-self: center !important;
}

/* Por si el grid se aplica al wrapper */
#celest-mobile-pdp .celestCart__titleRow .celestBadge-wrapper,
#celest-mobile-pdp .celestCart__titleRow .celestPdp__pill-wrapper{
  justify-self: flex-start !important;
  align-self: center !important;
}
/* =========================================
   CELEST • Mini-cart: Personalizado = negro sólido
   - Hace que la etiqueta "Personalizado" (que hoy usa
     .celestBadge--ghost dentro del mini-cart) se vea
     igual que "Pre-orden": fondo negro + texto blanco.
   - Solo afecta badges ghost DENTRO del mini-cart Celest.
   ========================================= */

#celest-mobile-pdp .celestPdp__cartItem .celestBadge--ghost{
  background-color: #000 !important;
  color: #fff !important;
  border-color: #000 !important;
}

/* =========================================
   CELEST • Proporción de imágenes adaptable
   - Mobile: 4:5
   - Desktop: 1:1
   ========================================= */

/* 🔸 Vista MÓVIL (hasta 1023px): formato 4:5 */
@media (max-width: 1023px) {
  .celestPdp__gallery img,
  .celestCard__img img,
  .product__media img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    object-position: center;
  }

  .celestPdp__gallery,
  .celestCard__img,
  .product__media {
    aspect-ratio: 4 / 5;
    overflow: hidden;
  }
}

/* 🔹 Vista ESCRITORIO (desde 1024px): formato 1:1 */
@media (min-width: 1024px) {
  .celestPdp__gallery img,
  .celestCard__img img,
  .product__media img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
  }

  .celestPdp__gallery,
  .celestCard__img,
  .product__media {
    aspect-ratio: 1 / 1;
    overflow: hidden;
  }
}
/* Línea superior del primer bloque collapsible */
.celestAcc:first-of-type {
  border-top: 1px solid #e5e5e5;  /* mismo tono de la línea inferior */
}

/* Asegura que todas las líneas inferiores sigan iguales */
.celestAcc {
  border-bottom: 1px solid #e5e5e5;
}
/* Espacio arriba de la línea superior del primer collapsible SOLO en mobile */
@media (max-width: 767px) {
  .celestAcc:first-of-type {
    margin-top: 12px; /* puedes ajustar a 8px, 10px, 14px según se vea mejor */
  }
}
/* Contenedor horizontal qty + delete icon */
.celestPdp__qtyAndDelete {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
}

/* Botón eliminar */
.celestPdp__deleteItem {
  background: transparent;
  border: none;
  padding: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  opacity: 0.7;
}

.celestPdp__deleteItem:hover {
  opacity: 1;
}

/* Animación al hacer clic */
.celestPdp__deleteItem.loading {
  opacity: 0.3;
  pointer-events: none;
}
.celestPdp__price{
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.celestCartPrice--old{
  text-decoration: line-through;
  color: #b5b5b5;
  font-size: 0.9em;
}

.celestCartPrice--new{
  font-weight: 700;
}

.celestCartTag--discount{
  padding: 2px 8px;
  border-radius: 999px;
  background:rgb(3, 24, 84); /* ajusta al rosa de tu marca */
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
}
/* === Píldora negra para GIFT / GRATIS === */
.celestCartTag--gift{
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  background:rgb(0, 0, 0);          /* negro */
  color: #fff;               /* texto blanco */
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;
  margin-left: 6px;          /* separación respecto al precio */
  line-height: 1.2;
  white-space: nowrap;
}
/* === Premium Box sin subtitulo titulo alineado === */
#celest-mobile-pdp .premiumBox.premiumBox--noSub .premiumBox__txt{
    flex-direction: row;
    align-items: center;
  }

  #celest-mobile-pdp .premiumBox.premiumBox--noSub .premiumBox__title{
    margin-bottom: 0;
    line-height: 1.2;
  }
  /* ===== Ajustes cuando NO hay subtítulo ===== */

/* Más espacio arriba y título ligeramente más abajo */
#celest-mobile-pdp .premiumBox.premiumBox--noSub{
  padding-top: calc(var(--pb-pad-v-m) + 4px);   /* +6px extra en móvil */
  padding-bottom: calc(var(--pb-pad-v-m) + 2px);/* un pelín más de aire */
}

@media (min-width: 990px){
  #celest-mobile-pdp .premiumBox.premiumBox--noSub{
    padding-top: calc(var(--pb-pad-v-d) + 8px);   /* +8px extra en desktop */
    padding-bottom: calc(var(--pb-pad-v-d) + 4px);
  }
}

/* Ajuste del título SOLO en mobile cuando no hay subtítulo */
@media (max-width: 989px){
  #celest-mobile-pdp .premiumBox.premiumBox--noSub .premiumBox__title{
    margin-top: 0px;      /* Ajusta aquí: positivo = baja, negativo = sube */
    line-height: 1.25;
  }
}
/* Ajuste del título SOLO en desktop cuando no hay subtítulo */
@media (min-width: 990px){
  #celest-mobile-pdp .premiumBox.premiumBox--noSub .premiumBox__title{
    margin-top: 12px;     /* Ajusta aquí: positivo = baja, negativo = sube */
    line-height: 1.25;
  }
}


/* Premium Box más ancho SOLO cuando no hay subtítulo */
#celest-mobile-pdp .premiumBox.premiumBox--noSub{
  width: calc(100% + 12px);      /* 12px más ancho visual */
  margin-left: -6px;             /* centrar ampliación */
  margin-right: -6px;
}

/* ===== Premium Box FULL WIDTH en móvil ===== */
@media (max-width: 989px) {
  #celest-mobile-pdp .premiumBox{
    width: 100vw !important;          /* Ocupa todo el ancho REAL del viewport */
    max-width: 100vw !important;
    margin-left: calc(-1 * (50vw - 50%)) !important; /* elimina los márgenes del contenedor */
    margin-right: 0 !important;
    border-radius: 0 !important;      /* sin bordes redondeados */
  }

  /* Si usaste ancho extra cuando no hay subtítulo, lo neutralizamos en mobile */
  #celest-mobile-pdp .premiumBox.premiumBox--noSub{
    width: 100vw !important;
    margin-left: calc(-1 * (50vw - 50%)) !important;
    margin-right: 0 !important;
  }
}
/* ===== Ajuste del icono SOLO cuando NO hay subtítulo ===== */
#celest-mobile-pdp .premiumBox.premiumBox--noSub .premiumBox__info{
  transform: translateY(0px); /* bájalo 4px — puedes subir o bajar este valor */
}

@media (min-width: 990px){
  #celest-mobile-pdp .premiumBox.premiumBox--noSub .premiumBox__info{
    transform: translateY(6px); /* un poco más abajo en desktop */
  }
}
/* ===== precio sin negrita ===== */
.celestPrice--compare {
  text-decoration: line-through;
  opacity: 0.7;
  margin-left: 6px; /* separa un poco los dos precios */
}
/* Quitar negrita del precio dinámico */
.celestPrice,
.celestPrice--sale,
.celestPrice--regular,
.celestPrice--compare {
  font-weight: 400 !important;
}
/* Precio nuevo (con descuento) en rojo */
.celestPrice--sale {
  color: #D60000 !important; /* rojo elegante */
  font-weight: 400 !important; /* sin negrita */
}

/* Precio viejo tachado (mantener neutro) */
.celestPrice--compare {
  color: #444; 
  text-decoration: line-through;
  opacity: 0.7;
  margin-left: 6px;
}

/* Precios en general sin negrita */
.celestPrice,
.celestPrice--regular {
  font-weight: 400 !important;
}
/* Centrar todo el contenido del Premium Box */
#celest-mobile-pdp .premiumBox {
  text-align: center !important;
  justify-content: center;
  align-items: center;
}

/* Títulos centrados */
#celest-mobile-pdp .premiumBox__title {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}

/* Subtítulo / texto centrado */
#celest-mobile-pdp .premiumBox__desc,
#celest-mobile-pdp .premiumBox__text {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}

/* Si el ícono del modal también debe centrarse */
#celest-mobile-pdp .premiumBox__icon {
  margin-left: auto;
  margin-right: auto;
}
/* Reducir espacio entre el título y el subtítulo del Premium Box */
#celest-mobile-pdp .premiumBox__title {
  margin-bottom: -4px !important; /* Ajusta este valor: 2px, 4px, 6px */
}

#celest-mobile-pdp .premiumBox__desc,
#celest-mobile-pdp .premiumBox__text {
  margin-top: 0 !important;
}
/* === CELEST • Ocultar selector/guía de tallas por metacampo =================
   - Si custom.si_o_no_guia_de_tallas está en TRUE / "si"
   - Se ocultan:
     • Botón "Selecciona tu talla"
     • Botón "Guía de tallas"
     • Todo el bloque de talla (sizeWrap)
   ========================================================================== */

#celest-mobile-pdp[data-hide-size="true"] .celestPdp__sizeWrap{
  display: none !important;
}
/* === FIX ESCRITORIO: ALINEAR PANEL DERECHO ARRIBA
   CUANDO SE OCULTA EL SELECTOR DE TALLA / GUÍA === */
@media (min-width: 1024px){
  /* Asegura que las dos columnas se alineen al inicio */
  #celest-mobile-pdp .celestPdp{
    align-items: flex-start !important;
  }

  /* Panel derecho pegado arriba, sin margen ni padding extra */
  #celest-mobile-pdp .celestPdp__info{
    margin-top: 0 !important;
    padding-top: 0 !important;
    align-self: flex-start !important;
  }

  /* El primer bloque dentro del panel (premium box / título)
     también sin margen superior extra */
  #celest-mobile-pdp .celestPdp__info > *:first-child{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}
/* FIX: el zoom debe quedar POR ENCIMA de cualquier app/widget flotante */
body.celestZoom-open .celestZoom{
  z-index: 2147483647 !important; /* máximo práctico */
}

body.celestZoom-open .celestZoom__controls,
body.celestZoom-open .celestZoom__btnTop{
  z-index: 2147483647 !important;
}
/* =========================================================
   FIX: mini-cart encima de cualquier app/widget flotante
   ========================================================= */

.celestPdp__cartModal{
  position: fixed !important;
  inset: 0 !important;
}

/* Cuando el mini-cart está abierto, lo ponemos en el top absoluto */
body.celestCart-open .celestPdp__cartModal{
  z-index: 2147483647 !important;
  isolation: isolate !important; /* crea contexto y ayuda vs overlays */
}

/* Panel del carrito */
body.celestCart-open .celestPdp__cartBody{
  position: fixed !important; /* por si alguna regla del tema lo deja relativo */
  z-index: 2147483647 !important;
}

/* Botones/elementos internos importantes */
body.celestCart-open .celestPdp__cartClose,
body.celestCart-open .celestPdp__cartFooter{
  z-index: 2147483647 !important;
}
/* =========================================================
   FIX: Mini-cart — reducir espacio entre botones (footer)
   Pegar AL FINAL del CSS
   ========================================================= */

#celest-mobile-pdp .celestPdp__cartFooter{
  padding-top: -5px !important;      /* antes 10px */
  padding-bottom: -8px !important;   /* opcional: compacta el bloque */
}

/* Controla separación SOLO con gap */
#celest-mobile-pdp .celestPdp__cartActions{
  margin-top: 5px !important;       /* antes 12px */
  gap: 0px !important;              /* antes 10px */
}

/* Quita el “aire” que mete cada botón por su cuenta */
#celest-mobile-pdp .celestPdp__cartFooter .celestPdp__btn{
  margin-top: 0 !important;         /* clave: sube el botón negro */
}

/* Por si los botones NO están dentro de .celestPdp__cartActions */
#celest-mobile-pdp .celestPdp__cartFooter .celestPdp__btn + .celestPdp__btn{
  margin-top: 6px !important;       /* espacio pequeño entre ambos */
}
#celest-mobile-pdp .celestPdp__upsell{
  margin: 12px 0 10px;
}
#celest-mobile-pdp .celestPdp__upsell .essential-upsell-cross-sell-block{
  width: 100%;
}
.celestPdp__eta{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  text-align:center;
  margin-top:6px;
}

.celestPdp__eta .js-etaText{
  display:inline;
}
/* =========================================
   CELEST • Mini-cart: compactar bloque inferior
   - Menos aire entre shipBox y botones
   - Botón negro "Finalizar" más arriba
========================================= */

#celest-mobile-pdp .celestPdp__cartBody{
  /* reduce padding general del panel */
  padding-bottom: 12px !important;
}

/* Si tu panel tiene padding grande arriba/abajo, esto ayuda mucho */
#celest-mobile-pdp .celestPdp__cartSubtotal{
  margin-bottom: 10px !important;
}
/* =======================
   CELEST • Upsell slot + Empty state
   ======================= */

/* El slot de upsell dentro del scroll */
#celest-mobile-pdp .celestPdp__upsellSlot{
  width: 100%;
  margin: 12px 0 6px;
  padding-top: 12px;
  border-top: 1px solid #efefef;
}

/* Texto “La cesta está vacía” */
#celest-mobile-pdp .celestPdp__emptyText{
  text-align: center;
  font-weight: 700;
  letter-spacing: .06em;
  font-size: 14px;
  margin: 8px 0 14px;
}

/* Cuando no hay productos: centramos el contenido del área scroll */
#celest-mobile-pdp .js-cartItems.is-empty{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 42vh;          /* centra visualmente */
  padding: 12px 0;
}

/* En vacío, el slot no debe verse “cortado” */
#celest-mobile-pdp .js-cartItems.is-empty .celestPdp__upsellSlot{
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
  width: min(520px, 100%);
}


/* Mobile close: slide down */
@media (max-width: 989px){
  .celestPdp__cartBody{
    will-change: transform;
  }
  .celestPdp__cartBody.is-closing-down{
    transform: translate3d(0, 110%, 0) !important;
    transition: transform 260ms ease !important;
  }
}
/* ✅ FIX: padding negativo no sirve; fuerza compactación real */
#celest-mobile-pdp .celestPdp__cartFooter{
  padding-top: 4px !important;
  padding-bottom: 6px !important;
}

/* ✅ FIX: el scroll debe vivir en la lista, no en el panel */
#celest-mobile-pdp .celestPdp__cartBody{
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}
#celest-mobile-pdp .celestPdp__cartBody .js-cartItems{
  overflow: auto !important;
}
/* =========================
   CELEST • Mini-cart slide up (SOLO MOBILE)
========================= */
@media (max-width: 989px){
  /* estado base: fuera de pantalla */
  #celest-mobile-pdp .celestPdp__cartBody{
    transform: translate3d(0, 110%, 0);
    opacity: 1;
    transition: transform 320ms cubic-bezier(.2,.8,.2,1);
    will-change: transform;
  }

  /* abierto: sube */
  #celest-mobile-pdp .celestPdp__cartBody.is-open{
    transform: translate3d(0, 0, 0);
  }

  /* cerrando: baja suave (por si quieres distinto timing) */
  #celest-mobile-pdp .celestPdp__cartBody.is-closing{
    transform: translate3d(0, 110%, 0);
  }
}
/* ===== CELEST • Inline loader (qty +/- y trash) ===== */
.celestInlineLoader{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  display: inline-block;
  animation: celestSpin 900ms linear infinite;
}

.celestInlineLoaderWrap{
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
}

.celestPdp__qtyMini.is-loading .qMinus,
.celestPdp__qtyMini.is-loading .qPlus{
  opacity: 0;
  pointer-events: none;
}

.celestPdp__qtyMini.is-loading .celestInlineLoaderWrap{
  display: grid !important;
}

.celestPdp__deleteItem.is-loading svg{
  opacity: 0;
}

.celestPdp__deleteItem.is-loading{
  pointer-events: none;
}

.celestPdp__deleteItem .celestInlineLoaderWrap{
  display: none;
}

.celestPdp__deleteItem.is-loading .celestInlineLoaderWrap{
  display: grid;
}


.celestPdp__discChip .celestDiscChipX__spinner{
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 999px;
  display: none;
  animation: celestSpin 900ms linear infinite;
}

.celestPdp__discChip .js-clearDiscount.is-loading .celestDiscChipX__x{ display:none; }
.celestPdp__discChip .js-clearDiscount.is-loading .celestDiscChipX__spinner{ display:block; }
/* =========================
   CELEST • Pulse para loader con logo (Add / Checkout)
   - Se activa cuando el botón tiene .is-loading
   - No cambia tiempos, solo animación visual
========================= */
@keyframes celestPulse {
  0%   { transform: scale(1);   opacity: 1; }
  50%  { transform: scale(1.08); opacity: .78; }
  100% { transform: scale(1);   opacity: 1; }
}

/* Asegura que el contenedor del loader no lo corte */
.is-loading { position: relative; }

/* Palpita el loader completo (cuando usas buildSpin/buildMorph/buildBoth/buildSketch) */
.is-loading .celestLoader--btn{
  animation: celestPulse 720ms ease-in-out infinite;
  transform-origin: center;
  will-change: transform, opacity;
}

/* Si el loader es imagen (logo) dentro del loader */
.is-loading .celestLoader--btn img{
  animation: celestPulse 720ms ease-in-out infinite;
  transform-origin: center;
  will-change: transform, opacity;
}

/* Si el loader es svg (morph / círculo) */
.is-loading .celestLoader--btn svg{
  animation: celestPulse 720ms ease-in-out infinite;
  transform-origin: center;
  will-change: transform, opacity;
}

/* Respeto accesibilidad */
@media (prefers-reduced-motion: reduce){
  .is-loading .celestLoader--btn,
  .is-loading .celestLoader--btn img,
  .is-loading .celestLoader--btn svg{
    animation: none !important;
  }
}
/* =========================================================
   FIX FINAL • Mini-cart DESKTOP: debajo del header y hasta abajo
   Pegar al FINAL del CSS
========================================================= */
@media (min-width: 990px){

  /* Ajusta este “aire” si quieres más/menos separación del header */
  :root{
    --celest-cart-gap-top: 10px;
  }

  /* Panel del mini-cart: alto completo desde header hasta bottom */
  #celest-mobile-pdp .celestPdp__cartBody{
    position: fixed !important;
    right: 24px !important;
    left: auto !important;
    width: 520px !important;                 /* deja tu ancho “Prada” */
    top: calc(var(--header-height, 80px) + var(--celest-cart-gap-top)) !important;
    bottom: 0 !important;                     /* 👈 clave: llega al final */
    height: auto !important;
    max-height: none !important;              /* 👈 clave: elimina el 70vh/78vh */
    overflow: hidden !important;              /* scroll vive adentro */
    border-radius: 12px !important;
    transform: translateY(-8px) !important;   /* tu entrada suave */
  }

  #celest-mobile-pdp .celestPdp__cartBody.is-open{
    transform: translateY(0) !important;
  }

  /* Scroll SOLO en la lista */
  #celest-mobile-pdp .celestPdp__cartBody .js-cartItems{
    flex: 1 1 auto !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    min-height: 0 !important; /* importante para flex + overflow */
  }

  /* Mantén el resto fijo abajo (subtotal/envío/botones no “cortan” el alto) */
  #celest-mobile-pdp .celestPdp__cartBody{
    display: flex !important;
    flex-direction: column !important;
  }

  /* Por si el tema mete un admin bar o algo arriba, esto ayuda */
  #celest-mobile-pdp .celestPdp__cartModal{
    align-items: stretch !important;
    justify-content: flex-end !important;
  }
}
/* ===========================
   CELEST • SIZES INLINE (8 móvil + wrap desktop)
   Pegar al FINAL del CSS
=========================== */

/* Si queda markup viejo en alguna plantilla, lo escondemos */
#celest-mobile-pdp .celestPdp__sizeRow,
#celest-mobile-pdp .celestPdp__sizeBtn,
#celest-mobile-pdp .celestPdp__sizeSheet{ display:none !important; }

/* Header: Tallas / Guía */
#celest-mobile-pdp .celestPdp__sizeTopRow{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin:12px 0 10px;
}
#celest-mobile-pdp .celestPdp__sizeTopTitle{
  font-size:16px;
  font-weight:400;
  color:#111;
}
#celest-mobile-pdp .celestPdp__sizeTopRight .celestPdp__guideBtn{
  position: static !important;
  width:auto !important;
  background:none !important;
  border:0 !important;
  padding:0 !important;
  min-height:auto !important;
  color:#111 !important;
  font-size:16px !important;
  font-weight:400 !important;
  text-decoration:underline !important;
}

/* Contenedor de tallas */
#celest-mobile-pdp .celestPdp__sizes{
  --size-gap: 8px;
  gap: var(--size-gap);
  display:flex;
  align-items:stretch;
}

/* Botón talla */
#celest-mobile-pdp .celestPdp__size{
  position:relative;
  flex: 0 0 58px;
  height:58px;
  border-radius:12px;
  border:1px solid #111;
  background:#fff;
  color:#111;
  font-weight:600;      /* ligero bold */
  font-size:14px;
  display:grid;
  place-items:center;
  box-shadow: 0 1px 0 rgba(0,0,0,.18);
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
  scroll-snap-align: start;
}

/* Seleccionada */
#celest-mobile-pdp .celestPdp__size.is-active{
  background:#111;
  color:#fff;
  border-color:#111;
}

/* Agotada (gris + diagonal) */
#celest-mobile-pdp .celestPdp__size.is-disabled{
  background:#f2f2f2;
  border-color:#e0e0e0;
  color:#9a9a9a;
  box-shadow:none;
  cursor:not-allowed;
  opacity:1;
  text-decoration:none; /* mata el line-through viejo */
}
#celest-mobile-pdp .celestPdp__size.is-disabled::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:12px;
  pointer-events:none;
  background: linear-gradient(135deg,
    transparent 48%,
    rgba(0,0,0,.25) 49%,
    rgba(0,0,0,.25) 51%,
    transparent 52%);
}

/* Móvil: 8 visibles + scroll */
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__sizes{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
    padding-bottom:2px;
  }
  #celest-mobile-pdp .celestPdp__sizes::-webkit-scrollbar{ display:none; }
  #celest-mobile-pdp .celestPdp__sizes{ -ms-overflow-style:none; scrollbar-width:none; }

  /* 8 visibles */
  #celest-mobile-pdp .celestPdp__size{
    flex: 0 0 calc((100% - (7 * var(--size-gap))) / 8);
    min-width: 34px;
    height:46px;
  }
  #celest-mobile-pdp .celestPdp__size{
  /* ...lo que ya tienes... */

  /* ✅ CENTRADO PERFECTO DEL NÚMERO */
  padding: 0;              /* quita padding default del button */
  line-height: 1;          /* evita que el texto “suba” por line-height */
  text-align: center;
  display: flex;           /* mejor que grid para centrar texto en botones */
  align-items: center;
  justify-content: center;

  /* opcional: números más “parejos” */
  font-variant-numeric: tabular-nums;
}
@media (max-width: 989px){
  #celest-mobile-pdp .celestPdp__size{
    border-radius: 8px; /* ← curva en móvil */
  }
}


 
}


/* Desktop: 8 por fila (grid), salta a 2da fila si hay más */
@media (min-width: 990px){
  #celest-mobile-pdp .celestPdp__sizes{
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: var(--size-gap);
    overflow: visible;
  }

  #celest-mobile-pdp .celestPdp__size{
    width: 100%;
    min-width: 0;
    height: 44px;
  }
@media (min-width: 990px){
  /* ...tus reglas existentes... */

  /* ✅ HOVER: se ilumina negro al pasar el mouse */
  #celest-mobile-pdp .celestPdp__size{
    transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
  }

  #celest-mobile-pdp .celestPdp__size:not(.is-disabled):not(.is-active):hover{
    background:#111;
    color:#fff;
    border-color:#111;
  }
}


}
/* === HOVER CTA "Agregar a la bolsa" === */
#celest-mobile-pdp .celestPdp__addBtn{
  transition: background-color .18s ease, opacity .2s ease, transform .06s ease !important;
}

@media (hover: hover) and (pointer: fine){
  #celest-mobile-pdp .celestPdp__addBtn.is-ready:hover:not([disabled]):not(.is-soldout){
    background: #012840 !important;
    color: #fff !important;
  }
}

/* =========================================================
   CELEST • ADDI SPACING FIX (mobile/desktop)
   - Funciona aunque el espacio lo meta el widget o el bloque siguiente
   - Pegar en archivo NUEVO o en <style> después del CSS grande
========================================================= */

#celest-mobile-pdp{
  --celest-addi-gap-m: -4px;   /* móvil: separación arriba/abajo del widget */
  --celest-addi-gap-d: -10px;   /* desktop */
}

/* 1) El contenedor del widget (por clase y por data-attr) */
#celest-mobile-pdp .celestAddiWrap,
#celest-mobile-pdp [data-celest-addi]{
  display: block !important;
  padding: 0 !important;
}

/* 2) Ajuste real de separación por breakpoint */
@media (max-width: 989px){
  #celest-mobile-pdp .celestAddiWrap,
  #celest-mobile-pdp [data-celest-addi]{
    margin-top: var(--celest-addi-gap-m) !important;
    margin-bottom: var(--celest-addi-gap-m) !important;
  }
}
@media (min-width: 990px){
  #celest-mobile-pdp .celestAddiWrap,
  #celest-mobile-pdp [data-celest-addi]{
    margin-top: var(--celest-addi-gap-d) !important;
    margin-bottom: var(--celest-addi-gap-d) !important;
  }
}

/* 3) Si Addi mete márgenes internos (muy común), los matamos */
#celest-mobile-pdp .celestAddiWrap > *,
#celest-mobile-pdp [data-celest-addi] > *{
  margin: 0 !important;
}
#celest-mobile-pdp .celestAddiWrap iframe,
#celest-mobile-pdp [data-celest-addi] iframe{
  display: block !important;
  margin: 0 !important;
}

/* 4) Si el espacio viene del BLOQUE SIGUIENTE (Color/Swatches),
      lo recortamos (cubre wrappers típicos) */
#celest-mobile-pdp .celestAddiWrap + .celestPdp__option,
#celest-mobile-pdp [data-celest-addi] + .celestPdp__option{
  margin-top: 0 !important;
}

#celest-mobile-pdp .celestAddiWrap + .shopify-block,
#celest-mobile-pdp [data-celest-addi] + .shopify-block{
  margin-top: 0 !important;
}

/* Si tu color viene del tema (nombres comunes) */
#celest-mobile-pdp .celestAddiWrap + .product-form__input,
#celest-mobile-pdp [data-celest-addi] + .product-form__input,
#celest-mobile-pdp .celestAddiWrap + .ProductForm__Option,
#celest-mobile-pdp [data-celest-addi] + .ProductForm__Option{
  margin-top: 0 !important;
}