/* Layout: caderno de cozinha — abas "Café do dia", "Restaurante" e "Estoque"; duas colunas no computador, uma no celular */
:root{
  --bg:#f3f5f1; --surface:#ffffff; --ink:#1c2925; --muted:#5b6964; --line:#dbe1dc;
  --accent:#1f6b52; --accent-ink:#ffffff; --accent-soft:#e2eee8; --warm:#a65a17; --warm-soft:#f6eadf;
  --danger:#b3261e; --danger-soft:#f9dedc;
  --display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --body:"Figtree","Segoe UI",system-ui,sans-serif;
  --r:10px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111715; --surface:#19221f; --ink:#e4ebe7; --muted:#97a6a0; --line:#2b3732;
  --accent:#62c09a; --accent-ink:#0b1a14; --accent-soft:#1d3a2f; --warm:#e3a466; --warm-soft:#3a2a1b;
  --danger:#f2857c; --danger-soft:#43201d; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111715; --surface:#19221f; --ink:#e4ebe7; --muted:#97a6a0; --line:#2b3732;
  --accent:#62c09a; --accent-ink:#0b1a14; --accent-soft:#1d3a2f; --warm:#e3a466; --warm-soft:#3a2a1b;
  --danger:#f2857c; --danger-soft:#43201d; color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 48px}
.wrap{max-width:1120px;margin:0 auto;display:grid;gap:20px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(1.6rem,4vw,2.2rem);line-height:1.1}
h2{font-size:1.2rem} h3{font-size:1rem}
.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
.num{font-variant-numeric:tabular-nums}
header{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;justify-content:space-between}
.tabs{display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:99px;padding:4px}
.tabs button{border:0;border-radius:99px;padding:7px 16px;background:transparent;color:var(--muted)}
.tabs button[aria-selected="true"]{background:var(--accent);color:var(--accent-ink)}
.notice{background:var(--warm-soft);color:var(--ink);border-radius:var(--r);padding:10px 14px;font-size:.9rem}
.grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:860px){.grid{grid-template-columns:minmax(0,1fr)}}
.col{display:grid;gap:20px;min-width:0}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;display:grid;gap:14px;min-width:0}
.panel-head{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;justify-content:space-between}
label{font-size:.82rem;color:var(--muted);font-weight:600;display:grid;gap:4px;min-width:0}
input,select{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-width:0;width:100%}
input:focus-visible,select:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button{font:inherit;cursor:pointer;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:8px 12px;font-weight:600}
button:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn-danger{color:var(--danger);border-color:transparent;background:transparent;padding-inline:4px}
.btn-danger.armed{background:var(--danger);color:var(--surface);padding-inline:12px}
.btn-small{font-size:.8rem;padding:4px 10px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.status{font-size:.85rem;color:var(--muted);min-height:1.2em}
.status.ok{color:var(--accent)} .status.err{color:var(--danger)}
.editing{font-size:.8rem;font-weight:600;color:var(--warm);background:var(--warm-soft);padding:2px 8px;border-radius:99px}
.help{font-size:.85rem;color:var(--muted);margin:0;max-width:65ch}
.empty{color:var(--muted);font-size:.9rem;padding:8px 0}

.items{display:grid;border-top:1px solid var(--line)}
.item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.item-name{font-weight:600;min-width:0}
.item-name small{display:block;font-weight:400;color:var(--muted);font-size:.8rem}
.stepper{display:flex;align-items:center;gap:4px}
.stepper button{width:34px;height:34px;padding:0;font-size:1.1rem;line-height:1}
.stepper input{width:64px;text-align:center;padding:6px 4px}
.item-cost{min-width:76px;text-align:right;font-weight:600}
.item-cost.zero{color:var(--muted);font-weight:400}
.recipe-btn{grid-column:1/2;justify-self:start;font-size:.78rem;padding:3px 8px;color:var(--accent);background:var(--accent-soft);border-color:transparent}
@media (max-width:480px){.item{grid-template-columns:minmax(0,1fr) auto}.item-cost{grid-column:2;grid-row:1}.stepper{grid-column:2;grid-row:2}}

.totals{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:var(--accent-soft);border-radius:var(--r);padding:14px}
.totals .big{font-family:var(--display);font-size:1.7rem;font-weight:700;line-height:1.1}
.totals.t3{grid-template-columns:repeat(3,minmax(0,1fr))}
.totals .big{overflow-wrap:anywhere}
@media (max-width:480px){.totals.t3{grid-template-columns:minmax(0,1fr)}.totals.t3 .big{font-size:1.4rem}}
.warn{color:var(--warm);font-weight:600}
.save-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}

