/* ================================================================
   CARRITO DE SESIÓN Y SUGERENCIAS — Colombian Wings
   Hoja autónoma: se carga DESPUÉS de style.css en todas las páginas.
   Son dos controles independientes:
     · .cw-chip  — carrito, esquina superior derecha
     · .cw-fab   — "¿Se te antoja algo más?", al costado
   ================================================================ */

/* ================= CARRITO: PASTILLA SUPERIOR ================= */
.cw-chip{
  position:fixed;
  top:calc(var(--banner-h, 0px) + 14px);
  right:22px;
  z-index:75;
  height:52px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 18px 0 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:100px;
  background:rgba(10,10,10,.72);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  color:var(--white);
  font-family:'Inter', sans-serif;
  font-size:.82rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  transition:border-color .2s ease, background .2s ease, transform .28s ease, opacity .28s ease;
}
.cw-chip.is-hidden{
  transform:translateY(-140%);
  opacity:0;
  pointer-events:none;
}
.cw-chip:hover{ border-color:rgba(252,209,22,.5); background:rgba(10,10,10,.9); }
.cw-chip:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.cw-chip-ico{ font-size:1.05rem; line-height:1; }
.cw-chip-total{
  font-family:'Anton', sans-serif;
  font-size:1.02rem;
  letter-spacing:.4px;
  color:var(--gold);
}
.cw-chip.is-empty .cw-chip-total{
  color:var(--muted);
  font-family:'Inter', sans-serif;
  font-size:.8rem;
  font-weight:600;
}

.cw-chip-badge{
  position:absolute;
  top:-5px; right:-5px;
  min-width:22px; height:22px;
  padding:0 6px;
  border-radius:100px;
  background:var(--red);
  color:#fff;
  font-size:.7rem;
  font-weight:800;
  display:none;
  align-items:center;
  justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.5);
}
.cw-chip.has-items .cw-chip-badge{ display:flex; }

@media(max-width:860px){
  .cw-chip{ top:calc(var(--banner-h, 0px) + 76px); right:12px; height:44px; padding:0 14px 0 12px; font-size:.76rem; }
  .cw-chip-label{ display:none; }
  .cw-chip-total{ font-size:.92rem; }
}

