/* ============================================================
   Public website (site/*) — ADDITIVE layer over one-qr.css.
   Same tokens, same components; only site-only pieces live
   here (nav links, cart, gallery, review cards). Loaded AFTER
   one-qr.css on public pages only.
   ============================================================ */
.qr-page.web-site .qr-topbar{ display:flex; } /* always on for the site */
.qr-page.web-site [hidden]{ display:none !important; } /* flex rows must still honour hidden */
.web-links{ display:flex; gap:2px; align-items:center; margin-left:8px; flex-wrap:wrap; }
.web-link{ font:600 13.5px var(--font-body); color:var(--sub); text-decoration:none; padding:7px 11px; border-radius:999px; transition:background .18s,color .18s; }
.web-link:hover{ background:#F3EDDC; color:var(--ink); }
.web-link.active{ background:var(--green); color:var(--gold); }
.web-order-cta{ margin-left:auto; }
@media (max-width:640px){
  .web-links{ order:3; width:100%; margin:6px 0 0; overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none; }
  .web-links::-webkit-scrollbar{ display:none; }
  .web-link{ white-space:nowrap; }
  .web-order-cta{ margin-left:auto; }
}

/* Home */
.web-cta-row{ display:flex; gap:10px; flex-wrap:wrap; margin:0 0 18px; }
.web-cta-main{ flex:1 1 200px; justify-content:center; }
.web-about p{ margin:0; font-size:15.5px; line-height:1.65; }
.web-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; margin-top:14px; }
.web-mini .btn{ margin-top:10px; margin-right:6px; }
.web-mini-num{ font:800 30px/1 var(--font-disp); margin:6px 0 2px; }
.web-big-stars{ display:flex; gap:2px; align-items:center; }
.web-big-stars svg{ width:22px; height:22px; }

/* Menu band + floating order button */
.web-order-band{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:linear-gradient(135deg,var(--green),var(--green-deep)); color:#fff; border-radius:var(--r-lg); padding:18px 20px; margin-top:20px; }
.web-order-band .muted{ color:#C9BFA4; }
.web-order-band-t{ font:700 19px var(--font-disp); color:var(--gold); }
.web-order-band .btn{ margin-left:auto; }
.web-fab{ position:fixed; right:16px; bottom:16px; z-index:60; display:inline-flex; align-items:center; gap:8px; background:var(--gold); color:var(--green); font:700 15px var(--font-body); padding:13px 20px; border-radius:999px; box-shadow:0 10px 26px rgba(15,45,38,.35); text-decoration:none; }
@media (min-width:900px){ .web-fab{ display:none; } }

/* Order layout */
.web-order-grid{ display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:18px; align-items:start; }
.web-order-menu{ min-width:0; } /* CX: grid item must shrink below the catnav min-content (no page scroll @375) */
@media (max-width:980px){ .web-order-grid{ grid-template-columns:1fr; } }
.web-cart{ position:sticky; top:76px; }
@media (max-width:980px){ .web-cart{ position:static; } }
.web-add{ display:flex; align-items:center; gap:8px; }
/* In the order page's narrower menu column the add controls stack
   under the price so cards keep the grid (no min-content spill). */
.web-order-menu .e4-mi{ min-width:0; }
.web-order-menu .e4-mi-side{ min-width:0; }
.web-order-menu .web-add{ flex-direction:column; align-items:flex-end; gap:6px; }
.web-line{ padding:9px 0; border-bottom:1px dashed var(--line); }
.web-line-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.web-line-top b{ font-size:14.5px; min-width:0; }
.web-line-top .amt{ font-size:15px; white-space:nowrap; }
.web-line-bot{ display:flex; align-items:center; gap:10px; margin-top:6px; }
.web-line-bot .web-line-x{ margin-left:auto; }
.web-line-x{ border:0; background:none; color:var(--bad); font-size:20px; line-height:1; cursor:pointer; padding:2px 4px; }
.web-type-toggle{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:14px 0 12px; }
.web-type-opt input{ position:absolute; opacity:0; pointer-events:none; }
.web-type-opt span{ display:block; text-align:center; padding:10px 8px; border:1.5px solid var(--line); border-radius:var(--r-md); font:700 14px var(--font-body); color:var(--sub); cursor:pointer; transition:all .18s; }
.web-type-opt input:checked + span{ background:var(--green); color:var(--gold); border-color:var(--green); }
.web-type-opt{ position:relative; }
.web-err{ margin:0 0 14px; }
.web-placed{ margin:0 0 14px; }
.web-cartbar{ position:fixed; left:12px; right:12px; bottom:12px; z-index:70; background:var(--tile); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:0 14px 34px rgba(35,32,26,.22); padding:12px 14px; display:flex; align-items:center; gap:12px; }
.web-cartbar-info{ display:flex; flex-direction:column; }
.web-cartbar-info b{ font:800 18px var(--font-disp); }
.web-cartbar .btn{ margin-left:auto; }
@media (min-width:981px){ .web-cartbar{ display:none !important; } }

/* Track */
.web-track-meta{ margin-top:14px; border-top:1px dashed var(--line); padding-top:10px; }

/* Reservations */
.web-form-card .form-grid{ margin-top:6px; }

/* Reviews */
.web-rev-head{ text-align:center; padding:26px 20px; }
.web-rev-head .web-big-stars{ justify-content:center; }
.web-rev-avg{ font:800 34px/1.1 var(--font-disp); margin-top:6px; }
.web-rev-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px; margin-top:14px; }
.web-rev-card{ margin:0; }
.web-rev-top{ display:flex; align-items:center; gap:8px; justify-content:space-between; }
.web-rev-top .web-rev-stars{ display:flex; gap:1px; }
.web-rev-text{ font-size:15px; line-height:1.6; margin:10px 0 12px; }

/* Loyalty */
.web-steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }
.web-step{ position:relative; }
.web-step-n{ position:absolute; top:16px; right:18px; font:800 34px/1 var(--font-disp); color:var(--amber); opacity:.55; }
.web-loy-rules{ margin-top:14px; }

/* Gallery */
.web-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; }
.web-gal-item{ margin:0; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:var(--tile-2); }
.web-gal-item img{ width:100%; height:220px; object-fit:cover; display:block; transition:transform .4s ease; }
.web-gal-item:hover img{ transform:scale(1.04); }

/* Closed / empty states */
.web-closed{ text-align:center; padding:30px 22px; }
.web-closed .btn{ margin-top:12px; }

/* CX upgrade: photo-card add row stays a row; cart lines carry the
   dish thumb (dish-photos.css) aligned with the name. */
.web-dish .web-add{ flex-direction:row; align-items:center; }
.web-line-top{ align-items:center; }
.web-line-top b{ flex:1; }

/* Honeypot: humans never see it, bots fill it */
.web-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; pointer-events:none; }