.period{display:flex;flex-wrap:wrap;gap:6px}
.period button{font-size:.82rem;padding:5px 10px;font-weight:500}
.period button[aria-pressed="true"]{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.hero-metric{display:grid;gap:2px}
.hero-metric .value{font-family:var(--display);font-size:clamp(2.2rem,6vw,3rem);font-weight:700;line-height:1;color:var(--accent)}
.hero-metric .hint{font-size:.85rem;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border-top:1px solid var(--line);padding-top:12px}
.stats div{display:grid;gap:2px;min-width:0}
.stats strong{font-size:1.05rem}

.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th{text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:9px 8px;border-bottom:1px solid var(--line)}
td.r,th.r{text-align:right}
tr.click{cursor:pointer}
tr.click:hover{background:var(--accent-soft)}
.pill{display:inline-block;font-size:.75rem;font-weight:700;padding:2px 9px;border-radius:99px;white-space:nowrap}
.pill.ok{background:var(--accent-soft);color:var(--accent)}
.pill.buy{background:var(--danger-soft);color:var(--danger)}
.pill.check{background:var(--warm-soft);color:var(--warm)}
.pill.none{background:var(--bg);color:var(--muted);border:1px solid var(--line)}
.neg{color:var(--danger);font-weight:600}

details.box > summary{cursor:pointer;font-family:var(--display);font-weight:600;font-size:1.2rem;list-style:none}
details.box > summary::-webkit-details-marker{display:none}
details.box > summary::after{content:" +";color:var(--muted)}
details.box[open] > summary::after{content:" −"}
.edit-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto;gap:8px;align-items:end;padding:10px 0;border-bottom:1px solid var(--line)}
.edit-row.ins{grid-template-columns:minmax(0,2fr) minmax(0,.8fr) minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto}
.edit-row .tail{display:grid;gap:4px;justify-items:end}
.unit-cost{font-weight:600;white-space:nowrap;font-size:.85rem}
@media (max-width:700px){.edit-row,.edit-row.ins{grid-template-columns:1fr 1fr}.edit-row .wide{grid-column:1/-1}.edit-row .tail{grid-column:1/-1;justify-items:start;grid-auto-flow:column;justify-content:space-between}}
details.ingr{grid-column:1/-1;background:var(--bg);border-radius:8px;padding:8px 12px}
details.ingr summary{cursor:pointer;font-size:.85rem;font-weight:600;color:var(--accent)}
.ingr-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:6px 0}
.ingr-row .u{font-size:.85rem;color:var(--muted);min-width:36px}
.ingr-row.r5{grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto auto auto}
.ingr-row .lc{font-size:.85rem;min-width:64px;text-align:right}
@media (max-width:480px){.ingr-row.r5{grid-template-columns:minmax(0,1fr) auto auto auto}.ingr-row.r5 > select{grid-column:1/-1}}
.edit-row.prato{grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto}
@media (max-width:700px){.edit-row.prato{grid-template-columns:1fr 1fr}}
.count-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.count-row .calc{font-size:.85rem;color:var(--muted);text-align:right}
@media (prefers-reduced-motion:no-preference){button{transition:background .15s,color .15s}}
.test-banner{font-size:.85rem;font-weight:600;color:var(--warm);background:var(--warm-soft);border-radius:var(--r);padding:8px 12px}
/* Modo equipe (quem não é a dona): esconde valores em R$ e o cadastro de preços/fichas. Só esconde na tela; a trava real são as regras do banco. */
body:not(.equipe) .so-equipe{display:none!important}
.equipe .so-dona, .equipe .item-cost, .equipe #r-items .item-name small{display:none!important}
.equipe table:has(> #hist) th:nth-child(n+3), .equipe #hist td:nth-child(n+3),
.equipe table:has(> #r-hist) th:nth-child(n+3), .equipe #r-hist td:nth-child(n+3),
.equipe table:has(> #saldo) th:nth-child(5), .equipe #saldo td:nth-child(5),
.equipe table:has(> #dif) th:nth-child(5), .equipe #dif td:nth-child(5){display:none!important}
@media (max-width:480px){.equipe .item .stepper{grid-row:1}}

/* Celular: abas presas no topo, alvos de toque de 44px, campos com 16px (iPhone não dá zoom) e aviso de salvamento no rodapé */
@media (max-width:600px){
  body{padding-block:12px 96px}
  body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
  .wrap{gap:16px}
  header{display:contents}
  h1{font-size:1.5rem}
  .tabs{position:sticky;top:env(safe-area-inset-top,0px);z-index:6;width:100%;box-shadow:0 4px 14px rgb(0 0 0 / .1)}
  .tabs button{flex:1 1 0;white-space:nowrap;padding:10px 6px;min-height:44px}
  input,select{font-size:16px;min-height:44px}
  button{min-height:44px}
  .btn-small,.recipe-btn,.period button{min-height:40px}
  .stepper button{width:44px;height:44px}
  .stepper input{width:72px}
  .panel{padding:16px}
  table{font-size:.88rem}
  table:has(> #saldo) th:nth-child(3), #saldo td:nth-child(3),
  table:has(> #saldo) th:nth-child(5), #saldo td:nth-child(5){display:none}
  .status:empty{display:none}
  .status:not(:empty){position:fixed;z-index:20;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(env(safe-area-inset-bottom,0px) + 16px);padding:12px 16px;border-radius:var(--r);background:var(--ink);color:var(--surface);font-size:.95rem;font-weight:600;box-shadow:0 6px 20px rgb(0 0 0 / .2)}
  .status.ok:not(:empty){background:var(--accent);color:var(--accent-ink)}
  .status.err:not(:empty){background:var(--danger);color:var(--surface)}
}

/* ===== Site próprio (fora do claude.ai): base, login e barra da conta ===== */
html{-webkit-text-size-adjust:100%}
body{margin:0}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
[hidden]{display:none!important}
.login{min-height:80vh;display:grid;place-items:center}
.login-card{width:min(420px,100%)}
.login-card h1{margin-bottom:4px}
.login-card input{font-size:16px;min-height:44px}
.login-card .btn-primary{min-height:44px}
.conta-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.conta-acoes{display:flex;gap:8px}
.conta-bar .btn-small{min-height:40px}
.box-corpo{display:grid;gap:12px;margin-top:12px}
.campo-data{max-width:220px}
.eyebrow.r{text-align:right}
