/* Visual da comanda, igual ao arquivo original. Usado pelo celular (index.html) e pela impressora (impressora.html). */
:root{--roxo:#4f3594;--roxo-esc:#3b2778;--laranja:#f0913a;--laranja-esc:#d97a22;--verde:#4d8a31;--lilas:#e9e1f5;--fundo:#f3effa;--card:#fff;--tinta:#241a2e;--suave:#6d6079;--linha:#e0d7ec}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--fundo);color:var(--tinta);font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
header{background:var(--roxo-esc);color:#fff;padding:14px max(20px,env(safe-area-inset-right)) 14px max(20px,env(safe-area-inset-left));padding-top:max(14px,env(safe-area-inset-top));display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
header h1{margin:0;font-size:20px;letter-spacing:.02em}
header .prox{background:var(--laranja);color:#2b1500;font-weight:800;padding:6px 14px;border-radius:999px;font-variant-numeric:tabular-nums}
.wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px;max-width:1100px;margin:0 auto;padding:16px max(16px,env(safe-area-inset-right)) 32px max(16px,env(safe-area-inset-left))}
@media(max-width:820px){.wrap{grid-template-columns:minmax(0,1fr)}}
.col{display:flex;flex-direction:column;gap:16px;min-width:0}
.card{background:var(--card);border:1px solid var(--linha);border-radius:12px;padding:16px}
.card h2{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.09em;color:var(--roxo)}
label{display:block;font-size:13px;font-weight:600;margin:10px 0 4px;color:var(--suave)}
input,select,textarea{width:100%;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--linha);border-radius:8px;background:#fff;color:var(--tinta)}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:3px solid #f0913a66;border-color:var(--laranja)}
textarea{resize:vertical;min-height:64px}
.dois{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.dois{grid-template-columns:1fr}}
.btn{font:inherit;font-weight:700;border:0;border-radius:10px;padding:12px 18px;cursor:pointer;min-height:44px}
.btn:disabled{opacity:.6;cursor:wait}
.btn.pri{background:var(--laranja);color:#2b1500;font-size:17px;width:100%}
.btn.pri:hover{background:var(--laranja-esc)}
.btn.sec{background:#fff;border:1px solid var(--linha);color:var(--tinta);padding:9px 14px}
.btn.add{background:var(--verde);color:#fff;width:100%;font-size:16px;margin-top:12px}
.acoes{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.acoes .pri{flex:1 1 220px}
.check{display:flex;gap:8px;align-items:center;margin-top:12px;font-size:14px;color:var(--tinta);font-weight:500}
.check input{width:auto}
#aviso{margin-top:10px;padding:8px 12px;border-radius:8px;background:#fdeaea;color:#8c1d18;font-weight:600}
#aviso.ok{background:#e6f2df;color:#2d5a17}
a.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}

/* Comanda salva só no celular: mandar no WhatsApp ou copiar */
.share{margin-top:14px;padding:12px;border:2px solid var(--verde);border-radius:10px;background:#f4faf0}
.share b{display:block;margin-bottom:8px}
.share textarea{font-family:"Courier New",ui-monospace,monospace;font-size:14px;min-height:170px}
.btn.wa{background:var(--verde);color:#fff;flex:1 1 200px}

/* Conexão com o computador */
.st{font-size:13px;font-weight:700;padding:5px 12px;border-radius:999px;background:#ffffff1f;white-space:nowrap}
.st::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;background:#bbb;vertical-align:1px}
.st.on::before{background:#7ee05a}
.st.meio::before{background:var(--laranja)}
.st.off::before{background:#ff6b6b}

/* Montar item */
.rot{margin:14px 0 6px;font-size:13px;font-weight:700;color:var(--suave)}
.abas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.compl{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;padding:8px 12px;border-radius:10px;background:#fff4e5;border:1.5px solid #f3c58a;color:#7a4300;font-weight:800}
.compl.corr{background:#e8f0fb;border-color:#9dbbe6;color:#1f4f8a}
.compl.corr button{color:#1f4f8a}
.compl button{border:0;background:none;color:#7a4300;font-size:18px;cursor:pointer;min-width:36px;min-height:36px}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg-b{border:1.5px solid var(--roxo);background:#fff;color:var(--roxo);border-radius:10px;padding:8px 12px;font:inherit;font-size:14px;font-weight:700;cursor:pointer;min-height:44px;text-align:center;line-height:1.2}
.seg-b small{display:block;font-weight:600;font-size:12px;opacity:.85}
.seg-b.on{background:var(--roxo);color:#fff}
.seg-b.ex{border-color:var(--verde);color:var(--verde)}
.seg-b.ex.on{background:var(--verde);color:#fff}
.seg-b.inc{border-color:var(--verde);color:var(--verde)}
.seg-b.inc.on{background:var(--verde);color:#fff}
.seg-b.inc:not(.on){text-decoration:line-through;border-color:#c9bfd3;color:#8a7d97;background:#f4f0f8}
.seg-b.sem{border-color:#c9bfd3;color:var(--tinta)}
.seg-b.sem.on{background:#c62828;border-color:#c62828;color:#fff}
.abas .seg-b{width:100%}
.nota{background:#fff4e5;border:1px solid #f3c58a;color:#7a4300;border-radius:8px;padding:8px 10px;font-weight:700;margin-top:8px}
.dica{color:var(--suave);font-size:14px;margin:0 0 8px}
.qtd{display:flex;align-items:center;gap:10px;margin-top:14px}
.qtd button{width:44px;height:44px;border-radius:10px;border:1px solid var(--linha);background:#fff;font-size:22px;cursor:pointer}
.qtd b{min-width:28px;text-align:center;font-size:18px}

/* Pedido */
.ci{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:10px 0;border-top:1px solid var(--linha)}
.ci:first-child{border-top:0}
.ci-t small{display:block;color:var(--suave)}
.ci-p{font-weight:700;font-variant-numeric:tabular-nums}
.ci-c{grid-column:1/-1;display:flex;gap:8px}
.ci-c button{border:1px solid var(--linha);background:#fff;border-radius:8px;min-height:40px;min-width:44px;padding:0 12px;font:inherit;font-weight:700;cursor:pointer}
.vazio{color:var(--suave);padding:6px 0}
.totalbar{display:flex;justify-content:space-between;align-items:baseline;margin-top:12px;padding:10px 12px;background:var(--lilas);border-radius:8px;font-weight:700}
.totalbar b{font-size:22px;font-variant-numeric:tabular-nums}
details summary{cursor:pointer;font-weight:700;color:var(--roxo);min-height:32px}
details p,details li{color:var(--suave);font-size:14px}
code{background:#f0eaf6;padding:2px 5px;border-radius:4px;font-size:13px;word-break:break-all}
.previa{background:#e9e2f0;padding:14px;border-radius:8px;overflow-x:auto}
.previa .tk{width:302px;max-width:100%;margin:0 auto;padding:14px;box-shadow:0 2px 10px #0003}
ul.hist{list-style:none;margin:0;padding:0}
ul.hist li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--linha)}
ul.hist li:first-child{border-top:0}
ul.hist small{display:block;color:var(--suave)}
ul.hist .vazio{justify-content:center}
ul.hist button{border:1px solid var(--roxo);background:#fff;color:var(--roxo);font:inherit;font-weight:600;border-radius:8px;padding:8px 10px;cursor:pointer;white-space:nowrap;min-height:40px}
.tag{background:#efe6f7;color:var(--roxo);font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;margin-left:4px}
.tag.fila{background:#fff4e5;color:#7a4300}
.tag.ok{background:#e6f2df;color:#2d5a17}
.tag.cel{background:#e8f0fb;color:#1f4f8a}
.tag.cancel{background:#fdeaea;color:#8c1d18}

/* Pedidos de hoje: botões numa linha embaixo de cada pedido */
ul.hist li{flex-wrap:wrap}
ul.hist .hb{display:flex;gap:6px;flex-wrap:wrap;width:100%}
ul.hist .hb button{padding:6px 10px;min-height:36px;font-size:14px}
ul.hist .hb button.feito{border-color:var(--verde);color:var(--verde)}
ul.hist .hb button.perigo{border-color:#c62828;color:#c62828}
ul.hist li.fora{opacity:.55}
ul.hist li.cancelado b{text-decoration:line-through}

/* Favoritos, preços, PIN */
.linha{display:flex;gap:8px;align-items:center}
.linha .btn{flex:none;width:auto}
.seg-b.fav{text-align:left;max-width:100%}
.seg-b.fav.del{border-color:#c62828;color:#c62828}
.lnk{background:none;border:0;color:var(--roxo);font:inherit;font-size:13px;font-weight:700;text-decoration:underline;cursor:pointer;padding:4px;margin-left:6px}
.btn.sec.estrela{width:100%;margin-top:8px}
.pr{display:grid;grid-template-columns:minmax(0,1fr) 96px 44px;gap:8px;align-items:center;padding:4px 0}
.pr span{min-width:0;overflow-wrap:anywhere}
.pr input{padding:8px}
.pr button{height:40px;border:1px solid var(--linha);background:#fff;border-radius:8px;font-size:18px;cursor:pointer}
#cfgBox details{margin-top:12px;padding-top:8px;border-top:1px solid var(--linha)}

/* Pedido esperando há muito tempo */
ul.hist li.atrasado{background:#fdeaea;border-left:4px solid #c62828;padding-left:8px;border-radius:6px}
.tag.tempo{background:#f0eaf6;color:var(--suave)}
.tag.atraso{background:#c62828;color:#fff}
ul.hist .hb a{display:inline-flex;align-items:center;padding:6px 10px;min-height:36px;font-size:14px;font-weight:700;border-radius:8px;background:var(--verde);color:#fff;text-decoration:none}

/* "O de sempre" do cliente */
.sempre{margin-top:12px;padding:10px 12px;border:1.5px dashed var(--roxo);border-radius:10px;background:var(--lilas)}
.sempre div{margin:4px 0 8px;font-size:14px}
.sempre .btn{width:100%}

/* ---------- Tela do celular com cara de app: abas, barra de enviar, botões grandes ---------- */
.cabeca{position:sticky;top:0;z-index:20;box-shadow:0 4px 14px #3b277833}
header.topo{flex-wrap:nowrap;gap:10px;padding-top:max(10px,env(safe-area-inset-top));padding-bottom:8px}
.topo-l{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex:1;min-width:0}
header.topo h1{font-size:17px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
header.topo .st{font-size:12px;padding:3px 10px}
header.topo .prox{flex:none;padding:6px 12px}
.abas-app{display:flex;gap:6px;background:var(--roxo-esc);padding:0 max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left))}
.abas-app button{flex:1;border:0;border-radius:999px;padding:8px 6px;min-height:42px;font:inherit;font-weight:800;font-size:15px;background:#ffffff1f;color:#fff;cursor:pointer;transition:background .15s,color .15s}
.abas-app button.on{background:#fff;color:var(--roxo-esc)}
.badge{display:inline-block;min-width:22px;padding:1px 7px;margin-left:6px;border-radius:999px;background:var(--laranja);color:#2b1500;font-size:12px;line-height:18px;vertical-align:1px}
.badge.alerta{background:#ff4d4d;color:#fff;animation:pisca 1.2s ease-in-out infinite}
@keyframes pisca{50%{opacity:.45}}

.wrap.app{display:block}
.painel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:820px){.painel{grid-template-columns:minmax(0,1fr)}}
.card h2 .conta{color:var(--suave);letter-spacing:0;text-transform:none;font-size:13px}

/* Tipo e pagamento: botões grandes no lugar da lista */
.segs{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:6px;margin:2px 0 4px}
.sg{border:1.5px solid var(--linha);background:#fff;color:var(--tinta);border-radius:12px;padding:10px 6px;min-height:48px;font:inherit;font-weight:800;font-size:15px;cursor:pointer;transition:transform .1s,background .15s,border-color .15s}
.sg.on{background:var(--roxo);border-color:var(--roxo);color:#fff}

/* Toque com resposta */
.sg:active,.seg-b:active,.btn:active,.qtd button:active,.ci-c button:active,.abas-app button:active{transform:scale(.96)}
.seg-b{transition:transform .1s,background .15s,color .15s}

/* Aviso flutuante no topo */
#aviso{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 12px);transform:translateX(-50%);z-index:60;margin:0;width:max-content;max-width:min(92vw,520px);padding:12px 16px;border-radius:12px;box-shadow:0 10px 30px #0004;font-size:15px;animation:entra .22s ease-out}
@keyframes entra{from{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%,0)}}

/* Barra fixa de enviar */
body.com-barra{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
.barra{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;gap:10px;align-items:center;background:#fff;border-top:1px solid var(--linha);box-shadow:0 -8px 24px #3b277826;
  padding:10px max(12px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left))}
@media(min-width:900px){.barra{left:50%;right:auto;transform:translateX(-50%);width:min(1100px,100%);border-radius:16px 16px 0 0}}
.barra-info{border:0;background:none;display:flex;flex-direction:column;align-items:flex-start;padding:2px 4px;min-width:100px;cursor:pointer;font:inherit;color:var(--tinta)}
.barra-info small{color:var(--suave);font-size:13px;font-weight:700}
.barra-info b{font-size:22px;font-variant-numeric:tabular-nums}
.btn.pri.barra-env{flex:1;width:auto;min-height:56px;font-size:18px;border-radius:14px;box-shadow:0 4px 14px #f0913a66}
.barra.vazia .barra-env{background:#efe8f6;color:var(--suave);box-shadow:none}
.barra.lancar .barra-env{background:var(--roxo);color:#fff;box-shadow:0 4px 14px #4f359466}
.check.lancar{align-items:flex-start;padding:10px 12px;border-radius:10px;border:1.5px dashed var(--roxo);background:var(--lilas)}
.check.lancar input{margin-top:3px}
.barra.pulso{animation:pulso .45s ease}
@keyframes pulso{30%{transform:translateY(-4px)}60%{transform:translateY(1px)}}
@media(min-width:900px){.barra.pulso{animation:none}}

/* Link dos clientes (aba Hoje) e faixa de pedido esperando */
.faixa-cli{display:block;width:100%;border:0;background:var(--laranja);color:#2b1500;font:inherit;font-weight:800;font-size:15px;padding:9px 12px;cursor:pointer;animation:pisca 1.6s ease-in-out infinite}
@keyframes pisca{50%{background:#ffb56b}}
.link-url{margin-top:8px;font-weight:800;color:var(--roxo);word-break:break-all}
.cli-ped{border:2px solid var(--laranja);border-radius:12px;padding:12px;margin-top:12px;background:#fffaf4}
.cli-ped-t small{display:block;color:var(--suave);margin-top:2px}
.cli-ped ul{margin:8px 0 0;padding:0;list-style:none}
.cli-ped li{padding:6px 0;border-top:1px dashed var(--linha);font-weight:700}
.cli-ped li small{display:block;font-weight:500;color:var(--suave)}
.cli-ped li.ruim{color:#c62828}
.cli-obs{margin-top:8px;font-weight:700;color:#7a4300}
.cli-ped-tot{margin-top:8px;font-size:17px;font-weight:800;text-align:right}
.cli-ped .acoes .btn{flex:1 1 auto}

/* Botão Adicionar flutuante (em cima da barra de enviar) */
.add-flut{position:fixed;z-index:29;left:50%;transform:translateX(-50%);bottom:calc(86px + env(safe-area-inset-bottom,0px));width:min(520px,calc(100% - 24px));
  min-height:54px;border:0;border-radius:14px;background:var(--verde);color:#fff;font:inherit;padding:8px 14px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;box-shadow:0 6px 20px #2c4f1c66;animation:sobe .18s ease-out}
.add-flut[hidden]{display:none}
.add-flut b{font-size:17px}
.add-flut small{font-size:12.5px;font-weight:600;opacity:.92;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@keyframes sobe{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}

/* Cartão da senha (fica em cima da barra de enviar) */
.folha{position:fixed;z-index:40;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom,0px));width:min(420px,calc(100% - 24px));
  display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 16px 16px;background:var(--roxo-esc);color:#fff;border-radius:18px;box-shadow:0 14px 40px #2b0a3d66;animation:sobe .25s ease-out}
body.com-barra .folha{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
.folha small{letter-spacing:.12em;font-weight:800;font-size:12px;opacity:.85}
.folha b{font-size:64px;line-height:1;font-weight:900;color:var(--laranja);font-variant-numeric:tabular-nums}
.folha span{font-size:14px;opacity:.9;min-height:18px}
.folha .acoes{width:100%;margin-top:10px}
.folha .acoes .btn{flex:1 1 160px}
.folha .btn.sec{background:#ffffff1f;border-color:#ffffff55;color:#fff}
.folha-x{position:absolute;top:8px;right:8px;width:40px;height:40px;border:0;border-radius:50%;background:#ffffff1f;color:#fff;font-size:18px;cursor:pointer}
@keyframes sobe{from{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%,0)}}

/* Pagamento dividido, copos */
.tres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.dividido{margin-top:6px;padding:10px 12px;border:1.5px solid var(--linha);border-radius:10px;background:var(--fundo)}
.dividido .dica{margin:0}
/* Copos: uma linha por tamanho (− número +), igual ao Caixa */
.cp{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--linha);flex-wrap:wrap}
.cp:last-child{border-bottom:0}
.cp-nome{flex:1;min-width:130px}
.cp-nome b{font-size:17px}
.cp-nome small{display:block;color:var(--suave);font-size:13px}
.cp-nome small input{width:52px;padding:3px 6px;font-size:13px;display:inline-block}
.cp-ctl{display:flex;align-items:center;gap:6px}
.cp-ctl button{width:44px;height:44px;border-radius:12px;border:1.5px solid var(--linha);background:#fff;font-size:22px;font-weight:800;cursor:pointer;color:var(--tinta)}
.cp-ctl input{width:66px;text-align:center;font-weight:800;font-size:20px;padding:8px 4px}
.cp.baixo .cp-ctl input{color:#a85400;border-color:var(--laranja)}
.cp.acabou .cp-ctl input{color:#c62828;border-color:#c62828}
.tag.repor{background:#c62828;color:#fff}
.cp-nome small.prev{color:#7a4300;font-weight:700}
.add-item{margin-top:8px}
.add-item #novoItem{flex:1;min-width:0}
.add-item #novoItemQtd{width:72px;text-align:center}
.compras{margin-top:12px;padding:12px;border:2px solid var(--laranja);border-radius:12px;background:#fff4e5}
.compras .rr{border-color:#f3c58a}
.compras .btn{width:100%;margin-top:8px}
.conf{margin:8px 0 12px;padding:12px;border:1.5px solid var(--linha);border-radius:12px;background:var(--fundo)}
.conf-res{margin-top:8px;padding:10px 12px;border-radius:10px;font-weight:800;font-size:17px;background:#fff;border:2px solid var(--linha)}
.conf-res.ok{border-color:var(--verde);color:#2d5a17;background:#e6f2df}
.conf-res.ruim{border-color:#c62828;color:#8c1d18;background:#fdeaea}
.rel-tot .cmp{font-weight:700}
.rel-tot .cmp.sobe{color:#2d5a17}
.rel-tot .cmp.desce{color:#c62828}
.btn.pri.repor-btn{margin-top:12px}
.repor{margin-top:10px;padding:12px;border:2px solid var(--verde);border-radius:12px;background:#f4faf0}
.rp{display:grid;grid-template-columns:62px minmax(0,1fr) auto auto;gap:6px;align-items:center;padding:5px 0}
.rp b{font-size:15px}
.rp input{text-align:center;font-weight:800}
.rp button{min-height:40px;padding:0 10px;border-radius:10px;border:1.5px solid var(--verde);background:#fff;color:var(--verde);font:inherit;font-weight:800;cursor:pointer}

/* Cartão fidelidade */
.fid{margin-top:10px;padding:10px 12px;border-radius:10px;background:#fff4e5;border:1.5px solid #f3c58a;font-weight:700;color:#7a4300}
.fid.ganhou{background:#e6f2df;border-color:#9fcf86;color:#2d5a17}
.fid .btn{width:100%;margin-top:8px}
.fid .pontos{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.fid .pontos i{width:14px;height:14px;border-radius:50%;border:2px solid #d9a35c;display:inline-block}
.fid .pontos i.on{background:var(--laranja);border-color:var(--laranja)}

/* Senha do gerente */
.trava{border:2px dashed var(--roxo);background:var(--lilas)}
.gerente-on{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:#e6f2df;border-color:#b9d8a8;font-weight:700;color:#2d5a17}
.gerente-on .btn{width:auto}

/* Resumo no topo de "Pedidos de hoje" */
.resumo-hoje{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.resumo-hoje span{background:var(--lilas);color:var(--roxo-esc);border-radius:999px;padding:4px 10px;font-size:13px;font-weight:700}
.resumo-hoje span.ruim{background:#c62828;color:#fff}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Relatório */
.rel-tot{display:flex;flex-direction:column;gap:2px;padding:10px 12px;background:var(--lilas);border-radius:8px;margin:10px 0}
.rel-tot b{font-size:24px;font-variant-numeric:tabular-nums}
.rel-tot span{color:var(--suave);font-size:14px}
.br{display:grid;grid-template-columns:76px minmax(0,1fr) 96px;gap:8px;align-items:center;font-size:14px;padding:3px 0}
.br i{display:block;height:12px;background:var(--roxo);border-radius:6px;min-width:2px}
.br b,.rr b{text-align:right;font-variant-numeric:tabular-nums}
.rr{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid var(--linha);font-size:14px}
.rr.top{font-weight:800;color:var(--roxo)}

/* Comanda (prévia na tela e papel) */
/* Na térmica, traço fino sai claro: letra sem serifa toda em negrito e linhas de 2px */
.tk{font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;font-weight:700;color:#000;background:#fff;font-size:var(--fs,14px);line-height:1.25}
.tk-loja{text-align:center;font-weight:800;font-size:1.25em}
.tk-sub{text-align:center;font-size:.85em;letter-spacing:.08em;margin-bottom:6px}
.tk-row{display:flex;justify-content:space-between;gap:6px;align-items:baseline;border-top:2px dashed #000;padding-top:4px}
.tk-row2{display:flex;justify-content:space-between;gap:6px}
.tk-tot{font-size:1.2em;font-weight:800}
.tk-num{font-size:1.3em}
.tk-tipo{text-align:center;font-weight:800;font-size:1.4em;border:2px solid #000;margin:6px 0;padding:2px}
.tk hr{border:0;border-top:2px dashed #000;margin:6px 0}
.tk-item{display:flex;justify-content:space-between;gap:8px;font-size:1.15em;font-weight:800;margin-top:7px}
.tk-det{padding-left:1.3em}
.tk-aviso{margin:3px 0 0 1.3em;padding:1px 4px;border:2px solid #000;font-weight:800;text-align:center}
.tk-obs{font-size:1.05em}
.tk-vazio{color:#777;text-align:center;padding:8px 0}
.tk-senha{text-align:center;font-size:2.4em;font-weight:900;line-height:1;margin:2px 0 4px}
.tk-corte{text-align:center;font-size:.8em;margin:8px 0 10px;letter-spacing:.04em}

#printArea{display:none}
body.p80{--tw:70mm;--pfs:15px}
body.p58{--tw:48mm;--pfs:12px}
body.pA4{--tw:95mm;--pfs:16px}
@media print{
  body{background:#fff}
  body>*:not(#printArea){display:none!important}
  #printArea{display:block}
  /* O driver da Epson corta a 1ª letra de texto encostado na borda: recuo de 3 mm por dentro */
  #printArea .tk{width:var(--tw);--fs:var(--pfs);padding:0 1mm 0 3mm}
  body.p80 .page,body.p58 .page{break-after:page}
  body.p80 .page:last-child,body.p58 .page:last-child{break-after:auto}
  body.pA4 .page{margin-bottom:12mm;padding-bottom:6mm;border-bottom:1px dashed #000}
}
