/* Frequentti — visual "Louça" (mesmo do protótipo v3). Base neutra; cor do Frequentti (Brasa) só nas telas da equipe e do dono.
   Nas telas do cliente (.rest), --brand vira a cor do restaurante (definida no cadastro). */
:root{
  --bg:#F3F3F0; --surface:#FFFFFF; --surface-2:#ECEBE7; --ink:#191714; --muted:#5C5850; --line:#E0DED8;
  --brand:#C8400E; --brand-ink:#FFFFFF; --brand-soft:#FBE5D9; --brasa:#B8401A;
  --accent:#191714; --accent-ink:#F3F3F0; --accent-soft:#ECEBE7;
  --free:#1D7148; --busy:#2D52C4; --bill:#975700; --ready:#C8400E; --on-status:#FFFFFF;
  --free-soft:#E1F1E7; --busy-soft:#E4EAFB; --bill-soft:#FBEBCF; --ready-soft:#FBE5D9;
  --stage:#E4E3DE; --frame:#121110;
  --display:"Funnel Display","Geist",system-ui,sans-serif;
  --body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Geist",system-ui,sans-serif;
  --r:18px; --r-sm:12px;
  --shadow:0 1px 2px rgb(25 23 20 / .04),0 6px 20px rgb(25 23 20 / .06);
  --shadow-up:0 18px 44px rgb(25 23 20 / .16);
  --wa-bg:#efe7dc; --wa-out:#d9fdd3; --wa-in:#ffffff; --wa-ink:#111b21; --wa-head:#075e54; --wa-head-ink:#ffffff; --wa-btn:#027eb5;
  --alert:#B3261E; --alert-soft:#FBE1DE; --ok:#1D7148; --ok-soft:#E1F1E7; --warn:#975700; --warn-soft:#FBEBCF;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#121110; --surface:#1C1B19; --surface-2:#262421; --ink:#F2F0EB; --muted:#ABA69D; --line:#35322D;
  --brand:#FF7A45; --brand-ink:#1A0D06; --brand-soft:#3B2016; --brasa:#E8774F;
  --accent:#F2F0EB; --accent-ink:#121110; --accent-soft:#262421;
  --free:#5CC98F; --busy:#8EA8FF; --bill:#F2B54A; --ready:#FF7A45; --on-status:#121110;
  --free-soft:#17301F; --busy-soft:#1D2547; --bill-soft:#3A2A0E; --ready-soft:#3B2016;
  --stage:#0A0909; --frame:#000000;
  --shadow:0 1px 2px rgb(0 0 0 / .3),0 6px 20px rgb(0 0 0 / .25);
  --shadow-up:0 18px 44px rgb(0 0 0 / .5);
  --wa-bg:#0b141a; --wa-out:#005c4b; --wa-in:#202c33; --wa-ink:#e9edef; --wa-head:#202c33; --wa-head-ink:#e9edef; --wa-btn:#53bdeb;
  --alert:#FF8A7E; --alert-soft:#42191A; --ok:#5CC98F; --ok-soft:#17301F; --warn:#F2B54A; --warn-soft:#3A2A0E;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#121110; --surface:#1C1B19; --surface-2:#262421; --ink:#F2F0EB; --muted:#ABA69D; --line:#35322D;
  --brand:#FF7A45; --brand-ink:#1A0D06; --brand-soft:#3B2016; --brasa:#E8774F;
  --accent:#F2F0EB; --accent-ink:#121110; --accent-soft:#262421;
  --free:#5CC98F; --busy:#8EA8FF; --bill:#F2B54A; --ready:#FF7A45; --on-status:#121110;
  --free-soft:#17301F; --busy-soft:#1D2547; --bill-soft:#3A2A0E; --ready-soft:#3B2016;
  --stage:#0A0909; --frame:#000000;
  --shadow:0 1px 2px rgb(0 0 0 / .3),0 6px 20px rgb(0 0 0 / .25);
  --shadow-up:0 18px 44px rgb(0 0 0 / .5);
  --wa-bg:#0b141a; --wa-out:#005c4b; --wa-in:#202c33; --wa-ink:#e9edef; --wa-head:#202c33; --wa-head-ink:#e9edef; --wa-btn:#53bdeb;
  --alert:#FF8A7E; --alert-soft:#42191A; --ok:#5CC98F; --ok-soft:#17301F; --warn:#F2B54A; --warn-soft:#3A2A0E;
  color-scheme:dark}

/* Paleta da marca Frequentti "Forno a Lenha" (creme, páprica, espresso): só nas telas da equipe e do dono.
   As telas do cliente (<body class="rest">) ficam com a base neutra acima + a cor do restaurante. */
:root:not(:has(body.rest)){
  --bg:#F3E6D3; --surface:#FFFBF5; --surface-2:#EADBC6; --line:#E0CDB5; --ink:#2B1A12; --muted:#6B5A4C;
  --brand:#B8401A; --brand-ink:#FFFFFF; --brand-soft:#F6DCCB; --brasa:#B8401A;
  --accent:#2B1A12; --accent-ink:#F3E6D3; --accent-soft:#EADBC6;
  --ready:#B8401A; --ready-soft:#F6DCCB;
  --stage:#E8D8C3; --frame:#2B1A12;
  --shadow:0 1px 2px rgb(43 26 18 / .05),0 6px 20px rgb(43 26 18 / .08);
  --shadow-up:0 18px 44px rgb(43 26 18 / .18);}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]):not(:has(body.rest)){
  --bg:#17100C; --surface:#221813; --surface-2:#2D211A; --line:#3D2E25; --ink:#F3E6D3; --muted:#BFAE98;
  --brand:#E8774F; --brand-ink:#17100C; --brand-soft:#3E2216; --brasa:#E8774F;
  --accent:#F3E6D3; --accent-ink:#17100C; --accent-soft:#2D211A;
  --ready:#E8774F; --ready-soft:#3E2216; --on-status:#17100C;
  --stage:#0F0A08; --frame:#000000;
  --shadow:0 1px 2px rgb(8 4 2 / .35),0 6px 20px rgb(8 4 2 / .3);
  --shadow-up:0 18px 44px rgb(8 4 2 / .55);}}
