/* La Viña de Tito — pedidos. Colores de la carta: rojo, naranja y amarillo sobre madera clara */
:root{
  --bg:#f7f1e8; --surface:#fffdf9; --ink:#2a1a14; --muted:#75625a; --line:#e7dccd;
  --red:#a8251c; --red-dark:#7d1a13; --orange:#e9761c; --yellow:#f4c13d; --wood:#c99a62;
  --ok:#2f7d4a; --warn:#c2620a; --bad:#b3261e; --info:#2a5d9f;
  --f-display:"Barlow Condensed","Arial Narrow",ui-sans-serif,system-ui,sans-serif;
  --f-body:"Nunito Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:12px; color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.45}
[hidden]{display:none!important}
img,svg{max-width:100%}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.num{font-variant-numeric:tabular-nums}

/* Cabecera */
header.top{background:var(--red);color:#fff;border-bottom:4px solid var(--orange);padding-top:env(safe-area-inset-top,0px)}
header.top .wrap{display:flex;align-items:center;gap:12px;padding-block:12px;flex-wrap:wrap}
.brand{font-family:var(--f-display);font-weight:700;font-size:28px;line-height:1;letter-spacing:.01em;margin-right:auto}
.brand small{display:block;font-family:var(--f-body);font-size:13px;font-weight:600;color:var(--yellow);letter-spacing:.02em}
.role{font-family:var(--f-display);font-size:18px;font-weight:600;background:rgba(0,0,0,.2);padding:4px 12px;border-radius:999px}

h1,h2,h3{font-family:var(--f-display);margin:0;text-wrap:balance;line-height:1.05}
h1{font-size:clamp(30px,6vw,44px);font-weight:700}
h2{font-size:26px;font-weight:700}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}

.btn{border:0;border-radius:999px;padding:12px 18px;font-weight:800;font-size:15px;background:var(--orange);color:#fff}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{background:transparent;border:2px solid var(--line);color:var(--ink)}
.btn.small{padding:8px 14px;font-size:14px}
.btn.red{background:var(--red)}
.btn.green{background:var(--ok)}
.btn.big{padding:16px 22px;font-size:18px}
.err{color:var(--bad);font-size:14px;margin:0}
.empty{color:var(--muted);font-size:14px}
.note{font-size:14px;color:var(--warn);font-weight:700;padding-block:8px;margin:0}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700}
input,textarea{border:2px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px;font-weight:400;font-size:16px;width:100%}
textarea{resize:vertical;min-height:60px}

/* Acceso */
.login{max-width:360px;margin:40px auto;display:flex;flex-direction:column;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px}

/* Tickets (cocina y reparto) */
.ticket{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden;box-shadow:0 1px 0 var(--line)}
.ticket::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--st,var(--line))}
.ticket[data-st="nuevo"]{--st:var(--bad)}
.ticket[data-st="preparando"]{--st:var(--warn)}
.ticket[data-st="listo"]{--st:var(--info)}
.ticket[data-st="en_camino"]{--st:var(--info)}
.ticket[data-st="entregado"]{--st:var(--ok)}
.ticket[data-st="cancelado"]{--st:var(--muted);opacity:.6}
.t-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.t-num{font-family:var(--f-display);font-weight:700;font-size:28px;line-height:1}
.t-time{font-size:14px;color:var(--muted);font-weight:700}
.t-items{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.t-items li{display:flex;gap:10px;align-items:baseline;font-size:18px;font-weight:700;line-height:1.25}
.t-items b{font-family:var(--f-display);font-size:22px;color:var(--red);min-width:34px}
.t-note{font-size:15px;background:#fff3c7;border-radius:8px;padding:8px 10px;font-weight:700;overflow-wrap:anywhere}
.chip{font-size:12px;font-weight:800;border-radius:999px;padding:3px 10px;color:#fff;background:var(--st,var(--muted));white-space:nowrap}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.colempty{color:var(--muted);font-size:15px;padding:18px;border:2px dashed var(--line);border-radius:var(--r);text-align:center}
.toast{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:999px;font-weight:700;font-size:15px;z-index:30;max-width:calc(100% - 32px);text-align:center}
@media (prefers-reduced-motion:no-preference){.ticket{animation:in .25s ease-out}@keyframes in{from{transform:translateY(6px)}to{transform:none}}}