:root {
  --brown: #331C1C;
  --orange: #F07D47;
  --cream: #F2E8C7;
  --white: #FAFAFA;
  --hover-orange: #D96B38;
  --font: 'Montserrat', system-ui, sans-serif;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
button, .qty-btn, .add-btn, .loc-btn, .hero-cta, .go-form-btn, .repeat-btn, .whatsapp-btn { touch-action:manipulation; }
.hero-schedule { font-size:.82rem; color:#7a4a4a; margin-top:.5rem; line-height:1.6; text-align:center; }
html { scroll-behavior:smooth; }
body { font-family:var(--font); background:#fff; color:var(--brown); line-height:1.55; -webkit-font-smoothing:antialiased; }

/* ── MODAL BIENVENIDA (zona + fecha) ── */
.loc-overlay { position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:9999; display:flex; align-items:center; justify-content:center; padding:1rem; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.loc-overlay.hidden { display:none; }
/* Cuando el modal está abierto, el body no scrollea (evita scroll fantasma en mobile) */
body.modal-open, html.modal-open { overflow:hidden; height:100%; touch-action:none; }
.loc-overlay, .loc-box { touch-action:pan-y; }
.loc-box { background:#fff; border-radius:16px; max-width:560px; width:100%; padding:2rem 1.5rem; text-align:center; max-height:calc(100vh - 2rem); overflow-y:auto; }
.loc-box img { height:48px; margin-bottom:1rem; }
.loc-box h2 { font-size:1.35rem; margin-bottom:.3rem; color:var(--brown); }
.loc-box p { font-size:.85rem; color:#666; margin-bottom:1.5rem; }
.loc-step { animation: fadeIn .25s ease-out; }
@keyframes fadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }

/* Botones de zona (paso 1) */
.loc-btn { display:block; width:100%; padding:.9rem; margin-bottom:.6rem; border:2px solid #eee; border-radius:12px; background:#fff; font-family:var(--font); font-size:.95rem; font-weight:600; cursor:pointer; transition:all .15s; text-align:left; }
.loc-btn:hover { border-color:var(--orange); background:#FFF8F4; }
.loc-btn small { display:block; font-weight:400; font-size:.75rem; color:#888; margin-top:2px; }
.loc-btn .loc-price { float:right; color:var(--orange); font-weight:700; }
/* Anotación destacada dentro de un botón de zona (ej: cutoff de pedidos en
   Pilar). Es un bloque que ocupa el ancho del botón y deja que el texto
   fluya solo: en desktop entra en 1 línea y en mobile envuelve en 2 sin
   desbordar ni cortar palabras. */
.loc-btn .loc-note { display:block; font-weight:600; font-size:.72rem; line-height:1.4; color:#9C4B1E; background:#FFF4EC; border:1px solid #F8D6C2; border-radius:9px; padding:.4rem .55rem; margin-top:.5rem; text-wrap:pretty; }
.loc-btn .loc-note strong { font-weight:800; white-space:nowrap; }

/* Aviso contextual del paso fecha (cutoff de Pilar). Sube un poco para pegarse
   al subtítulo de la zona. Ancho completo del modal y texto que envuelve solo:
   entra en 2 líneas en desktop y en 3 o 4 en mobile sin desbordar. */
.loc-date-note { text-align:left; font-size:.78rem; font-weight:600; line-height:1.45; border-radius:11px; padding:.6rem .7rem; margin:-1rem 0 1.2rem; text-wrap:pretty; }
.loc-date-note strong { font-weight:800; }
.loc-date-note.info       { color:#9C4B1E; background:#FFF4EC; border:1px solid #F8D6C2; }
.loc-date-note.urgente    { color:#8A4A00; background:#FFF7E1; border:1px solid #F3DCA1; }
.loc-date-note.entregando { color:#1B5E20; background:#EBF6EC; border:1px solid #C2E3C7; }

/* Mismo aviso pero en el hero (Clubes Deportivos, que no pasa por el modal de
   fecha). Centrado como el resto del hero y con ancho acotado para que en
   desktop no quede una línea larguísima de lado a lado. */
.hero-cutoff-note { max-width:32rem; margin:.9rem auto 0; text-align:left; font-size:.8rem; font-weight:600; line-height:1.45; border-radius:12px; padding:.65rem .8rem; text-wrap:pretty; }
.hero-cutoff-note strong { font-weight:800; }
.hero-cutoff-note.info       { color:#9C4B1E; background:#FFF4EC; border:1px solid #F8D6C2; }
.hero-cutoff-note.urgente    { color:#8A4A00; background:#FFF7E1; border:1px solid #F3DCA1; }
.hero-cutoff-note.entregando { color:#1B5E20; background:#EBF6EC; border:1px solid #C2E3C7; }

/* Grilla de fechas (paso 2) */
.loc-dates-grid { display:flex; flex-direction:column; gap:1rem; margin-bottom:.5rem; text-align:left; }
.loc-date-section { display:flex; flex-direction:column; gap:.55rem; }
.loc-date-section-title { font-size:.7rem; font-weight:800; color:#999; text-transform:uppercase; letter-spacing:1.2px; padding-left:.15rem; }
.loc-date-section-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap:.5rem; }
@media (min-width: 640px) { .loc-date-section-grid { grid-template-columns: repeat(3, 1fr); } }

/* Grilla de barrios (paso intermedio Pilar) */
/* Rediseño 13/07/26: cards verticales grandes (zona + vendedor + sub-barrios).
   Antes eran chips chicos en grid 3-cols, ahora una card por fila para mejor
   legibilidad en mobile y aire para el listado de sub-barrios. */
.loc-barrios-grid { display:flex; flex-direction:column; gap:.55rem; margin-bottom:1rem; }
.loc-zona-card { position:relative; padding:.85rem 1rem; border:2px solid #eee; border-radius:14px; background:#fff; cursor:pointer; transition:all .18s; font-family:var(--font); text-align:left; display:flex; flex-direction:column; gap:.35rem; }
.loc-zona-card:hover, .loc-zona-card:focus-visible { border-color:var(--orange); background:#FFF8F4; transform:translateY(-1px); box-shadow:0 4px 12px rgba(231,98,40,.10); outline:none; }
.loc-zona-card:active { transform:translateY(0); }
.loc-zona-head { display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap; }
.loc-zona-name { font-size:1rem; font-weight:800; color:var(--brown); line-height:1.2; }
.loc-zona-vendedor { font-size:.72rem; color:#37474F; letter-spacing:.03em; background:#F5EFEA; padding:.22rem .6rem; border-radius:12px; white-space:nowrap; font-weight:800; }
.loc-zona-vendedor.is-tadeo { background:#FFF3E0; color:#B25314; }
.loc-zona-sub { font-size:.75rem; color:#8a7d75; line-height:1.35; padding-left:1.2rem; }
.loc-zona-card.is-other { border-style:dashed; background:#FDFBF7; }

/* Paso 3 (sub-barrio): grilla 2 cols con cards compactas — solo el nombre
   del barrio, sin badge de vendedor ni lista secundaria. */
#loc-subbarrios-grid { display:grid; grid-template-columns:1fr 1fr; gap:.55rem; }
#loc-subbarrios-grid .loc-zona-card.is-simple { padding:.9rem .6rem; text-align:center; align-items:center; justify-content:center; gap:.15rem; }
#loc-subbarrios-grid .loc-zona-card.is-simple .loc-zona-name { font-size:.92rem; text-align:center; }
#loc-subbarrios-grid .loc-zona-card.is-simple .loc-zona-sub { padding-left:0; font-size:.68rem; text-align:center; margin-top:.15rem; }
@media (max-width: 380px) { #loc-subbarrios-grid { grid-template-columns:1fr; } }

/* Botón "Cualquier día" — destacado, ancho completo */
.loc-any-btn { display:flex; align-items:center; gap:.85rem; width:100%; padding:.85rem 1rem; border:2px solid #eee; border-radius:14px; background:#fff; cursor:pointer; transition:all .15s; font-family:var(--font); text-align:left; }
.loc-any-btn:hover { border-color:var(--orange); background:#FFF8F4; transform:translateY(-1px); }
.loc-any-btn .any-icon { font-size:1.6rem; flex-shrink:0; }
.loc-any-btn .any-text { display:flex; flex-direction:column; gap:.1rem; flex:1; }
.loc-any-btn .any-text strong { font-size:1rem; color:var(--brown); font-weight:700; }
.loc-any-btn .any-text small { font-size:.75rem; color:#888; font-weight:400; }

.loc-date-card { position:relative; padding:.85rem .35rem .7rem; border:2px solid #eee; border-radius:12px; background:#fff; cursor:pointer; transition:all .15s; font-family:var(--font); display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:96px; }
.loc-date-card:hover { border-color:var(--orange); background:#FFF8F4; transform:translateY(-1px); }
.loc-date-card .dc-day { font-size:.7rem; font-weight:700; color:#888; text-transform:uppercase; letter-spacing:.5px; margin-bottom:.15rem; }
.loc-date-card .dc-day.dc-day-flag { color:var(--orange); font-size:.72rem; letter-spacing:.8px; }
.loc-date-card .dc-num { font-size:1.85rem; font-weight:800; color:var(--brown); line-height:1; }
.loc-date-card .dc-mon { font-size:.7rem; color:#666; margin-top:.1rem; }
.loc-date-card .dc-time { font-size:.65rem; color:#999; margin-top:.4rem; line-height:1.1; }
.loc-date-card.next { border-color:var(--orange); background:#FFF8F4; }
.loc-date-card.next::before { content:'Próxima'; position:absolute; top:-8px; left:50%; transform:translateX(-50%); background:var(--orange); color:#fff; font-size:.6rem; font-weight:700; padding:.15rem .5rem; border-radius:8px; letter-spacing:.5px; white-space:nowrap; }

/* Acordeón "Para más adelante" */
.loc-later-toggle { display:flex; align-items:center; justify-content:space-between; width:100%; padding:.85rem 1rem; border:2px dashed #ddd; border-radius:12px; background:#fafafa; font-family:var(--font); font-size:.95rem; font-weight:600; color:#555; cursor:pointer; transition:all .15s; }
.loc-later-toggle:hover { border-color:var(--orange); color:var(--brown); background:#FFF8F4; }
.loc-later-toggle .chev { transition:transform .25s; font-size:.9rem; }
.loc-later-toggle.open { border-style:solid; border-color:var(--orange); color:var(--brown); background:#FFF8F4; }
.loc-later-toggle.open .chev { transform:rotate(180deg); }
.loc-later-content { animation: fadeIn .25s ease-out; padding-top:.6rem; }
.loc-later-content[hidden] { display:none; }

.loc-back-btn { background:none; border:none; color:#888; cursor:pointer; font-size:.85rem; font-family:var(--font); margin-top:.5rem; padding:.4rem .8rem; }
.loc-back-btn:hover { color:var(--orange); }

/* Chip de fecha en header (mismo estilo que zone-chip) */
.header-chips { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; justify-content:flex-end; }
.date-chip { background:#FFF3E0; color:#E65100; }

/* ── HEADER ── */
/* Header NO sticky: se va con el scroll naturalmente para liberar espacio.
   El cliente vuelve a verlo tocando el logo (scroll to top) o el chip flotante
   del carrito que aparece abajo cuando hay productos. */
header { background:var(--cream); z-index:100; padding:.7rem 1.2rem; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid rgba(0,0,0,.04); }
.logo-wrap { display:flex; align-items:center; gap:.5rem; text-decoration:none; }
.logo-ico { height:36px; }
.logo-name { font-size:1.5rem; font-weight:800; color:var(--brown); letter-spacing:-.03em; }
.zone-chip { font-size:.7rem; background:#fff; color:var(--brown); padding:.3rem .65rem; border-radius:20px; cursor:pointer; border:1px solid rgba(51,28,28,.12); font-family:var(--font); font-weight:600; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.zone-chip:hover { background:#FFF8F0; border-color:rgba(51,28,28,.2); }
.cart-btn { display:flex; align-items:center; gap:.4rem; background:var(--orange); color:#fff; border:none; border-radius:50px; padding:.5rem 1rem .5rem .75rem; font-family:var(--font); font-weight:700; font-size:.85rem; cursor:pointer; transition:background .15s; }
.cart-btn:hover { background:var(--hover-orange); }
.cart-badge { background:#fff; color:var(--orange); border-radius:50%; width:1.3rem; height:1.3rem; display:flex; align-items:center; justify-content:center; font-size:.7rem; font-weight:800; }
.cart-badge.bounce { animation:badgeBounce .4s cubic-bezier(.2,.8,.3,1.4); }
@keyframes badgeBounce { 0%{transform:scale(1)} 40%{transform:scale(1.45)} 100%{transform:scale(1)} }

/* ── HERO ── */
.hero { padding:2.5rem 1.5rem 2rem; text-align:center; background:linear-gradient(to bottom, var(--cream) 0%, var(--cream) 75%, #fff 100%); }
.hero h2 { font-size:1.7rem; font-weight:800; line-height:1.2; margin-bottom:.5rem; }
.hero h2 span { color:var(--orange); }
.hero .hero-sub { color:#666; font-size:.95rem; margin-bottom:.5rem; }
.hero .hero-delivery { font-size:.8rem; color:#999; margin-bottom:1.2rem; }
.hero-cta { display:inline-block; background:var(--orange); color:#fff; text-decoration:none; padding:.7rem 1.8rem; border-radius:50px; font-weight:700; font-size:.9rem; transition:background .15s; }
.hero-cta:hover { background:var(--hover-orange); }
.hero-cta.hero-cta-combos { display:block; width:fit-content; margin:.7rem auto 0; background:#fff; color:var(--orange); border:1.6px solid var(--orange); }
.hero-cta.hero-cta-combos:hover { background:#FFF3E0; }

/* ── PROMO BAR ── */
.promo-bar { background:var(--brown); overflow:hidden; white-space:nowrap; }
.promo-track { display:inline-block; animation:promoScroll 18s linear infinite; }
.promo-msg { display:inline-block; font-size:.75rem; font-weight:700; color:var(--cream); padding:.5rem 0; letter-spacing:.02em; }
@keyframes promoScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── CAT NAV ── */
/* Cat-nav: barra horizontal sticky con scroll. Botones grandes y vistosos
   para que el cliente entienda que son atajos a cada sección.
   Logo mini a la izquierda (fuera del scroll horizontal) para volver arriba. */
/* Wrapper sticky: cat-nav + promo-bar quedan pegadas arriba al scrollear (header NO es sticky a propósito) */
.sticky-header { position:sticky; top:0; z-index:90; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.cat-nav { background:#fff; border-bottom:1px solid #f0f0f0; display:flex; align-items:center; }
.cat-nav-home { flex-shrink:0; background:transparent; border:none; padding:.55rem .35rem .55rem .8rem; cursor:pointer; display:flex; align-items:center; }
.cat-nav-home img { height:28px; display:block; }
.cat-nav-home:hover img { opacity:.85; }
.cat-nav-home:active img { transform:scale(.92); }
.cat-nav-wrap { position:relative; flex:1; min-width:0; }
/* Fade derecha que sugiere "hay más, deslizá" — visible cuando se puede scrollear */
.cat-nav-wrap::after { content:''; position:absolute; right:0; top:0; bottom:0; width:32px; background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.95)); pointer-events:none; opacity:1; transition:opacity .2s; }
.cat-nav-wrap.at-end::after { opacity:0; }
.cat-nav-inner { display:flex; gap:.45rem; overflow-x:auto; padding:.75rem 1rem; scrollbar-width:none; -ms-overflow-style:none; scroll-behavior:smooth; }
.cat-nav-inner::-webkit-scrollbar { display:none; }
.cat-nav-btn { flex-shrink:0; border:1.5px solid #eee; background:#fff; color:var(--brown); font-family:var(--font); font-size:.82rem; font-weight:700; padding:.55rem 1.05rem; border-radius:50px; cursor:pointer; transition:all .18s; white-space:nowrap; box-shadow:0 1px 2px rgba(0,0,0,.04); text-transform:uppercase; letter-spacing:.04em; }
.cat-nav-btn:hover { border-color:var(--orange); background:#FFF8F4; transform:translateY(-1px); box-shadow:0 3px 8px rgba(231,98,40,.15); }
.cat-nav-btn.active { background:var(--orange); color:#fff; border-color:var(--orange); box-shadow:0 3px 10px rgba(231,98,40,.35); }
.cat-nav-btn span { font-size:1em; margin-right:.2em; }
/* Animación inicial: los botones aparecen con un sutil bounce que tira la mirada */
@keyframes catNavPulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.04); } }
.cat-nav-btn.cat-nav-pulse { animation: catNavPulse .6s ease-out 2; }
/* Chip "Combos": color propio, siempre relleno (es el único coloreado entre los
   chips blancos de categorías), para que se distinga del resto. */
.cat-nav-btn.cat-nav-combos { background:linear-gradient(135deg,#E65100,#ff8a3d); color:#fff; border-color:transparent; box-shadow:0 2px 9px rgba(230,81,0,.32); }
.cat-nav-btn.cat-nav-combos:hover { background:linear-gradient(135deg,#d84a00,#ff7a26); color:#fff; transform:translateY(-1px); }
.cat-nav-btn.cat-nav-combos.active { background:linear-gradient(135deg,#bf3e00,#E65100); color:#fff; box-shadow:0 3px 12px rgba(230,81,0,.45); }

/* Hint arriba de la barra: guía al usuario que es deslizable */
.cat-nav-hint { font-size:.68rem; color:#9a8b85; text-align:center; padding:.95rem 1rem .1rem; letter-spacing:.08em; font-weight:700; text-transform:uppercase; }
.cat-nav-hint-arrow { display:inline-block; margin-left:.15em; animation: catHintArrow 1.6s ease-in-out infinite; }
@keyframes catHintArrow { 0%,100% { transform:translateX(0); opacity:.5; } 50% { transform:translateX(4px); opacity:1; } }
@media(min-width:700px) { .cat-nav-hint { display:none; } }

/* ── CATÁLOGO ── */
.catalog { max-width:900px; margin:0 auto; padding:0 1rem 2rem; }
.cat-section { margin-top:2rem; }
.cat-header { margin-bottom:1rem; }
.cat-title { font-size:1.15rem; font-weight:800; display:flex; align-items:center; gap:.4rem; text-transform:uppercase; letter-spacing:.05em; }
.cat-nota { font-size:.75rem; color:#999; margin-top:.15rem; }
.cat-tip { font-size:.75rem; color:var(--orange); margin-top:.25rem; }
.products-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:.8rem; }
@media(min-width:600px) { .products-grid { grid-template-columns:repeat(3, 1fr); } }

/* ── PRODUCT CARD ── */
.product-card { background:#fff; border-radius:14px; overflow:hidden; border:1px solid #f0f0f0; transition:box-shadow .15s; display:flex; flex-direction:column; }
.product-card:hover { box-shadow:0 4px 20px rgba(0,0,0,.07); }
.product-thumb { position:relative; aspect-ratio:1/1; overflow:hidden; background:#f8f8f8; }
.product-thumb-img { width:100%; height:100%; object-fit:cover; }
.product-top-badge { font-size:.65rem; background:#FFF3E0; color:#E65100; padding:.15rem .5rem; border-radius:20px; display:inline-block; margin-bottom:.2rem; }
.product-body { padding:.7rem; display:flex; flex-direction:column; flex:1; }
.product-name { font-size:.82rem; font-weight:700; margin-bottom:.2rem; line-height:1.2; }
.product-desc { font-size:.7rem; color:#888; line-height:1.35; flex:1; margin-bottom:.4rem; }
.product-chips { display:flex; flex-wrap:wrap; gap:.25rem; margin-bottom:.4rem; }
.chip { font-size:.6rem; background:#f5f5f5; color:#666; padding:.15rem .4rem; border-radius:20px; }
.stock-indicator { display:block; margin-bottom:.3rem; }
.stock-badge { font-size:.65rem; padding:.1rem .4rem; border-radius:10px; }
.stock-out { background:#FEE; color:#C00; }
.stock-order { background:#E3F2FD; color:#1565C0; }
.stock-low { background:#FFF3E0; color:#E65100; }
.stock-ok { background:#E8F5E9; color:#2E7D32; }
.stock-info { background:#E1F5FE; color:#01579B; font-weight:600; }
.stock-proj { background:#FFF3E0; color:#E65100; font-weight:600; }

/* ── COMBOS ── */
.combos-section, #productos-ancla { scroll-margin-top:120px; }
.combos-section .cat-title { color:var(--orange); }
.combos-disclaimer { font-size:.72rem; color:#8a6a52; margin-top:.35rem; padding:.4rem .6rem; background:#FFF8ED; border-left:3px solid #FFB74D; border-radius:6px; font-weight:600; }

/* Combo TERMINADO: visible pero no comprable (evento pasó) */
.combo-card-terminado { position:relative; }
.combo-card-terminado .combo-full-img,
.combo-card-terminado .product-thumb-img,
.combo-card-terminado .combo-includes,
.combo-card-terminado .product-desc,
.combo-card-terminado .combo-personas,
.combo-card-terminado .product-name,
.combo-card-terminado .product-price { opacity:.55; filter:grayscale(35%); }
.combo-card-terminado .product-price { text-decoration:line-through; }
.combo-terminado-badge { position:absolute; top:12px; left:12px; z-index:3; background:#37474F; color:#fff; font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; padding:.35rem .7rem; border-radius:20px; box-shadow:0 2px 6px rgba(0,0,0,.25); }
.combo-btn-terminado { background:#B0BEC5 !important; color:#455A64 !important; cursor:not-allowed !important; }
.combo-btn-terminado:hover { background:#B0BEC5 !important; }
/* Grupos dentro de la sección Combos (categorías temporales + permanentes) */
.combo-group { margin-top:1.1rem; }
.combo-group-head { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:1rem; font-weight:800; margin-bottom:.7rem; }
.combo-group-head-perma { color:#8a6a52; border-top:1px dashed #e8ddd0; padding-top:1rem; }
.combo-group-temporal { background:linear-gradient(180deg,#eef6ff 0%, #ffffff 70%); border:1.5px solid #cfe4ff; border-radius:16px; padding:.9rem .8rem 1rem; }
.combo-group-temporal .combo-group-head { color:#1565C0; }
.combo-group-tag { font-size:.6rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:#fff; background:#1565C0; padding:.18rem .5rem; border-radius:20px; }
.combo-card { border:1.5px solid #FFE0B2; }
.combo-card:hover { box-shadow:0 4px 22px rgba(230,81,0,.12); }
/* Card completa: la imagen diseñada es la card; debajo solo precio + botón */
.combo-card-full { overflow:hidden; }
.combo-full-img { width:100%; height:auto; display:block; }
.combo-full-foot { padding:.6rem .7rem .7rem; }
.combo-full-comp { font-size:.7rem; color:#7a6a5a; line-height:1.4; margin-bottom:.5rem; font-weight:600; }
.combo-full-foot .stock-indicator { margin-bottom:.25rem; }
.combo-full-foot .product-footer { margin-top:0; }
.combo-flag { position:absolute; top:.5rem; left:.5rem; z-index:2; font-size:.62rem; font-weight:800; background:var(--orange,#E65100); color:#fff; padding:.18rem .5rem; border-radius:20px; letter-spacing:.03em; box-shadow:0 2px 6px rgba(0,0,0,.18); }
.combo-includes { list-style:none; margin:0 0 .4rem; padding:.4rem .55rem; background:#FFF8F0; border-radius:8px; }
.combo-includes li { font-size:.66rem; color:#7a6a5a; line-height:1.5; padding-left:.9rem; position:relative; }
.combo-includes li::before { content:"•"; position:absolute; left:.15rem; color:var(--orange,#E65100); }
.combo-personas { display:inline-block; background:#FFF3E0; color:#E65100; font-weight:800; font-size:.78rem; padding:.32rem .7rem; border-radius:20px; margin-bottom:.5rem; border:1px solid #FFD8A8; }
.combo-includes li strong { color:var(--orange,#E65100); font-weight:800; }
.combo-includes li.fixed::before { content:"✓"; color:#2E7D32; }
.combo-includes li.fixed strong { color:#2E7D32; }
.combo-choose { color:#a89684; font-weight:500; }
.combo-price-old { display:block; color:#bbb; font-weight:500; font-size:.8em; line-height:1.1; }
.cart-item-combo { background:#FFF8F0; border-radius:10px; }
.cart-combo-includes { list-style:none; margin:.25rem 0 0; padding:0; }
.cart-combo-includes li { font-size:.66rem; color:#9a8a7a; line-height:1.45; padding-left:.7rem; position:relative; }
.cart-combo-includes li::before { content:"◦"; position:absolute; left:0; color:#c9a06a; }
.cart-combo-includes .pk-label { color:#c9905a; font-weight:600; }

/* Configurador de combo (modal) */
.combo-modal-overlay { display:none; position:fixed; inset:0; z-index:1000; background:rgba(0,0,0,.5); align-items:flex-end; justify-content:center; }
@media(min-width:600px){ .combo-modal-overlay { align-items:center; } }
.combo-modal { position:relative; background:#fff; width:100%; max-width:480px; max-height:92vh; overflow-y:auto; border-radius:18px 18px 0 0; padding:1.1rem 1.1rem 1.4rem; box-shadow:0 -4px 30px rgba(0,0,0,.2); animation:cmbUp .22s ease; }
@media(min-width:600px){ .combo-modal { border-radius:18px; } }
@keyframes cmbUp { from{ transform:translateY(24px); opacity:.6 } to{ transform:translateY(0); opacity:1 } }
.combo-modal-close { position:absolute; top:.5rem; right:.6rem; width:34px; height:34px; border:none; background:#f3f3f3; border-radius:50%; font-size:1.3rem; line-height:1; color:#666; cursor:pointer; }
.combo-modal-head { display:flex; gap:.7rem; align-items:center; margin-bottom:.9rem; padding-right:1.8rem; }
.combo-modal-img { width:64px; height:64px; border-radius:12px; object-fit:cover; flex-shrink:0; }
.combo-modal-title { font-size:1.05rem; font-weight:800; }
.combo-modal-desc { font-size:.74rem; color:#888; line-height:1.35; margin-top:.15rem; }
.cfg-slot { margin-bottom:1rem; }
.cfg-slot-label { font-size:.8rem; font-weight:800; color:var(--brown,#5a3a22); margin-bottom:.45rem; text-transform:uppercase; letter-spacing:.03em; }
.cfg-pick-n { color:var(--orange,#E65100); font-weight:700; text-transform:none; letter-spacing:0; }
.cfg-pickblock { margin-bottom:.5rem; }
.cfg-pick-idx { font-size:.66rem; font-weight:700; color:#b08968; margin-bottom:.3rem; }
.cfg-opts { display:grid; grid-template-columns:1fr 1fr; gap:.45rem; margin-bottom:.45rem; }
.cfg-opt { display:flex; flex-direction:column; align-items:flex-start; gap:.1rem; text-align:left; background:#fff; border:1.5px solid #eee; border-radius:10px; padding:.55rem .6rem; font-size:.74rem; font-weight:600; color:#444; cursor:pointer; transition:border-color .12s, background .12s; }
.cfg-opt:hover { border-color:#FFCC80; }
.cfg-opt.active { border-color:var(--orange,#E65100); background:#FFF3E0; color:#E65100; }
.cfg-opt.out { opacity:.5; cursor:not-allowed; }
.cfg-opt-out { font-size:.6rem; font-weight:700; color:#C00; }
.cfg-slot-fixed .cfg-fixed-item { font-size:.78rem; color:#2E7D32; font-weight:700; background:#E8F5E9; border-radius:8px; padding:.45rem .6rem; }
.combo-modal-foot { display:flex; align-items:center; justify-content:space-between; gap:.7rem; margin-top:.4rem; border-top:1px solid #f0f0f0; padding-top:.9rem; position:sticky; bottom:0; background:#fff; }
.combo-modal-price { font-size:1.15rem; color:var(--brown,#5a3a22); }
.combo-modal-price strong { font-weight:800; }
.combo-modal-add { flex:1; max-width:60%; background:var(--orange,#E65100); color:#fff; border:none; border-radius:12px; padding:.8rem; font-size:.85rem; font-weight:800; cursor:pointer; }
.combo-modal-add:disabled { background:#ccc; cursor:not-allowed; }
.product-footer { display:flex; flex-direction:column; gap:.45rem; margin-top:auto; }
.product-price { font-size:1rem; font-weight:800; color:var(--brown); }
.add-btn { display:block; width:100%; background:var(--orange); color:#fff; border:none; border-radius:50px; padding:.5rem .8rem; font-family:var(--font); font-size:.82rem; font-weight:700; cursor:pointer; transition:background .15s; text-align:center; }
.add-btn:hover { background:var(--hover-orange); }
.add-btn:disabled { background:#ccc; cursor:not-allowed; }
.card-qty-controls { display:flex; align-items:center; justify-content:center; gap:.5rem; }
.card-qty-btn { width:32px; height:32px; border-radius:50%; border:1.5px solid var(--orange); background:#fff; font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; font-weight:600; color:var(--orange); }
.card-qty-btn:disabled { opacity:.35; cursor:not-allowed; }
.card-qty-btn.remove { border-color:#ccc; color:#999; }
.card-qty-val { font-weight:700; font-size:1rem; min-width:1.4rem; text-align:center; }

/* ── CART SIDEBAR ── */
.cart-overlay { position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:200; opacity:0; pointer-events:none; transition:opacity .25s; }
.cart-overlay.open { opacity:1; pointer-events:auto; }
.cart-sidebar { position:fixed; top:0; right:-100%; width:min(360px,85vw); height:100%; background:#fff; z-index:201; display:flex; flex-direction:column; transition:right .3s; box-shadow:-4px 0 20px rgba(0,0,0,.1); }
.cart-sidebar.open { right:0; }
.cart-head { display:flex; justify-content:space-between; align-items:center; padding:1rem 1.2rem; border-bottom:1px solid #f0f0f0; }
.cart-head h3 { font-size:1.1rem; font-weight:700; }
.close-cart-btn { background:none; border:none; font-size:1.6rem; cursor:pointer; color:#999; }
.cart-body { flex:1; overflow-y:auto; padding:1rem 1.2rem; }
.cart-empty-msg { text-align:center; color:#999; padding:3rem 0; }
.cart-empty-msg span { display:block; font-size:2rem; margin-bottom:.5rem; }
.cart-item { display:flex; align-items:center; gap:.7rem; padding:.7rem 0; border-bottom:1px solid #f5f5f5; }
.cart-item-emoji { font-size:1.3rem; }
.cart-item-info { flex:1; }
.cart-item-name { font-size:.85rem; font-weight:600; }
.cart-item-sub { font-size:.75rem; color:#888; }
.qty-controls { display:flex; align-items:center; gap:.35rem; }
.qty-btn { width:26px; height:26px; border-radius:50%; border:1.5px solid var(--orange); color:var(--orange); background:#fff; font-size:.95rem; cursor:pointer; display:flex; align-items:center; justify-content:center; font-weight:600; }
.qty-btn:first-child { border-color:#ccc; color:#999; }
.cart-incentive { background:linear-gradient(135deg,#fff8e1,#fff3e0); border:1.5px solid #F07D47; border-radius:10px; padding:10px 12px; margin-bottom:10px; text-align:center; font-size:.82rem; line-height:1.5; color:#331C1C; }
.cart-incentive strong { color:#F07D47; }
.cart-incentive .incentive-cash { margin-top:6px; padding-top:6px; border-top:1px solid #f0d9c4; font-size:.78rem; color:#2e7d32; font-weight:600; }
.qty-val { font-weight:700; font-size:.85rem; min-width:1rem; text-align:center; }
.cart-foot { padding:1rem 1.2rem; border-top:1px solid #f0f0f0; }
.cart-total-row { display:flex; justify-content:space-between; font-size:.85rem; padding:.3rem 0; }
.cart-total-row.grand { font-weight:800; font-size:1rem; border-top:1px solid #eee; padding-top:.6rem; margin-top:.3rem; }
.go-form-btn { display:block; width:100%; padding:.8rem; background:var(--orange); color:#fff; border:none; border-radius:12px; font-family:var(--font); font-weight:700; font-size:.95rem; cursor:pointer; margin-top:.7rem; transition:background .15s; }
.go-form-btn:hover { background:var(--hover-orange); }

/* ── FLOAT CART ── */
.float-cart-btn { display:none; position:fixed; bottom:1.2rem; left:50%; transform:translateX(-50%); background:var(--orange); color:#fff; border:none; border-radius:50px; padding:.75rem 1.5rem; font-family:var(--font); font-weight:700; font-size:.85rem; cursor:pointer; z-index:50; box-shadow:0 4px 16px rgba(240,125,71,.4); white-space:nowrap; }

/* ── REPEAT BLOCK ── */
.repeat-block { background:#FFFDF5; border:1px solid #f0e8d0; border-radius:12px; padding:1rem; margin-bottom:1.5rem; }
.repeat-block-title { font-weight:700; font-size:.9rem; }
.repeat-item { display:flex; justify-content:space-between; font-size:.8rem; padding:.2rem 0; }
.repeat-item-nostock { opacity:.4; text-decoration:line-through; }
.repeat-btn { background:var(--orange); color:#fff; border:none; border-radius:8px; padding:.5rem 1rem; font-family:var(--font); font-weight:600; font-size:.8rem; cursor:pointer; margin-top:.5rem; }

/* ── FORM ── */
.form-section { max-width:600px; margin:0 auto 3rem; padding:0 1rem; scroll-margin-top:120px; }
#form-title { scroll-margin-top:130px; }
.form-section.collapsed .form-wrap { display:none; }
.form-section.collapsed .form-expand-btn { display:block; }
.form-expand-btn { display:none; width:100%; padding:.9rem; background:var(--cream); color:var(--brown); border:none; border-radius:12px; font-family:var(--font); font-weight:700; font-size:.9rem; cursor:pointer; }
.form-wrap { background:#fff; border:1px solid #f0f0f0; border-radius:16px; padding:1.5rem; }
.section-heading { font-size:1.2rem; font-weight:800; margin-bottom:.3rem; }
.section-sub { font-size:.85rem; color:#888; margin-bottom:1.2rem; }
.order-summary-box { background:#FAFAFA; border-radius:10px; padding:1rem; margin-bottom:1.2rem; }
.order-summary-box h4 { font-size:.85rem; font-weight:700; margin-bottom:.5rem; }
.summary-line { display:flex; justify-content:space-between; font-size:.8rem; padding:.2rem 0; }
.summary-line.shipping-line { color:var(--orange); }
.summary-line.subtotal-line { border-top:1px solid #eee; padding-top:.45rem; margin-top:.3rem; font-weight:600; }
.total-line { font-weight:800; border-top:1px solid #eee; padding-top:.5rem; margin-top:.3rem; font-size:.9rem; }
.summary-line-combo { align-items:flex-start; }
.summary-line-combo > span:first-child { display:flex; flex-direction:column; gap:.1rem; }
.summary-combo-picks { font-size:.68rem; color:#999; line-height:1.3; }
.summary-empty { font-size:.8rem; color:#bbb; }
.form-grid { display:flex; flex-direction:column; gap:.8rem; }


/* ── CUPÓN: bloque plegable arriba del Nombre ── */
.coupon-block { margin-bottom:.2rem; }
.coupon-toggle { background:none; border:none; padding:.4rem 0; color:#7a6960; font-family:var(--font); font-size:.85rem; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:.35rem; }
.coupon-toggle:hover { color:var(--orange); }
.coupon-toggle::after { content:'›'; margin-left:.2rem; font-size:1.1em; transition:transform .2s; display:inline-block; }
.coupon-toggle[aria-expanded="true"]::after { transform:rotate(90deg); }
.coupon-box { padding:.2rem 0 .1rem; animation:fadeIn .2s; }
.coupon-row { display:flex; gap:.5rem; }
.coupon-row input { flex:1; padding:.65rem .8rem; border:1.5px solid #e0e0e0; border-radius:10px; font-family:var(--font); font-size:1rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; background:#fff; }
.coupon-row input:focus { border-color:var(--orange); outline:none; }
.coupon-apply { padding:.65rem 1.2rem; background:var(--brown); color:#fff; border:none; border-radius:10px; font-family:var(--font); font-weight:700; font-size:.85rem; cursor:pointer; transition:background .15s; }
.coupon-apply:hover { background:#4a2e2e; }
.coupon-apply:disabled { background:#bbb; cursor:wait; }
.coupon-msg { font-size:.78rem; margin-top:.4rem; min-height:1em; }
.coupon-msg.err { color:#c62828; }
.coupon-msg.ok  { color:#2e7d32; }
.coupon-applied { display:flex; align-items:center; gap:.6rem; padding:.7rem .8rem; background:#E8F5E9; border:1.5px solid #66BB6A; border-radius:10px; animation:fadeIn .25s; transition:background .2s, border-color .2s; }
.coupon-applied-icon { font-size:1.3rem; }
.coupon-applied-info { flex:1; display:flex; flex-direction:column; line-height:1.3; }
.coupon-applied-info strong { font-size:.9rem; color:#1B5E20; letter-spacing:.04em; transition:color .2s; }
.coupon-applied-info small { font-size:.72rem; color:#2e7d32; transition:color .2s; }
.coupon-remove { background:none; border:none; color:#2e7d32; font-size:1.4rem; cursor:pointer; padding:0 .3rem; line-height:1; font-weight:700; transition:color .2s; }
.coupon-remove:hover { color:#c62828; }

/* Estado PENDING: cupón válido pero todavía sin productos del scope */
.coupon-applied.pending { background:#FFF3E0; border-color:#FFB74D; }
.coupon-applied.pending .coupon-applied-info strong { color:#E65100; }
.coupon-applied.pending .coupon-applied-info small { color:#BF360C; font-weight:600; }
.coupon-applied.pending .coupon-remove { color:#E65100; }
.coupon-applied.pending .coupon-remove:hover { color:#c62828; }
.field-group label { display:block; font-size:.8rem; font-weight:600; margin-bottom:.3rem; }
/* iOS: si un campo tiene menos de 16px, Safari hace zoom solo al tocarlo y el
   cliente queda con la pantalla corrida justo antes de pagar. 1rem = 16px.
   No bajar de acá nunca, por más que se vea grande en la compu. (19/08/2026) */
.field-group input, .field-group select { width:100%; padding:.65rem .8rem; border:1.5px solid #e0e0e0; border-radius:10px; font-family:var(--font); font-size:1rem; transition:border-color .15s; appearance:none; -webkit-appearance:none; background:#fff; }
.field-group input:focus, .field-group select:focus { outline:none; border-color:var(--orange); }
.field-group input.error, .field-group select.error { border-color:#e57373; }
.field-error { display:none; font-size:.72rem; color:#e57373; margin-top:.2rem; }
.field-error.visible { display:block; }
.pilar-vendedor { display:block; font-size:.72rem; color:var(--muted,#7A4A4A); margin-top:.35rem; font-style:italic; }
.pilar-restriccion { display:block; margin-top:.55rem; padding:.65rem .85rem; background:#FFF8E1; border:1px solid #FFE082; border-radius:10px; font-size:.78rem; color:#7A4A00; line-height:1.4; }
.pilar-restriccion strong { color:#5C3700; }
.select-wrapper { position:relative; }
.select-wrapper::after { content:'▾'; position:absolute; right:.8rem; top:50%; transform:translateY(-50%); pointer-events:none; color:#999; font-size:.8rem; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.horario-hint { font-size:.78rem; color:var(--orange); font-weight:600; display:none; }
.pago-fieldset { border:none; }
.pago-label { font-size:.8rem; font-weight:600; margin-bottom:.4rem; display:block; }
.radio-row { display:flex; gap:.8rem; }
.radio-opt { flex:1; }
.radio-opt input { display:none; }
.radio-opt label { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.15rem; padding:.65rem .5rem; border:1.5px solid #e0e0e0; border-radius:10px; font-size:.85rem; font-weight:600; cursor:pointer; transition:all .15s; line-height:1.25; }
.radio-opt label strong { font-weight:800; font-size:.9rem; }
.radio-opt label small { font-size:.66rem; color:#8a6a52; font-weight:500; }
.radio-opt input:checked + label small { color:#B25314; }
.radio-opt input:checked + label { border-color:var(--orange); background:#FFF8F4; color:var(--orange); }
.pago-error { display:none; font-size:.72rem; color:#e57373; margin-top:.2rem; }
.pago-error.visible { display:block; }
/* ── BLOQUE CUMPLEAÑOS ── */
.cumple-block { margin-top:1.1rem; padding:1rem; border:1.5px solid #f0e2c8; border-radius:14px; background:linear-gradient(135deg,#FFFBF2 0%,#FFF6E6 100%); }
.cumple-head { display:flex; align-items:center; gap:.7rem; margin-bottom:.85rem; }
.cumple-emoji { font-size:1.7rem; line-height:1; flex-shrink:0; }
.cumple-texts { display:flex; flex-direction:column; gap:.12rem; }
.cumple-title { font-size:.92rem; font-weight:800; color:var(--brown); line-height:1.2; }
.cumple-sub { font-size:.74rem; color:#9a8157; font-weight:600; line-height:1.25; }
.cumple-selects { display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:.5rem; }
.cumple-selects .select-wrapper::after { color:#c0a060; }
/* 1rem por lo mismo que arriba. Se achica el padding de los costados para que
   "Septiembre" siga entrando en la columna del medio. */
.cumple-selects select { width:100%; padding:.6rem .45rem; border:1.5px solid #e7d6b0; border-radius:10px; font-family:var(--font); font-size:1rem; font-weight:600; color:var(--brown); background:#fff; appearance:none; -webkit-appearance:none; transition:border-color .15s; }
.cumple-selects select:focus { outline:none; border-color:var(--orange); }
.cumple-done { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.cumple-done-ico { font-size:1.5rem; line-height:1; }
.cumple-done-txt { flex:1; min-width:0; font-size:.85rem; font-weight:600; color:var(--brown); line-height:1.3; }
.cumple-done-txt strong { color:var(--orange); white-space:nowrap; }
.cumple-edit-btn { background:#fff; border:1.5px solid #e7d6b0; color:#9a8157; font-family:var(--font); font-size:.74rem; font-weight:700; padding:.4rem .7rem; border-radius:8px; cursor:pointer; transition:all .15s; }
.cumple-edit-btn:hover { border-color:var(--orange); color:var(--orange); }
.form-note { font-size:.75rem; color:#999; text-align:center; margin:1rem 0 .8rem; }
.whatsapp-btn { display:flex; align-items:center; justify-content:center; gap:.5rem; width:100%; padding:.85rem; background:#25D366; color:#fff; border:none; border-radius:12px; font-family:var(--font); font-weight:700; font-size:1rem; cursor:pointer; transition:background .15s; }
.whatsapp-btn:hover { background:#20BD5A; }
.whatsapp-btn svg { width:22px; height:22px; }

/* ── FOOTER ── */
footer { background:var(--brown); color:#fff; padding:2rem 1.5rem 1rem; text-align:center; }
.footer-brand { font-size:1.8rem; font-weight:800; }
.footer-tag { font-size:.8rem; color:rgba(255,255,255,.6); margin-bottom:1.5rem; }
.footer-cols { display:grid; grid-template-columns:1fr; gap:1.2rem; text-align:left; max-width:700px; margin:0 auto 1.5rem; }
@media(min-width:500px) { .footer-cols { grid-template-columns:1fr 1fr; } }
.footer-col-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,.5); margin-bottom:.3rem; }
.footer-col p, .footer-col a { font-size:.82rem; color:rgba(255,255,255,.85); text-decoration:none; }
.hours-table { font-size:.8rem; }
.hours-table td { padding:.1rem .5rem .1rem 0; color:rgba(255,255,255,.8); }
.footer-hr { border:none; border-top:1px solid rgba(255,255,255,.1); margin:1rem 0; }
.footer-copy { font-size:.7rem; color:rgba(255,255,255,.35); }

/* ── TOAST ── */
.toast { position:fixed; bottom:5rem; left:50%; transform:translateX(-50%) translateY(20px); background:var(--brown); color:#fff; padding:.6rem 1.2rem; border-radius:10px; font-size:.82rem; font-weight:600; opacity:0; transition:all .25s; pointer-events:none; z-index:300; white-space:nowrap; }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ── MP ALIAS ── */
.mp-alias { display:flex; flex-direction:column; gap:.4rem; background:#E3F0FF; padding:.6rem .7rem; border-radius:8px; margin-top:.5rem; font-size:.82rem; }
.mp-alias.hidden { display:none; }
.mp-alias-row { display:flex; align-items:center; justify-content:space-between; }
.mp-alias-hint { font-size:.7rem; color:#1565C0; font-weight:500; line-height:1.35; }
.mp-copy-btn { background:var(--orange); color:#fff; border:none; border-radius:6px; padding:.3rem .7rem; font-family:var(--font); font-size:.75rem; font-weight:700; cursor:pointer; }
.mp-copy-btn:hover { background:var(--hover-orange); }

/* ── BARRA ENVÍO GRATIS ── */
.shipping-bar { background:#FFF8F4; border-bottom:1px solid #f0e8d0; padding:.45rem 1rem; text-align:center; font-size:.78rem; font-weight:600; color:var(--brown); transition:all .3s; }
.shipping-bar.hidden { display:none; }
.shipping-bar .bar-track { background:#e8e8e8; border-radius:20px; height:6px; max-width:300px; margin:.35rem auto 0; overflow:hidden; }
.shipping-bar .bar-fill { background:var(--orange); height:100%; border-radius:20px; transition:width .4s ease; }
.shipping-bar.free { background:#E8F5E9; color:#2E7D32; }

/* ── BANNER PROMO ── */
.promo-banner { background:linear-gradient(135deg, var(--orange), #e06830); color:#fff; padding:.9rem 1.2rem; text-align:center; cursor:pointer; position:relative; overflow:hidden; }
.promo-banner::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(255,255,255,.04) 10px, rgba(255,255,255,.04) 20px); }
.promo-banner-text { position:relative; font-size:.85rem; font-weight:700; }
.promo-banner-sub { position:relative; font-size:.7rem; font-weight:400; opacity:.85; margin-top:.15rem; }
.promo-banner .close-promo { position:absolute; right:.8rem; top:50%; transform:translateY(-50%); background:none; border:none; color:rgba(255,255,255,.7); font-size:1.1rem; cursor:pointer; z-index:1; }

/* ── CUPÓN DESCUENTO ── */
.coupon-section { margin-top:.8rem; padding-top:.8rem; border-top:1px solid #f0f0f0; }
.coupon-row { display:flex; gap:.5rem; }
.coupon-input { flex:1; padding:.55rem .7rem; border:1.5px solid #e0e0e0; border-radius:10px; font-family:var(--font); font-size:1rem; text-transform:uppercase; }
.coupon-input:focus { outline:none; border-color:var(--orange); }
.coupon-btn { background:var(--brown); color:#fff; border:none; border-radius:10px; padding:.55rem 1rem; font-family:var(--font); font-size:.8rem; font-weight:700; cursor:pointer; white-space:nowrap; }
.coupon-msg { font-size:.72rem; margin-top:.3rem; }
.coupon-msg.success { color:#2E7D32; }
.coupon-msg.error { color:#e57373; }
.coupon-applied { display:flex; justify-content:space-between; align-items:center; background:#E8F5E9; padding:.5rem .7rem; border-radius:8px; font-size:.8rem; color:#2E7D32; font-weight:600; }
.coupon-applied button { background:none; border:none; color:#999; cursor:pointer; font-size:.9rem; }

/* ── AHORRO VS SUPER ── */
.savings-badge { display:inline-block; font-size:.6rem; background:#E8F5E9; color:#2E7D32; padding:.15rem .45rem; border-radius:20px; font-weight:700; margin-bottom:.2rem; }
.cart-savings { text-align:center; padding:.5rem; background:#E8F5E9; border-radius:8px; margin-bottom:.5rem; font-size:.78rem; color:#2E7D32; font-weight:600; }

/* ── NEWSLETTER POPUP ── */
.nl-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9998; display:flex; align-items:flex-end; justify-content:center; padding:1rem; animation:fadeIn .3s; }
.nl-overlay.hidden { display:none; }
@media(min-width:500px) { .nl-overlay { align-items:center; } }
.nl-box { background:#fff; border-radius:16px 16px 0 0; max-width:400px; width:100%; padding:2rem 1.5rem; text-align:center; position:relative; animation:slideUp .3s ease; }
@media(min-width:500px) { .nl-box { border-radius:16px; } }
@keyframes slideUp { from{transform:translateY(30px);opacity:0} to{transform:translateY(0);opacity:1} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.nl-box h3 { font-size:1.15rem; font-weight:800; margin-bottom:.3rem; }
.nl-box h3 span { color:var(--orange); }
.nl-box p { font-size:.82rem; color:#666; margin-bottom:1rem; }
.nl-box .nl-discount { font-size:2rem; font-weight:800; color:var(--orange); margin-bottom:.3rem; }
.nl-box input[type="email"] { width:100%; padding:.7rem .9rem; border:1.5px solid #e0e0e0; border-radius:10px; font-family:var(--font); font-size:1rem; margin-bottom:.6rem; }
.nl-box input[type="email"]:focus { outline:none; border-color:var(--orange); }
.nl-box .nl-btn { display:block; width:100%; padding:.75rem; background:var(--orange); color:#fff; border:none; border-radius:10px; font-family:var(--font); font-weight:700; font-size:.95rem; cursor:pointer; }
.nl-box .nl-btn:hover { background:var(--hover-orange); }
.nl-box .nl-skip { background:none; border:none; color:#999; font-size:.78rem; cursor:pointer; margin-top:.7rem; font-family:var(--font); }
.nl-close { position:absolute; top:.7rem; right:.7rem; background:none; border:none; font-size:1.3rem; color:#ccc; cursor:pointer; }

/* Day Picker — calendario 14 días */
.day-picker { display:flex; flex-direction:column; gap:.4rem; padding:.7rem; background:#faf7f2; border:1.5px solid #e8ddd0; border-radius:12px; }
.day-picker.error { border-color:#e57373; }
.dp-dow { display:grid; grid-template-columns:repeat(7,1fr); gap:.3rem; }
.dp-dow span { text-align:center; font-size:.68rem; font-weight:700; color:#8a7968; text-transform:uppercase; letter-spacing:.04em; }
.dp-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:.3rem; }
.dp-cell { aspect-ratio:1; border:1.5px solid #e8ddd0; background:#fff; border-radius:8px; font-family:var(--font); font-size:.95rem; font-weight:700; color:#331C1C; cursor:pointer; transition:all .15s ease; display:flex; align-items:center; justify-content:center; padding:0; line-height:1; }
.dp-cell.available:hover { background:#fff4e0; border-color:var(--orange); transform:translateY(-1px); }
.dp-cell.today { box-shadow:inset 0 0 0 2px var(--orange); }
.dp-cell.past { color:#c0b5a7; background:#f2ece4; text-decoration:line-through; cursor:not-allowed; border-color:#e8ddd0; font-weight:500; }
.dp-cell.unavailable { color:#b5a89a; background:#ede5da; cursor:not-allowed; border-color:#e0d6c8; font-weight:500; }
.dp-cell.selected { background:var(--orange); color:#fff; border-color:var(--orange); box-shadow:0 2px 8px rgba(230,145,0,.35); }
.dp-cell.selected.today { box-shadow:inset 0 0 0 2px #fff, 0 2px 8px rgba(230,145,0,.35); }
.dp-cell[disabled] { pointer-events:none; }
.dp-legend { display:flex; gap:.9rem; flex-wrap:wrap; font-size:.7rem; color:#8a7968; margin-top:.15rem; justify-content:center; }
.dp-legend span { display:inline-flex; align-items:center; gap:.3rem; }
.dp-legend i { width:10px; height:10px; border-radius:3px; display:inline-block; border:1px solid #e8ddd0; }
.dp-legend i.l-ok { background:#fff; border-color:var(--orange); }
.dp-legend i.l-off { background:#ede5da; }

/* ── LOADER DE ENVÍO DEL PEDIDO ──────────────────────────────────────
   Overlay con spinner + barra de progreso indeterminada. Se muestra
   mientras el POST al backend está en vuelo (puede tardar 6-9s).
   Estados: default (enviando) / .success (✓) / .error (!) */
.send-overlay {
  position: fixed; inset: 0;
  background: rgba(20, 12, 8, .55);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  z-index: 99999;
  display: none; align-items: center; justify-content: center;
  padding: 1rem;
}
.send-overlay.active { display: flex; animation: sendFadeIn .2s ease-out; }
@keyframes sendFadeIn { from { opacity: 0; } to { opacity: 1; } }

.send-card {
  background: #fff;
  border-radius: 18px;
  padding: 2.2rem 1.6rem 1.5rem;
  max-width: 380px; width: 100%;
  text-align: center;
  box-shadow: 0 25px 60px rgba(0, 0, 0, .35);
  font-family: var(--font);
  animation: sendCardIn .35s cubic-bezier(.2, .9, .3, 1.25);
}
@keyframes sendCardIn {
  from { opacity: 0; transform: scale(.85) translateY(20px); }
  to { opacity: 1; transform: none; }
}

.send-loader {
  position: relative;
  width: 84px; height: 84px;
  margin: 0 auto 1.4rem;
}
.send-ring {
  position: absolute; inset: 0;
  border: 3px solid #FFEDD8;
  border-top-color: var(--orange);
  border-radius: 50%;
  animation: sendSpin 1s linear infinite;
}
@keyframes sendSpin { to { transform: rotate(360deg); } }

.send-logo {
  position: absolute;
  top: 50%; left: 50%;
  width: 50px; height: 50px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  animation: sendPulse 1.4s ease-in-out infinite;
}
@keyframes sendPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(.88); }
}

.send-icon-success, .send-icon-error {
  position: absolute; inset: 0;
  display: none;
  align-items: center; justify-content: center;
  font-size: 2.6rem; font-weight: 800;
  border-radius: 50%;
}
.send-icon-success { color: #2e7d32; }
.send-icon-error { color: #c62828; }

.send-card h3 {
  font-size: 1.18rem; font-weight: 800;
  color: var(--brown);
  margin: 0 0 .4rem;
}
.send-card p {
  font-size: .85rem; color: #777;
  margin: 0 0 1.3rem; line-height: 1.45;
}

.send-progress {
  height: 5px;
  background: #F4ECE4;
  border-radius: 50px;
  overflow: hidden;
  position: relative;
}
.send-progress-bar {
  position: absolute;
  height: 100%;
  width: 35%;
  background: linear-gradient(90deg, var(--orange), #FFA15E);
  border-radius: 50px;
  animation: sendProgress 1.5s cubic-bezier(.55, 0, .55, 1) infinite;
}
@keyframes sendProgress {
  0%   { left: -35%; }
  100% { left: 100%; }
}

/* Estado éxito */
.send-card.success .send-ring {
  animation: none;
  border: 3px solid #C8E6C9;
  border-top-color: #2e7d32;
  transform: rotate(0);
}
.send-card.success .send-logo { display: none; }
.send-card.success .send-icon-success { display: flex; animation: sendPop .35s cubic-bezier(.2, 1.5, .3, 1); }
.send-card.success .send-progress-bar {
  animation: none;
  left: 0; width: 100%;
  background: linear-gradient(90deg, #66BB6A, #2e7d32);
}

/* Estado error */
.send-card.error .send-ring {
  animation: none;
  border: 3px solid #FFCDD2;
  border-top-color: #c62828;
}
.send-card.error .send-logo { display: none; }
.send-card.error .send-icon-error { display: flex; animation: sendPop .35s cubic-bezier(.2, 1.5, .3, 1); }
.send-card.error .send-progress-bar {
  animation: none;
  left: 0; width: 100%;
  background: #c62828;
}
@keyframes sendPop {
  0%   { transform: scale(.3); opacity: 0; }
  60%  { transform: scale(1.15); opacity: 1; }
  100% { transform: scale(1); }
}

/* Mobile: card un poco más comprimida */
@media (max-width: 420px) {
  .send-card { padding: 1.8rem 1.3rem 1.3rem; max-width: 320px; }
  .send-loader { width: 72px; height: 72px; margin-bottom: 1.2rem; }
  .send-logo { width: 42px; height: 42px; }
  .send-card h3 { font-size: 1.05rem; }
  .send-card p { font-size: .8rem; }
}

/* ── CTA WhatsApp con estado "ready" (último paso) ─────────────
   Cuando todos los campos del form están completos, el wrap agrega
   la clase .ready: el hint aparece arriba del botón y el botón
   recibe un glow + pulse animado para que el cliente lo encuentre. */
.whatsapp-cta-wrap { position: relative; }

.whatsapp-ready-hint {
  display: none;
  align-items: center; justify-content: center;
  gap: .5rem;
  background: linear-gradient(135deg, #FFF8F0, #FFEDD8);
  border: 1.5px solid #F07D47;
  color: #C25A2A;
  font-weight: 700;
  font-size: .92rem;
  padding: .7rem 1rem;
  border-radius: 12px;
  margin-bottom: .6rem;
  box-shadow: 0 3px 10px rgba(240, 125, 71, .18);
  animation: ctaHintIn .35s cubic-bezier(.2, .9, .3, 1.25);
}
.whatsapp-cta-wrap.ready .whatsapp-ready-hint,
.whatsapp-cta-wrap.missing-pay .whatsapp-ready-hint { display: flex; }
/* Estado "solo falta el método de pago": ambar más urgente, sin pulse del botón */
.whatsapp-cta-wrap.missing-pay .whatsapp-ready-hint {
  background: linear-gradient(135deg, #FFF3D6, #FFE082);
  border-color: #F9A825;
  color: #8B5A00;
  box-shadow: 0 3px 10px rgba(249, 168, 37, .25);
}
.whatsapp-ready-hint .wh-arrow {
  font-size: 1.15rem;
  animation: ctaBounce 1s ease-in-out infinite;
}
@keyframes ctaBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(4px); }
}
@keyframes ctaHintIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}

/* Botón con glow + pulse cuando está ready */
.whatsapp-cta-wrap.ready .whatsapp-btn {
  box-shadow: 0 0 0 0 rgba(37, 211, 102, .55), 0 6px 18px rgba(37, 211, 102, .35);
  animation: ctaPulse 1.4s ease-in-out infinite;
}
@keyframes ctaPulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, .55), 0 6px 18px rgba(37, 211, 102, .35);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 0 12px rgba(37, 211, 102, 0), 0 8px 24px rgba(37, 211, 102, .5);
    transform: scale(1.015);
  }
}

@media (max-width: 420px) {
  .whatsapp-ready-hint { font-size: .85rem; padding: .6rem .8rem; }
}