:root[data-theme="dark"]:not(:has(body.rest)){
  --bg:#17100C; --surface:#221813; --surface-2:#2D211A; --line:#3D2E25; --ink:#F3E6D3; --muted:#BFAE98;
  --brand:#E8774F; --brand-ink:#17100C; --brand-soft:#3E2216; --brasa:#E8774F;
  --accent:#F3E6D3; --accent-ink:#17100C; --accent-soft:#2D211A;
  --ready:#E8774F; --ready-soft:#3E2216; --on-status:#17100C;
  --stage:#0F0A08; --frame:#000000;
  --shadow:0 1px 2px rgb(8 4 2 / .35),0 6px 20px rgb(8 4 2 / .3);
  --shadow-up:0 18px 44px rgb(8 4 2 / .55);}

/* telas do cliente: cor do restaurante (shared.js calcula --rest e --rest-ink com contraste AA) */
.rest{--brand:var(--rest,#A8321F); --brand-ink:var(--rest-ink,#FFFFFF); --brand-soft:color-mix(in oklch,var(--rest,#A8321F) 13%,var(--surface)); --accent:var(--rest,#A8321F); --accent-ink:var(--rest-ink,#FFFFFF); --accent-soft:color-mix(in oklch,var(--rest,#A8321F) 20%,var(--surface))}

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;letter-spacing:-.003em;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;margin:0;line-height:1.12;letter-spacing:-.015em;text-wrap:balance}
h1{font-weight:800;letter-spacing:-.025em}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;border-radius:10px;background:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--brasa);outline-offset:2px}
.muted{color:var(--muted)} .small{font-size:.82rem}
.eyebrow{font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:600}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* logo minúsculo com anel páprica (um prato) no i: <span class="wm">frequentt<span class="i"><span class="vh">i</span></span></span> */
.wm{font-family:var(--display);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--ink);text-decoration:none}
.wm .i{position:relative;display:inline-block;width:.25em;height:.53em;margin-left:.035em}
.wm .i::before{content:"";position:absolute;left:50%;bottom:0;width:.165em;height:.53em;transform:translateX(-50%);background:currentColor;border-radius:.02em}
.wm .i::after{content:"";position:absolute;left:50%;bottom:.575em;width:.31em;height:.31em;transform:translateX(-50%);border-radius:50%;border:.068em solid var(--brasa)}

/* componentes */
.card{background:var(--surface);border:0;border-radius:var(--r);padding:18px;box-shadow:var(--shadow)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 18px;border:0;border-radius:14px;background:var(--brand);color:var(--brand-ink);font-weight:600;text-decoration:none;transition:transform .12s,filter .12s}
.btn:hover{filter:brightness(1.06)} .btn:active{transform:scale(.97)}
.btn.alt,.btn.sec{background:var(--surface-2);color:var(--ink)}
.btn.ghost{background:transparent;box-shadow:inset 0 0 0 1.5px var(--line);color:var(--ink)}
.btn.bad{background:var(--alert-soft);color:var(--alert)}
.btn.full{width:100%}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.pill{display:inline-block;font-size:.74rem;font-weight:600;padding:4px 10px;border-radius:99px;white-space:nowrap}
.pill.ok{background:var(--ok-soft);color:var(--ok)} .pill.alert{background:var(--alert-soft);color:var(--alert)} .pill.warn{background:var(--warn-soft);color:var(--warn)} .pill.info{background:var(--busy-soft);color:var(--busy)}
input,select,textarea{color:var(--ink);background:var(--surface-2);border:1.5px solid transparent;border-radius:12px;padding:11px 13px;max-width:100%;transition:border-color .12s,background .12s}
input:focus,select:focus,textarea:focus{background:var(--surface);border-color:var(--brand);outline:none}
/* abas: ativa = pílula escura */
.tabs{display:flex;gap:6px;overflow-x:auto;padding:2px 0 4px;scrollbar-width:none}
.tabs button,.tabs a{padding:9px 16px;font-weight:600;color:var(--muted);border-radius:99px;white-space:nowrap;background:var(--surface);text-decoration:none}
.tabs [aria-selected="true"],.tabs [aria-current="page"],.tabs [aria-pressed="true"]{color:var(--bg);background:var(--ink)}
.alertbox{box-shadow:inset 3px 0 0 var(--alert);background:var(--alert-soft);color:var(--ink);border-radius:14px;padding:13px 16px}
.okbox{box-shadow:inset 3px 0 0 var(--ok);background:var(--ok-soft);color:var(--ink);border-radius:14px;padding:13px 16px}
.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:14px;font-weight:600;z-index:60;max-width:calc(100% - 32px);box-shadow:0 8px 24px rgb(0 0 0 / .25)}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}