/* Balcão Fácil · temas para AVALIAR no aparelho. Carregado depois de estilo.css.
   Sem tema (ou ?tema=atual) nada aqui vale: o visual atual não muda.
   Liga-se por ?tema=papel | feira | painel (script no index.html põe data-tema no <html>).
   Cada tema redefine os mesmos tokens do estilo.css e alguns tokens de forma; as regras estruturais
   abaixo (bloco "comum") só leem esses tokens. Só pilhas de fontes do sistema: nada depende de internet. */

/* ================= comum a todos os temas ================= */
:root[data-tema]{--danger:#B3261E; --danger-soft:#FBE4E1; --hi:var(--accent); --hi-fg:var(--accent-fg); --hi-soft:var(--accent-soft); --hi-borda:var(--accent); --seg:var(--surface-2); --campo-borda:var(--line); --r-btn:12px; --r-cartao:22px; --r-input:12px; --peso-num:800}
:root[data-tema] .btn,:root[data-tema] .modo-admin,:root[data-tema] .abas button,:root[data-tema] .chips button,:root[data-tema] .icon-btn,:root[data-tema] .step button{border-radius:var(--r-btn)}
:root[data-tema] .btn.small{border-radius:var(--r-btn)}
:root[data-tema] .cartao{border-radius:var(--r-cartao)}
:root[data-tema] input,:root[data-tema] select{border-radius:var(--r-input);border-color:var(--campo-borda)}
:root[data-tema] .modo{border-radius:var(--r-cartao)}
:root[data-tema] .sabor .qtd,:root[data-tema] .card .num,:root[data-tema] .ficha-num,:root[data-tema] .total b,:root[data-tema] .kpi b,:root[data-tema] .barra-pedido .info b,:root[data-tema] .busca-card #busca-num,:root[data-tema] .ficha-total{font-weight:var(--peso-num)}
/* erro e perigo têm cor própria: em temas de acento verde ou azul, o acento não pode virar "erro" */
:root[data-tema] .erro,:root[data-tema] .aviso-campo,:root[data-tema] .sabor .esg{color:var(--danger)}
:root[data-tema] .aviso:not([data-k="warn"]){background:var(--danger-soft);color:var(--danger)}
:root[data-tema] .conn[data-k="erro"]{background:var(--danger-soft);color:var(--danger)}
:root[data-tema] .conn[data-k="erro"] i{background:var(--danger)}
:root[data-tema] .btn.danger{color:var(--danger);border-color:var(--danger)}
:root[data-tema] .btn.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink)}
:root[data-tema] .card.big{border-color:var(--accent)}
:root[data-tema] .card.chegou{border-color:var(--hi-borda);background:var(--hi-soft)}
:root[data-tema] .tag.chegou{background:var(--hi);color:var(--hi-fg)}
@keyframes pulsa-tema{50%{box-shadow:0 0 0 8px var(--hi-soft)}}
:root[data-tema] .card.chegou{animation-name:pulsa-tema}
:root[data-tema] .picote::before,:root[data-tema] .picote::after{border-color:var(--ficha-borda,var(--accent))}
:root[data-tema] .picote{border-top-color:var(--picote,var(--line))}
:root[data-tema] .pular{background:var(--fg);color:var(--surface)}
@media (hover:hover){
  :root[data-tema] .sabor:hover:not(:disabled){border-color:var(--accent);background:var(--accent-soft)}
}
@media (prefers-reduced-motion: reduce){:root[data-tema] .card.chegou{animation:none}}


/* ================= A · PAPEL =================
   Branco puro, texto quase preto, um único acento verde para ação e confirmação.
   Pensado para sol forte: contraste máximo, borda fina mas escura, números enormes em peso 900. */
