/* =========================================================
   ESCONDIDO ROOFTOP BAR · Pool Delivery
   Paleta corporativa:
   - Verde Escondido  #3C3526  (Pantone 7771C)
   - Blanco Dolomita  #EDE3D0  (Pantone 7506C)
   - Oliva            #938F71  (Pantone 7497C)
   - Terracota        #AB4417  (Pantone 1675C)
   ========================================================= */
:root{
  --verde:#3C3526;
  --dolomita:#EDE3D0;
  --oliva:#938F71;
  --terracota:#AB4417;
  --terracota-dark:#8E3712;
  --cream-soft:#F5EFE3;
  --ink:#2E2A20;
  --muted:#7A7263;
  --line:#DCD2BE;
  --green:#4C6B3C;
  --red:#A63A1F;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  background:var(--dolomita);color:var(--ink);
  font-family:'Jost',Arial,sans-serif;
  padding-bottom:140px;
}
h1,h2,h3,.cat,.subcat{font-family:'Cormorant Garamond',Georgia,serif;}

/* ---------- Header ---------- */
header{
  background:var(--verde);
  padding:28px 20px 24px;text-align:center;
  border-bottom:4px solid var(--terracota);
}
header img.logo{width:min(300px,72vw);height:auto;display:block;margin:0 auto 18px;}
.lang-toggle{
  display:inline-flex;border-radius:20px;overflow:hidden;
  border:1.5px solid var(--dolomita);
}
.lang-toggle button{
  background:transparent;border:none;color:var(--dolomita);padding:6px 22px;font-size:13px;
  cursor:pointer;font-weight:600;letter-spacing:1.5px;font-family:'Jost',sans-serif;
}
.lang-toggle button.active{background:var(--dolomita);color:var(--verde);}

/* ---------- Notices ---------- */
.notices{padding:14px 16px 0;max-width:640px;margin:0 auto;}
.notice{
  background:var(--cream-soft);border-left:4px solid var(--terracota);border-radius:8px;
  padding:11px 14px;font-size:13px;margin-bottom:8px;line-height:1.5;
  box-shadow:0 1px 3px rgba(60,53,38,.08);
}
.notice b{font-weight:600;}