/* ================= SUGERENCIAS: BOTÓN AL COSTADO ================= */
.cw-fab{
  position:fixed;
  left:0;
  bottom:110px;
  z-index:70;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:min(66vw, 230px);
  padding:11px 16px 11px 13px;
  border:1px solid rgba(252,209,22,.35);
  border-left:0;
  border-radius:0 100px 100px 0;
  background:rgba(10,10,10,.82);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:#f0e7e7;
  font-family:'Inter', sans-serif;
  font-size:.74rem;
  font-weight:600;
  line-height:1.25;
  text-align:left;
  cursor:pointer;
  transition:padding .22s ease, border-color .22s ease, color .22s ease;
}
.cw-fab[hidden]{ display:none; }
.cw-fab:hover{ padding-left:19px; border-color:var(--gold); color:#fff; }
.cw-fab:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.cw-fab-ico{ font-size:1rem; line-height:1; flex-shrink:0; }

.cw-fab-close{
  position:absolute;
  top:-7px; right:-7px;
  width:20px; height:20px;
  border-radius:50%;
  background:#1a1414;
  border:1px solid rgba(255,255,255,.28);
  color:var(--muted);
  font-size:.62rem;
  line-height:1;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:color .18s ease, border-color .18s ease;
}
.cw-fab-close:hover{ color:#fff; border-color:var(--white); }
.cw-fab-close:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }

/* En móvil se reduce a un ícono redondo, sin texto: menos intrusivo
   y no compite por ancho con el resto de la pantalla. */
@media(max-width:640px){
  .cw-fab{
    left:12px;
    bottom:96px;
    width:46px;
    height:46px;
    padding:0;
    gap:0;
    max-width:none;
    justify-content:center;
    border-left:1px solid rgba(252,209,22,.35);
    border-radius:50%;
  }
  .cw-fab span:not(.cw-fab-ico){ display:none; }
  .cw-fab-ico{ font-size:1.2rem; }
}

/* ---------- Tarjeta de sugerencias ---------- */
.cw-pop{
  position:fixed;
  left:14px;
  bottom:170px;
  z-index:80;
  width:min(340px, calc(100vw - 28px));
  background:#141010;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.65);
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
}
.cw-pop.is-open{ opacity:1; visibility:visible; transform:translateY(0); }

.cw-pop-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:16px 16px 11px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.cw-pop-head h3{
  font-family:'Anton', sans-serif;
  font-size:1rem;
  letter-spacing:.6px;
  color:var(--white);
}
.cw-pop-head p{ font-size:.7rem; color:var(--muted); margin-top:3px; line-height:1.45; }
.cw-pop-list{ padding:10px 12px 14px; }

@media(max-width:640px){
  .cw-pop{ left:12px; right:12px; width:auto; bottom:150px; }
}

/* ---------- Fila de sugerencia ---------- */
.cw-sug{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  text-align:left;
  font:inherit;
  color:inherit;
  cursor:pointer;
  background:transparent;
  border:1px solid transparent;
  border-radius:11px;
  padding:9px 10px;
  transition:background .18s ease, border-color .18s ease;
}
.cw-sug:hover{ background:rgba(255,255,255,.05); border-color:rgba(252,209,22,.35); }
.cw-sug:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.cw-sug + .cw-sug{ margin-top:2px; }

.cw-sug-main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.cw-sug-name{ display:block; font-size:.84rem; font-weight:600; color:#f2ecec; }
.cw-sug-why{ display:block; font-size:.69rem; color:var(--muted); margin-top:4px; line-height:1.4; }
.cw-sug-price{ font-size:.78rem; font-weight:700; color:var(--gold); white-space:nowrap; }
.cw-sug-add{
  width:25px; height:25px;
  flex-shrink:0;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:var(--white);
  font-size:.95rem;
  font-weight:700;
  line-height:1;
  display:flex; align-items:center; justify-content:center;
  transition:background .18s ease, color .18s ease;
}
.cw-sug:hover .cw-sug-add{ background:var(--gold); color:var(--black); }
.cw-sug.just-added .cw-sug-add{ background:#34d399; color:#08210f; }

/* ================= PANEL DEL CARRITO ================= */
.cw-overlay{
  position:fixed;
  inset:0;
  z-index:950;
  background:rgba(0,0,0,.66);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease, visibility .25s ease;
}
.cw-overlay.is-open{ opacity:1; visibility:visible; }

.cw-panel{
  position:fixed;
  top:0; right:0;
  z-index:960;
  width:min(400px, 100vw);
  height:100dvh;
  display:flex;
  flex-direction:column;
  background:#131010;
  border-left:1px solid rgba(255,255,255,.1);
  box-shadow:-20px 0 60px rgba(0,0,0,.6);
  transform:translateX(100%);
  transition:transform .3s cubic-bezier(.32,.72,.35,1);
}
.cw-panel.is-open{ transform:translateX(0); }

.cw-panel-head{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 22px 16px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.cw-panel-head h2{
  font-family:'Anton', sans-serif;
  font-size:1.25rem;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:var(--white);
}
.cw-close{
  width:34px; height:34px;
  flex-shrink:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  background:transparent;
  color:var(--white);
  font-size:1.1rem;
  line-height:1;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .18s ease, border-color .18s ease;
}
.cw-close:hover{ background:rgba(255,255,255,.1); border-color:var(--white); }
.cw-close:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }

.cw-panel-body{
  flex:1;
  min-height:0;
  overflow-y:auto;
  padding:8px 22px 22px;
  -webkit-overflow-scrolling:touch;
}

.cw-empty{
  color:var(--muted);
  font-size:.85rem;
  line-height:1.55;
  background:rgba(255,255,255,.035);
  border:1px dashed rgba(255,255,255,.16);
  border-radius:12px;
  padding:16px 18px;
  margin-top:14px;
}

/* ---------- Líneas del carrito ---------- */
.cw-line{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.cw-line:last-child{ border-bottom:0; }
.cw-line-main{ flex:1; min-width:0; }
.cw-line-name{ font-size:.88rem; font-weight:600; color:#f2ecec; margin-bottom:3px; }
.cw-line-det{ font-size:.72rem; line-height:1.5; color:var(--muted); }
.cw-line-price{
  font-size:.82rem;
  font-weight:700;
  color:var(--gold);
  white-space:nowrap;
  margin-top:6px;
  display:block;
}
.cw-line-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:7px;
  flex-shrink:0;
}
.cw-del{
  border:0;
  background:transparent;
  color:var(--muted);
  font-size:.66rem;
  letter-spacing:.4px;
  text-transform:uppercase;
  font-weight:700;
  cursor:pointer;
  padding:2px 4px;
  transition:color .18s ease;
}
.cw-del:hover{ color:#FF5A5F; }
.cw-del:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }

.cw-qty{
  display:inline-flex;
  align-items:center;
  gap:2px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:100px;
  padding:3px;
}
.cw-qty button{
  width:26px; height:26px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--white);
  font-size:.95rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .16s ease;
}
.cw-qty button:hover{ background:var(--red); }
.cw-qty button:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.cw-qty span{
  min-width:22px;
  text-align:center;
  font-size:.85rem;
  font-weight:700;
  font-variant-numeric:tabular-nums;
}
.cw-qty[data-qty="1"] button[data-d="-1"]{ opacity:.35; }

/* ---------- Pie del panel ---------- */
.cw-panel-foot{
  flex-shrink:0;
  padding:16px 22px 20px;
  border-top:1px solid rgba(255,255,255,.1);
  background:rgba(10,10,10,.92);
}
.cw-total{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  margin-bottom:5px;
}
.cw-total span{
  font-size:.68rem;
  letter-spacing:1.6px;
  text-transform:uppercase;
  font-weight:700;
  color:var(--muted);
}
.cw-total b{
  font-family:'Anton', sans-serif;
  font-size:1.55rem;
  letter-spacing:.5px;
  color:var(--gold);
}
.cw-fine{ font-size:.68rem; color:var(--muted); margin-bottom:13px; line-height:1.5; }
.cw-foot-btns{ display:flex; gap:9px; flex-wrap:wrap; }
.cw-foot-btns .btn{ flex:1; justify-content:center; white-space:nowrap; }
.cw-send[aria-disabled="true"]{ opacity:.35; pointer-events:none; box-shadow:none; }

/* ================= PÁGINA "AGREGADO A TU PEDIDO" ================= */
.cw-done{ padding:130px 0 90px; }
.cw-done-card{
  max-width:620px;
  margin:0 auto;
  text-align:center;
  background:var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-left:3px solid var(--gold);
  border-radius:var(--radius);
  padding:34px 28px 30px;
}
.cw-done-ico{ font-size:2.6rem; line-height:1; margin-bottom:14px; }
.cw-done-card h1{
  font-family:'Anton', sans-serif;
  font-size:clamp(1.5rem, 4vw, 2.1rem);
  letter-spacing:.5px;
  margin-bottom:10px;
}
.cw-done-card h1 .accent{ color:var(--gold); }
.cw-done-sub{ color:var(--muted); font-size:.92rem; margin-bottom:24px; }
.cw-done-list{
  text-align:left;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  padding:4px 18px;
  margin-bottom:22px;
}
.cw-done-btns{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }

@media (prefers-reduced-motion: reduce){
  .cw-panel, .cw-overlay, .cw-pop, .cw-fab, .cw-chip, .cw-sug{ transition:none; }
}

/* ================= FORMULARIO DE CONFIRMACIÓN ================= */
.cw-form{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  margin-top:4px;
}
@media(min-width:720px){ .cw-form{ grid-template-columns:repeat(2,1fr); } }
.cw-form[hidden]{ display:none; }

.cw-campo{ display:flex; flex-direction:column; gap:6px; }
.cw-campo > span{
  font-size:.66rem;
  letter-spacing:1.4px;
  text-transform:uppercase;
  font-weight:700;
  color:var(--muted);
}
.cw-campo input{
  width:100%;
  font:inherit;
  font-size:.92rem;
  color:var(--white);
  background:var(--card);
  border:1px solid rgba(255,255,255,.14);
  border-radius:11px;
  padding:12px 14px;
  transition:border-color .18s ease, background .18s ease;
}
.cw-campo input::placeholder{ color:rgba(255,255,255,.28); }
.cw-campo input:hover{ border-color:rgba(255,255,255,.26); }
.cw-campo input:focus{
  outline:none;
  border-color:var(--gold);
  background:rgba(252,209,22,.05);
}

/* ---------- Casilla de tratamiento de datos ---------- */
.cw-check{
  display:flex;
  align-items:flex-start;
  gap:12px;
  cursor:pointer;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  padding:16px 18px;
  font-size:.85rem;
  line-height:1.55;
  color:#e6dede;
}
.cw-check:hover{ border-color:rgba(255,255,255,.2); }
.cw-check input{
  width:20px; height:20px;
  flex-shrink:0;
  margin-top:1px;
  accent-color:var(--red);
  cursor:pointer;
}
.cw-check a{ color:var(--gold); text-decoration:underline; }

/* ================= AVISO DE COOKIES ================= */
.cw-cookies{
  position:fixed;
  left:14px; right:14px; bottom:14px;
  z-index:990;
  max-width:620px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  background:#141010;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  box-shadow:0 20px 50px rgba(0,0,0,.6);
  padding:16px 18px;
  transform:translateY(140%);
  transition:transform .32s cubic-bezier(.32,.72,.35,1);
}
.cw-cookies.is-open{ transform:translateY(0); }
.cw-cookies p{
  flex:1;
  min-width:220px;
  font-size:.78rem;
  line-height:1.55;
  color:var(--muted);
}
.cw-cookies p a{ color:var(--gold); text-decoration:underline; }
.cw-cookies .cw-cookies-btns{ display:flex; gap:8px; flex-wrap:wrap; }

@media(max-width:520px){
  .cw-cookies{ bottom:10px; padding:14px 15px; }
  .cw-cookies .btn{ flex:1; justify-content:center; }
}

/* ================= PAGO CON BOLD (pedido/confirmar) ================= */
.cw-pay-box{
  margin:26px 0 10px;
  padding:22px;
  background:var(--card);
  border:1px solid rgba(252,209,22,.28);
  border-radius:var(--radius);
  display:flex;
  justify-content:center;
}
#btnContinuar:disabled{ opacity:.55; cursor:not-allowed; box-shadow:none; transform:none; }
#errorPago{
  border-color:rgba(227,30,36,.4);
  background:rgba(227,30,36,.08);
  color:#ffd7d7;
  font-style:normal;
}
#camposFactura[hidden], #campoDireccion[hidden]{ display:none; }

/* ================= PÁGINAS LEGALES ================= */
.legal{ padding:130px 0 90px; }
.legal .container{ max-width:760px; }
.legal h2{
  font-family:'Anton', sans-serif;
  font-size:1.2rem;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:var(--gold);
  margin:34px 0 12px;
}
.legal p, .legal li{
  font-size:.92rem;
  line-height:1.7;
  color:#ded6d6;
}
.legal p{ margin-bottom:12px; }
.legal ul{ margin:0 0 14px 20px; }
.legal li{ list-style:disc; margin-bottom:7px; }
.legal b{ color:#fff; }


/* ---------- Aviso de celular inválido ---------- */
.cw-aviso-celular{
  font-size:.78rem;
  color:#FF9494;
  line-height:1.4;
}

/* ---------- Selector desplegable propio (reemplaza al <select> nativo) ---------- */
.cw-select-oculto{
  position:absolute !important;
  width:1px; height:1px;
  opacity:0; pointer-events:none;
  clip:rect(0 0 0 0); overflow:hidden;
}
.cw-dd{ position:relative; }
.cw-dd-btn{
  width:100%;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  font:inherit; font-size:.92rem; text-align:left;
  color:var(--white);
  background:var(--card);
  border:1px solid rgba(255,255,255,.14);
  border-radius:11px;
  padding:12px 14px;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease;
}
.cw-dd-btn:hover{ border-color:rgba(255,255,255,.26); }
.cw-dd-btn:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.cw-dd.is-set .cw-dd-btn{ border-color:rgba(252,209,22,.5); }
.cw-dd-val.is-placeholder{ color:rgba(255,255,255,.4); }
.cw-dd-chev{ width:18px; height:18px; flex-shrink:0; color:var(--gold); transition:transform .22s ease; }
.cw-dd[data-open="true"] .cw-dd-btn{
  border-color:var(--gold);
  background:rgba(252,209,22,.05);
}
.cw-dd[data-open="true"] .cw-dd-chev{ transform:rotate(180deg); }

.cw-dd-lista{
  list-style:none; margin:6px 0 0; padding:6px;
  display:none;
  background:#201b1b;
  border:1px solid rgba(252,209,22,.35);
  border-radius:12px;
  box-shadow:0 14px 34px rgba(0,0,0,.5);
  max-height:260px; overflow-y:auto;
}
.cw-dd[data-open="true"] .cw-dd-lista{ display:block; }
.cw-dd-lista li{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 12px;
  border-radius:9px;
  font-size:.9rem;
  cursor:pointer;
  transition:background .14s ease;
}
.cw-dd-lista li:hover, .cw-dd-lista li:focus-visible{ background:rgba(255,255,255,.07); outline:none; }
.cw-dd-lista li i{
  font-style:normal; font-weight:800; font-size:.8rem;
  width:22px; height:22px; border-radius:50%;
  background:var(--gold); color:var(--black);
  display:none; align-items:center; justify-content:center;
}
.cw-dd-lista li[aria-selected="true"]{ background:rgba(252,209,22,.1); font-weight:700; color:var(--gold); }
.cw-dd-lista li[aria-selected="true"] i{ display:flex; }

/* ---------- Aviso tipo alerta (mapa y cobertura) ---------- */
.cw-alerta{
  margin-top:12px;
  padding:13px 16px;
  background:rgba(252,209,22,.09);
  border:1px solid rgba(252,209,22,.35);
  border-left:5px solid var(--gold);
  border-radius:11px;
  font-size:.88rem; line-height:1.5; font-weight:500;
  color:#f6efd2;
}
.cw-alerta b{ color:var(--gold); }
#resultadoDomicilio:not(:empty){
  margin-top:10px;
  padding:12px 16px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.14);
  border-left:5px solid rgba(255,255,255,.38);
  border-radius:11px;
  font-size:.88rem; line-height:1.5; color:var(--white);
}

/* Marca de campo obligatorio */
.cw-req{
  margin-left:4px;
  color:var(--gold);
  font-weight:700;
  letter-spacing:.4px;
  text-transform:none;
}
.order-summary{ display:none; }