:root[data-tema="papel"]{
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F1F1EF; --fg:#111111; --muted:#4A4A4A; --line:#BDBDBD;
  --accent:#0A6B38; --accent-ink:#085A2F; --accent-fg:#FFFFFF; --accent-soft:#E2F2E8;
  --ok:#0A6B38; --ok-fg:#FFFFFF; --ok-soft:#E2F2E8; --warn:#6E4300; --warn-soft:#FFF0D1;
  --danger:#B00020; --danger-soft:#FDE7EA;
  --veu:rgba(0,0,0,.55); --shadow:0 -8px 30px rgba(0,0,0,.2);
  --display:system-ui,-apple-system,"SF Pro Display","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --text:system-ui,-apple-system,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --r:8px; --r-btn:8px; --r-cartao:12px; --r-input:8px; --campo-borda:#767676; --peso-num:900;
  --ficha-borda:#111111; --picote:#111111;
}
:root[data-tema="papel"] h1,:root[data-tema="papel"] h2,:root[data-tema="papel"] h3,:root[data-tema="papel"] .titulo,:root[data-tema="papel"] .h{letter-spacing:-.02em}
:root[data-tema="papel"] .appbar{border-bottom:2px solid var(--fg)}
:root[data-tema="papel"] .abas{border-bottom:1px solid var(--line)}
:root[data-tema="papel"] .cartao,:root[data-tema="papel"] .card,:root[data-tema="papel"] .kpi,:root[data-tema="papel"] .item,:root[data-tema="papel"] .bloco,:root[data-tema="papel"] .busca-card,:root[data-tema="papel"] .tabela-wrap,:root[data-tema="papel"] .sabor{border-width:1px}
:root[data-tema="papel"] .btn{border-width:1.5px;font-weight:800}
:root[data-tema="papel"] .btn:not(.primary):not(.ok):not(.on):not(.warn):not(.danger){background:#fff;border-color:var(--fg);color:var(--fg)}
:root[data-tema="papel"] .btn.ghost{border-color:#767676}
:root[data-tema="papel"] .btn-inicio{background:#fff}
:root[data-tema="papel"] .logo{background:var(--fg);color:#fff;border-radius:8px}
:root[data-tema="papel"] .modo{border-radius:10px;font-weight:900;letter-spacing:-.02em}
:root[data-tema="papel"] .modo.entrega{background:#fff;border-color:var(--accent);color:var(--accent-ink)}
:root[data-tema="papel"] .sabor{border-color:#767676;min-height:112px}
:root[data-tema="papel"] .sabor .nome{font-weight:800}
:root[data-tema="papel"] .sabor .preco{color:var(--fg);font-weight:900;font-size:1.3rem}
:root[data-tema="papel"] .sabor.tem{border-color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent);background:var(--accent-soft)}
:root[data-tema="papel"] .sabor .qtd{border-radius:8px;min-width:34px;height:34px;font-size:1.15rem}
:root[data-tema="papel"] .total b{font-size:2.8rem;letter-spacing:-.03em}
:root[data-tema="papel"] .somas{border-top:2px dashed var(--fg)}
:root[data-tema="papel"] .chips button{border-color:#767676;border-width:1.5px}
:root[data-tema="papel"] .chips button[aria-checked="true"]{background:var(--fg);border-color:var(--fg);color:#fff}
:root[data-tema="papel"] .abas button{border-color:#767676}
:root[data-tema="papel"] .abas button[aria-selected="true"]{background:var(--fg);color:#fff;border-color:var(--fg)}
:root[data-tema="papel"] .troco{background:var(--surface-2);border:1px solid var(--line);border-radius:8px}
:root[data-tema="papel"] .pedido{border-radius:14px 14px 0 0}
:root[data-tema="papel"] .pedido{border-top:2px solid var(--fg)}
@media (min-width:720px){:root[data-tema="papel"] .pedido{border-top:0;border-left:2px solid var(--fg);border-radius:0}}
:root[data-tema="papel"] .barra-pedido{border-top:2px solid var(--fg)}
:root[data-tema="papel"] .barra-pedido .ver{border-radius:8px}
/* ficha: ingresso de papel, tinta preta, número gigante */
:root[data-tema="papel"] .ficha{border:3px solid var(--fg);border-radius:10px}
:root[data-tema="papel"] .ficha-num{color:var(--fg);font-size:clamp(7rem,34vw,12rem);letter-spacing:-.05em;line-height:.85;padding-top:6px}
:root[data-tema="papel"] .ficha-label{color:var(--fg)}
:root[data-tema="papel"] .ficha-itens li b{color:var(--accent-ink)}
:root[data-tema="papel"] .ficha-total{font-size:1.6rem}
:root[data-tema="papel"] .picote{border-top-width:3px}
:root[data-tema="papel"] .picote::before,:root[data-tema="papel"] .picote::after{border-width:3px}
/* entrega */
:root[data-tema="papel"] .card .num{font-size:2.6rem;letter-spacing:-.04em}
:root[data-tema="papel"] .card.big .num{font-size:4rem}
:root[data-tema="papel"] .card li b{color:var(--accent-ink)}
:root[data-tema="papel"] .card.chegou{border-width:3px;background:var(--accent-soft)}
:root[data-tema="papel"] .tag.espera{background:var(--surface-2);color:var(--fg);box-shadow:inset 0 0 0 1px #767676}
:root[data-tema="papel"] .kpi.destaque{background:var(--fg);border-color:var(--fg)}
:root[data-tema="papel"] .kpi b{letter-spacing:-.03em}
:root[data-tema="papel"] .toast{border-radius:8px}

@media (prefers-color-scheme: dark){
  :root[data-tema="papel"]:not([data-theme="light"]){
    --bg:#0B0B0B; --surface:#141414; --surface-2:#232323; --fg:#F5F5F5; --muted:#C2C2C2; --line:#4A4A4A;
    --accent:#3FD27F; --accent-ink:#6FE3A0; --accent-fg:#04210F; --accent-soft:#12301F;
    --ok:#3FD27F; --ok-fg:#04210F; --ok-soft:#12301F; --warn:#F0B454; --warn-soft:#3A2A0E;
    --danger:#FF8A94; --danger-soft:#3E1B20;
    --veu:rgba(0,0,0,.7); --shadow:0 -8px 30px rgba(0,0,0,.6);
    --campo-borda:#8C8C8C; --ficha-borda:#F5F5F5; --picote:#F5F5F5;
  }
  :root[data-tema="papel"]:not([data-theme="light"]) .btn:not(.primary):not(.ok):not(.on):not(.warn):not(.danger){background:var(--surface);border-color:var(--fg)}
  :root[data-tema="papel"]:not([data-theme="light"]) .btn.ghost,:root[data-tema="papel"]:not([data-theme="light"]) .btn-inicio{background:var(--surface)}
  :root[data-tema="papel"]:not([data-theme="light"]) .logo{background:var(--fg);color:#0B0B0B}
  :root[data-tema="papel"]:not([data-theme="light"]) .chips button[aria-checked="true"],:root[data-tema="papel"]:not([data-theme="light"]) .abas button[aria-selected="true"]{color:#0B0B0B}
  :root[data-tema="papel"]:not([data-theme="light"]) .modo.entrega{background:var(--surface)}
  :root[data-tema="papel"]:not([data-theme="light"]) .kpi.destaque{background:var(--fg);color:#0B0B0B}
  :root[data-tema="papel"]:not([data-theme="light"]) .kpi.destaque span{color:#0B0B0B}
  :root[data-tema="papel"]:not([data-theme="light"]) .sabor{border-color:#8C8C8C}
}


/* ================= B · FEIRA =================
   Off-white quente, azul-petróleo como acento; o amarelo aparece só para destacar o número e o pedido novo.
   Cantos bem arredondados e fonte arredondada do sistema (SF Rounded no iPhone e iPad): amigável para voluntários. */
:root[data-tema="feira"]{
  --bg:#FBF6EA; --surface:#FFFFFF; --surface-2:#F2EAD7; --fg:#1B2B2D; --muted:#51595A; --line:#DDD1B6;
  --accent:#0E5F68; --accent-ink:#0B4F57; --accent-fg:#FFFFFF; --accent-soft:#DDEFF0;
  --ok:#1C6F40; --ok-fg:#FFFFFF; --ok-soft:#DCF1E4; --warn:#7A4A00; --warn-soft:#FFEDC7;
  --danger:#B3261E; --danger-soft:#FCE5E2;
  --hi:#FFCF3F; --hi-fg:#1B2B2D; --hi-soft:#FFF3C4; --hi-borda:#E5AE00;
  --veu:rgba(27,43,45,.5); --shadow:0 -10px 30px rgba(27,43,45,.2);
  --display:ui-rounded,"SF Pro Rounded","Hiragino Maru Gothic ProN",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --text:ui-rounded,"SF Pro Rounded",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:20px; --r-btn:18px; --r-cartao:28px; --r-input:16px; --campo-borda:#7E7458; --peso-num:800;
  --ficha-borda:#0E5F68; --picote:#0E5F68;
}
:root[data-tema="feira"] .appbar{border-bottom:0;box-shadow:0 2px 0 var(--line)}
:root[data-tema="feira"] .cartao{border-width:2px;border-color:var(--line);box-shadow:0 10px 30px rgba(27,43,45,.08)}
:root[data-tema="feira"] .card,:root[data-tema="feira"] .kpi,:root[data-tema="feira"] .busca-card,:root[data-tema="feira"] .bloco,:root[data-tema="feira"] .item,:root[data-tema="feira"] .tabela-wrap{border-radius:22px;border-color:var(--line);box-shadow:0 2px 0 var(--line)}
:root[data-tema="feira"] .logo{border-radius:14px}
:root[data-tema="feira"] .btn{font-weight:800}
:root[data-tema="feira"] .btn.ghost{background:var(--surface);border-color:var(--campo-borda)}
:root[data-tema="feira"] .modo{font-weight:800;border-radius:28px;box-shadow:0 4px 0 rgba(11,79,87,.35)}
:root[data-tema="feira"] .modo.entrega{box-shadow:0 4px 0 rgba(11,79,87,.2)}
:root[data-tema="feira"] .sabor{border-width:2px;border-color:var(--line);box-shadow:0 3px 0 var(--line);min-height:112px}
:root[data-tema="feira"] .sabor .preco{color:var(--accent-ink);font-weight:800}
:root[data-tema="feira"] .sabor.tem{border-color:var(--accent);box-shadow:0 3px 0 var(--accent);background:var(--accent-soft)}
:root[data-tema="feira"] .sabor .qtd{background:var(--hi);color:var(--hi-fg);min-width:34px;height:34px;font-size:1.15rem;box-shadow:0 0 0 2px #fff}
:root[data-tema="feira"] .total b{font-size:2.5rem;background:linear-gradient(transparent 60%,var(--hi) 60%);padding:0 4px;margin:0 -4px}
:root[data-tema="feira"] .chips button{border-width:2px;border-radius:999px;background:var(--surface);border-color:var(--campo-borda)}
:root[data-tema="feira"] .chips button[aria-checked="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
:root[data-tema="feira"] .abas{border-bottom:0;box-shadow:0 2px 0 var(--line)}
:root[data-tema="feira"] .abas button{border-radius:999px;border-width:2px;border-color:var(--line);background:var(--bg)}
:root[data-tema="feira"] .abas button[aria-selected="true"]{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
:root[data-tema="feira"] .troco{border-radius:18px;background:var(--hi-soft)}
:root[data-tema="feira"] .pedido{border-radius:30px 30px 0 0}
@media (min-width:720px){:root[data-tema="feira"] .pedido{border-radius:0;border-left:2px solid var(--line)}}
:root[data-tema="feira"] .barra-pedido .ver{border-radius:16px}
:root[data-tema="feira"] .barra-pedido{border-top:2px solid var(--line)}
/* ficha: bilhete de feira, número em marcador amarelo */
:root[data-tema="feira"] .ficha{border:3px solid var(--accent);border-radius:28px;box-shadow:0 10px 0 rgba(14,95,104,.18)}
:root[data-tema="feira"] .ficha-num{background:var(--hi);color:var(--hi-fg);border-radius:24px;padding:18px 8px 10px;font-size:clamp(6rem,30vw,10rem);line-height:.95;margin:4px 0}
:root[data-tema="feira"] .ficha-label{color:var(--accent-ink)}
:root[data-tema="feira"] .ficha-itens li b{color:var(--accent-ink)}
:root[data-tema="feira"] .picote{border-top-width:3px}
:root[data-tema="feira"] .picote::before,:root[data-tema="feira"] .picote::after{border-width:3px}
/* entrega: número em marcador amarelo */
:root[data-tema="feira"] .card .num{background:var(--hi);color:var(--hi-fg);border-radius:16px;padding:6px 14px 2px;font-size:2.1rem}
:root[data-tema="feira"] .card.big .num{font-size:3.2rem}
:root[data-tema="feira"] .card li b{color:var(--accent-ink)}
:root[data-tema="feira"] .card.chegou{border-width:3px;background:var(--hi-soft);box-shadow:0 3px 0 var(--hi-borda)}
:root[data-tema="feira"] .card.chegou .num{background:var(--hi-borda);color:#1B2B2D}
:root[data-tema="feira"] .tag{border-radius:999px}
:root[data-tema="feira"] .kpi.destaque{background:var(--accent);box-shadow:0 2px 0 var(--accent-ink)}
:root[data-tema="feira"] .toast{border-radius:22px}

@media (prefers-color-scheme: dark){
  :root[data-tema="feira"]:not([data-theme="light"]){
    --bg:#13201F; --surface:#1B2B2A; --surface-2:#263A38; --fg:#F6F0E0; --muted:#C3C9C2; --line:#3D5452;
    --accent:#5CC4CC; --accent-ink:#8ADBE1; --accent-fg:#082A2D; --accent-soft:#1E4246;
    --ok:#5FCB8A; --ok-fg:#0B2A18; --ok-soft:#1B3A2A; --warn:#F2B552; --warn-soft:#3A2B10;
    --danger:#FF9088; --danger-soft:#43211F;
    --hi:#FFD24D; --hi-fg:#1B2B2D; --hi-soft:#3E3510; --hi-borda:#FFD24D;
    --veu:rgba(0,0,0,.65); --shadow:0 -10px 30px rgba(0,0,0,.5);
    --campo-borda:#7C9593; --ficha-borda:#5CC4CC; --picote:#5CC4CC;
  }
  :root[data-tema="feira"]:not([data-theme="light"]) .card,:root[data-tema="feira"]:not([data-theme="light"]) .kpi,:root[data-tema="feira"]:not([data-theme="light"]) .item,:root[data-tema="feira"]:not([data-theme="light"]) .sabor{box-shadow:none}
  :root[data-tema="feira"]:not([data-theme="light"]) .sabor .qtd{box-shadow:0 0 0 2px var(--surface)}
  :root[data-tema="feira"]:not([data-theme="light"]) .card.chegou .num{color:#1B2B2D}
  :root[data-tema="feira"]:not([data-theme="light"]) .kpi.destaque{box-shadow:none}
  :root[data-tema="feira"]:not([data-theme="light"]) .modo{box-shadow:none}
  :root[data-tema="feira"]:not([data-theme="light"]) .total b{background:none;text-decoration:underline 6px var(--hi);text-underline-offset:5px;padding:0;margin:0}
}


/* ================= C · PAINEL =================
   Jeito nativo do iPad/iPhone: fundo cinza muito claro, cartões brancos, controles segmentados, azul de sistema,
   tipografia SF. Denso e calmo: para quem passa horas olhando a mesma tela. */
:root[data-tema="painel"]{
  --bg:#F2F2F7; --surface:#FFFFFF; --surface-2:#E9E9EF; --fg:#000000; --muted:#5C5C61; --line:#D1D1D6;
  --accent:#0A5FD0; --accent-ink:#0A55BA; --accent-fg:#FFFFFF; --accent-soft:#E3EEFC;
  --ok:#1B7330; --ok-fg:#FFFFFF; --ok-soft:#DDF1E2; --warn:#7A4A00; --warn-soft:#FFEFCC;
  --danger:#C4151C; --danger-soft:#FDE6E6;
  --seg:#E3E3E8;
  --veu:rgba(0,0,0,.4); --shadow:0 -10px 40px rgba(0,0,0,.18);
  --display:-apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,"Segoe UI",Roboto,sans-serif;
  --text:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,"Segoe UI",Roboto,sans-serif;
  --r:12px; --r-btn:12px; --r-cartao:20px; --r-input:10px; --campo-borda:#8A8A8E; --peso-num:700;
  --ficha-borda:#D1D1D6; --picote:#C7C7CC;
}
:root[data-tema="painel"] .appbar{background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line)}
:root[data-tema="painel"] .brand-txt h1{font-weight:700;letter-spacing:-.01em}
:root[data-tema="painel"] .titulo,:root[data-tema="painel"] .h{letter-spacing:-.02em}
:root[data-tema="painel"] .h{font-weight:700}
:root[data-tema="painel"] .cartao,:root[data-tema="painel"] .card,:root[data-tema="painel"] .kpi,:root[data-tema="painel"] .item,:root[data-tema="painel"] .bloco,:root[data-tema="painel"] .busca-card,:root[data-tema="painel"] .tabela-wrap,:root[data-tema="painel"] .sabor{border:1px solid var(--line);border-radius:14px}
:root[data-tema="painel"] .cartao{border-radius:20px}
:root[data-tema="painel"] .logo{background:var(--accent);border-radius:9px}
/* botões: cheio azul (principal), cinza-tinta (secundário), sem contorno, como no iOS */
:root[data-tema="painel"] .btn{border-width:0;font-weight:600;min-height:50px}
:root[data-tema="painel"] .btn:not(.primary):not(.ok):not(.on):not(.warn):not(.danger){background:var(--seg);color:var(--accent-ink)}
:root[data-tema="painel"] .btn.ghost{background:var(--seg);color:var(--accent-ink);border:0}
:root[data-tema="painel"] .btn.danger{background:var(--danger-soft);border:0;color:var(--danger)}
:root[data-tema="painel"] .btn.on{border:0}
:root[data-tema="painel"] .btn.warn{border:0}
:root[data-tema="painel"] .btn-inicio{background:var(--seg);color:var(--accent-ink)}
:root[data-tema="painel"] .btn.small{min-height:44px}
:root[data-tema="painel"] .modo{font-family:var(--display);font-weight:700;letter-spacing:-.02em;border:0;border-radius:16px;font-size:1.55rem}
:root[data-tema="painel"] .modo.entrega{background:var(--accent-soft);color:var(--accent-ink)}
:root[data-tema="painel"] .modo-admin{color:var(--accent-ink);text-decoration:none;font-weight:600}
:root[data-tema="painel"] input,:root[data-tema="painel"] select{background:var(--surface);border-width:1px}
/* produtos: cartões brancos; o que está no pedido ganha selo azul */
:root[data-tema="painel"] .sabor{box-shadow:none}
:root[data-tema="painel"] .sabor .preco{color:var(--muted);font-weight:600}
:root[data-tema="painel"] .sabor.tem{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft)}
:root[data-tema="painel"] .sabor .nome{font-weight:600}
:root[data-tema="painel"] .sabor .qtd{background:var(--accent);min-width:28px;height:28px;font-size:1rem}
/* controles segmentados: chips de pagamento e desconto */
:root[data-tema="painel"] .chips{gap:0;background:var(--seg);padding:3px;border-radius:12px;flex-wrap:nowrap}
:root[data-tema="painel"] .chips button{border:0;background:transparent;min-height:44px;min-width:0;border-radius:9px;font-weight:600;color:var(--fg)}
:root[data-tema="painel"] .chips button[aria-checked="true"]{background:var(--surface);color:var(--accent-ink);font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.28),0 0 0 .5px rgba(0,0,0,.08)}
:root[data-tema="painel"] .desc-linha .chips button{min-width:56px}
/* abas do administrador: um controle segmentado só */
:root[data-tema="painel"] .abas{margin:10px 12px 2px;padding:3px;gap:0;background:var(--seg);border:0;border-radius:12px}
:root[data-tema="painel"] .abas button{flex:1 0 auto;border:0;background:transparent;border-radius:9px;font-weight:600;color:var(--fg)}
:root[data-tema="painel"] .abas button[aria-selected="true"]{background:var(--surface);color:var(--accent-ink);font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.28),0 0 0 .5px rgba(0,0,0,.08)}
@media (min-width:720px){:root[data-tema="painel"] .abas{margin-inline:24px;align-self:start;justify-self:start}}
:root[data-tema="painel"] .pill,:root[data-tema="painel"] .conn{background:var(--seg)}
:root[data-tema="painel"] .troco{background:var(--seg);border-radius:12px}
:root[data-tema="painel"] .step button{border:0;background:var(--seg);color:var(--accent-ink);font-weight:600}
:root[data-tema="painel"] .icon-btn{border:0;background:var(--seg)}
:root[data-tema="painel"] .total b{font-size:2.3rem;letter-spacing:-.03em}
:root[data-tema="painel"] .pedido{border-radius:14px 14px 0 0}
:root[data-tema="painel"] .alca{background:#C7C7CC;width:36px}
@media (min-width:720px){:root[data-tema="painel"] .pedido{border-radius:0;border-left:1px solid var(--line)}}
:root[data-tema="painel"] .barra-pedido{background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
:root[data-tema="painel"] .barra-pedido .ver{border-radius:12px}
/* ficha: cartão limpo, número grande em preto, sem moldura colorida */
:root[data-tema="painel"] .ficha{border:1px solid var(--line);border-radius:24px;box-shadow:0 10px 40px rgba(0,0,0,.12)}
:root[data-tema="painel"] .ficha-num{color:var(--fg);letter-spacing:-.05em;font-size:clamp(6rem,28vw,9.5rem)}
:root[data-tema="painel"] .ficha-label{color:var(--accent-ink)}
:root[data-tema="painel"] .ficha-itens li b{color:var(--accent-ink)}
:root[data-tema="painel"] .picote::before,:root[data-tema="painel"] .picote::after{border-width:1px;border-color:var(--line)}
:root[data-tema="painel"] .picote{border-top-width:2px}
/* entrega */
:root[data-tema="painel"] .card .num{letter-spacing:-.04em}
:root[data-tema="painel"] .card li b{color:var(--accent-ink)}
:root[data-tema="painel"] .card.chegou{border-width:2px}
:root[data-tema="painel"] .tag{letter-spacing:.04em}
:root[data-tema="painel"] .kpi.destaque{background:var(--accent);border-color:var(--accent)}
:root[data-tema="painel"] .toast{border-radius:16px;background:#1C1C1E;color:#fff}
:root[data-tema="painel"] .toast .btn{background:#fff;color:#000}

@media (prefers-color-scheme: dark){
  :root[data-tema="painel"]:not([data-theme="light"]){
    --bg:#000000; --surface:#1C1C1E; --surface-2:#2C2C2E; --fg:#FFFFFF; --muted:#AEAEB2; --line:#3A3A3C;
    --accent:#4DA3FF; --accent-ink:#6DB3FF; --accent-fg:#001B3A; --accent-soft:#12294A;
    --ok:#4CD06C; --ok-fg:#06210F; --ok-soft:#14331E; --warn:#FFB84D; --warn-soft:#3A2A0C;
    --danger:#FF7A74; --danger-soft:#42201F;
    --seg:#2C2C2E; --veu:rgba(0,0,0,.65); --shadow:0 -10px 40px rgba(0,0,0,.6);
    --campo-borda:#8E8E93; --ficha-borda:#3A3A3C; --picote:#48484A;
  }
  :root[data-tema="painel"]:not([data-theme="light"]) .appbar,:root[data-tema="painel"]:not([data-theme="light"]) .barra-pedido{background:rgba(28,28,30,.92)}
  :root[data-tema="painel"]:not([data-theme="light"]) .chips button[aria-checked="true"],:root[data-tema="painel"]:not([data-theme="light"]) .abas button[aria-selected="true"]{background:#636366;color:#fff}
  :root[data-tema="painel"]:not([data-theme="light"]) .toast{background:#3A3A3C}
  :root[data-tema="painel"]:not([data-theme="light"]) .alca{background:#636366}
  :root[data-tema="painel"]:not([data-theme="light"]) .ficha{box-shadow:none}
}

/* "Esgotado" na Administração é aviso, não confirmação: vermelho em todos os temas (o acento aqui é verde ou azul) */
:root[data-tema] .item .btn.on{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}
:root[data-tema="painel"] .item .btn.on{border:0;background:var(--danger-soft);color:var(--danger)}

/* Painel do pedido no iPad: ocupa a altura toda (no visual atual ele termina na altura do conteúdo; ver relatório) */
@media (min-width:720px){
  :root[data-tema] .caixa-wrap{grid-template-rows:minmax(0,1fr)}
  :root[data-tema] .pedido{height:auto;align-self:stretch;min-height:0}
}