/* ---------- Menu ---------- */
main{max-width:640px;margin:0 auto;padding:6px 16px;}
.cat{
  font-size:26px;color:var(--verde);letter-spacing:5px;font-weight:600;
  margin:30px 0 2px;text-transform:uppercase;
  border-bottom:2px solid var(--terracota);padding-bottom:4px;display:inline-block;
}
.subcat{
  font-size:15px;color:var(--oliva);letter-spacing:2.5px;font-weight:600;
  margin:20px 0 4px;text-transform:uppercase;font-family:'Jost',sans-serif;
}
.item{
  background:var(--cream-soft);border:1px solid var(--line);border-radius:12px;
  padding:14px;margin:9px 0;box-shadow:0 1px 3px rgba(60,53,38,.06);
}
.item-top{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.item .info{flex:1;min-width:0;}
.item .name{font-weight:600;font-size:15px;line-height:1.3;color:var(--verde);}
.item .desc{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.4;font-weight:300;}
.item .price{font-size:16px;font-weight:700;color:var(--terracota);margin-top:5px;font-family:'Cormorant Garamond',serif;}
.allergens{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px;}
.alg{
  display:inline-flex;align-items:center;
  padding:2px 7px;border-radius:5px;
  font-size:10px;font-weight:500;letter-spacing:.2px;
  background:var(--dolomita);border:1px solid var(--oliva);color:#5F5940;
}

.stepper{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.stepper button{
  width:34px;height:34px;border-radius:50%;border:2px solid var(--terracota);
  background:var(--cream-soft);color:var(--verde);font-size:18px;font-weight:700;
  cursor:pointer;line-height:1;transition:all .15s;
}
.stepper button:active{transform:scale(.92);}
.stepper button.plus{background:var(--terracota);color:#fff;border-color:var(--terracota);}
.stepper .qty{min-width:22px;text-align:center;font-weight:700;font-size:15px;}

/* ---------- Grupos de opciones con botones (chips) ---------- */
.optgroup{margin-top:10px;}
.optgroup .og-label{font-size:12px;font-weight:600;color:var(--verde);margin-bottom:5px;letter-spacing:.3px;}
.optgroup .og-label .req{color:var(--red);}
.optgroup .og-label .opt{color:var(--muted);font-weight:400;font-size:11px;}
.chips{display:flex;flex-wrap:wrap;gap:6px;}
.chips-col{flex-direction:column;align-items:stretch;}
.chip{
  padding:7px 13px;border-radius:18px;border:1.5px solid var(--line);
  background:#fff;color:var(--ink);font-size:12.5px;font-weight:500;
  cursor:pointer;font-family:'Jost',sans-serif;transition:all .12s;
}
.chip:hover{border-color:var(--oliva);}
.chip.sel{
  background:var(--terracota);border-color:var(--terracota);color:#fff;font-weight:600;
}
.chip-pay{text-align:left;padding:11px 14px;font-size:13.5px;}
.chip.disabled{opacity:.4;pointer-events:none;}
.optgroup.warn .og-label{color:var(--red);}
.optgroup.warn .chip{border-color:var(--red);animation:shake .3s;}
@keyframes shake{25%{transform:translateX(-3px);}75%{transform:translateX(3px);}}

/* ---------- Variantes elegidas del mismo plato ---------- */
.variants{margin-top:10px;}
.variant{
  display:flex;justify-content:space-between;align-items:center;gap:8px;
  background:var(--dolomita);border:1px solid var(--line);border-radius:8px;
  padding:7px 10px;margin-top:5px;font-size:12.5px;
}
.variant .v-name{flex:1;min-width:0;color:var(--verde);font-weight:500;line-height:1.3;}
.variant .stepper button{width:26px;height:26px;font-size:14px;}
.variant .stepper .qty{min-width:16px;font-size:13px;}

/* ---------- Barra inferior fija ---------- */
.cartbar{
  position:fixed;left:0;right:0;bottom:0;background:var(--verde);
  border-top:3px solid var(--terracota);padding:14px 16px 18px;
  box-shadow:0 -4px 16px rgba(0,0,0,.18);z-index:50;
}
.cartbar-inner{max-width:640px;margin:0 auto;}
.total-line{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;}
.total-line .lbl{
  font-size:14px;font-weight:600;letter-spacing:2px;text-transform:uppercase;
  font-family:'Cormorant Garamond',serif;color:var(--dolomita);
}
.total-line .val{font-size:26px;font-weight:700;color:var(--dolomita);font-family:'Cormorant Garamond',serif;}
#orderBtn{
  width:100%;padding:15px;border:none;border-radius:10px;font-size:15px;
  font-weight:600;letter-spacing:2px;cursor:pointer;transition:all .2s;
  background:var(--terracota);color:#fff;font-family:'Jost',sans-serif;text-transform:uppercase;
}
#orderBtn:disabled{background:#5C5546;color:#A79F8E;cursor:not-allowed;}
#orderBtn:not(:disabled):active{transform:scale(.98);background:var(--terracota-dark);}

/* ---------- Overlays ---------- */
.overlay{
  display:none;position:fixed;inset:0;background:rgba(46,42,32,.6);
  z-index:100;align-items:center;justify-content:center;padding:20px;
}
.overlay.show{display:flex;}
.card{
  background:var(--dolomita);border-radius:16px;padding:30px 24px;max-width:420px;width:100%;
  text-align:center;box-shadow:0 10px 40px rgba(0,0,0,.3);
  max-height:88vh;overflow-y:auto;border-top:5px solid var(--terracota);
  position:relative;
}
.card-wide{max-width:560px;text-align:left;}
.card-wide h2{text-align:center;}
.card .icon{
  width:64px;height:64px;border-radius:50%;background:var(--terracota);color:#fff;
  font-size:32px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.card h2{color:var(--verde);margin-bottom:10px;font-size:24px;letter-spacing:1px;}
.card p{font-size:14px;line-height:1.5;color:#5C5546;}
.card .order-summary{
  text-align:left;background:var(--cream-soft);border:1px solid var(--line);border-radius:8px;
  padding:12px;margin:14px 0;font-size:13px;line-height:1.6;
}
.card .order-summary .os-line{display:flex;justify-content:space-between;gap:10px;margin-bottom:4px;}
.card .order-summary .os-line .os-name{flex:1;}
.card .order-summary .os-total{border-top:1px solid var(--line);margin-top:8px;padding-top:8px;display:flex;justify-content:space-between;}
.card button.confirm,.card #ok-btn{
  margin-top:8px;padding:14px 34px;border:none;border-radius:10px;
  background:var(--terracota);color:#fff;font-size:14px;font-weight:600;cursor:pointer;
  letter-spacing:2px;font-family:'Jost',sans-serif;text-transform:uppercase;
}
button.confirm{width:100%;padding:15px;}
button.confirm:disabled{background:#C9C0AC;color:#8B8474;cursor:not-allowed;}
.close-x{
  position:absolute;top:12px;right:14px;width:34px;height:34px;border-radius:50%;
  border:1.5px solid var(--line);background:var(--cream-soft);color:var(--verde);
  font-size:15px;cursor:pointer;font-weight:700;
}

/* ---------- Formulario dentro del panel ---------- */
.form-block{margin-top:4px;}
.form-block label{display:block;font-size:13px;font-weight:600;margin:14px 0 5px;color:var(--verde);}
.form-block label .req{color:var(--red);}
.form-block label .opt{color:var(--muted);font-weight:400;font-size:11px;}
.hint{font-size:11px;color:var(--muted);margin-top:3px;}
input,textarea{
  width:100%;padding:11px 12px;border:1.5px solid var(--line);border-radius:8px;
  font-size:15px;background:#fff;color:var(--ink);font-family:'Jost',sans-serif;
}
input:focus,textarea:focus{outline:none;border-color:var(--terracota);}
textarea{resize:vertical;min-height:54px;}
.row2{display:flex;gap:10px;}
.row2>div{flex:1;}
.nopost-note{
  margin-top:8px;background:#F7E3D9;border:1px solid var(--terracota);border-radius:8px;
  padding:9px 12px;font-size:12.5px;color:var(--red);font-weight:600;line-height:1.4;
}
.time-note{
  margin-top:16px;background:var(--cream-soft);border-left:4px solid var(--oliva);
  border-radius:8px;padding:10px 12px;font-size:13px;line-height:1.5;color:var(--verde);
}
.checkline{
  display:flex !important;align-items:flex-start;gap:9px;margin-top:10px !important;
  font-size:13px !important;font-weight:500 !important;line-height:1.4;cursor:pointer;
}
.checkline input{width:18px;height:18px;margin-top:1px;accent-color:var(--terracota);flex-shrink:0;}
.total-panel{margin-top:16px;}
.total-panel .lbl,.total-panel .val{color:var(--verde);}

.version-tag{
  text-align:center;font-size:11px;color:var(--oliva);
  padding:20px 0 4px;letter-spacing:1px;
}
