:root{
  --bg:#F2F5F1; --surface:#FFFFFF; --ink:#182420; --muted:#5C6C66; --line:#DCE3DE;
  --accent:#2952CC; --accent-ink:#FFFFFF; --bad:#C1443A; --good:#2E9A57; --warn-bg:#FBF0DA;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#121815; --surface:#1B2420; --ink:#E8EEEA; --muted:#9AAAA3; --line:#2B3833;
    --accent:#7FA0FF; --accent-ink:#0B1020; --bad:#FF8B80; --good:#6FD39A; --warn-bg:#3A311A;
  }
}
*{ box-sizing:border-box; }
[hidden]{ display:none !important; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; line-height:1.4;
}
.wrap{ max-width:520px; margin:0 auto; padding:16px; }
.topo{ display:flex; align-items:center; gap:12px; margin:8px 0 16px; }
.topo h1{ font-size:1.25rem; margin:0; }
.topo p{ margin:2px 0 0; color:var(--muted); font-size:.85rem; }
.logo{ width:64px; height:64px; border-radius:10px; object-fit:cover; background:#fff; }
.card{
  background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:18px;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
}
.card h2{ font-size:1.05rem; margin:0 0 12px; }
.campo{ display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.campo > span, .tipos legend{ font-size:.78rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
input[type=text], input[type=tel], select{
  width:100%; padding:12px; border-radius:10px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); font-size:1rem; font-family:inherit;
}
input:focus, select:focus{ outline:2px solid var(--accent); outline-offset:1px; }
.tipos{ border:0; padding:0; margin:0 0 14px; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.tipos legend{ grid-column:1 / -1; padding:0; margin-bottom:6px; }
.so-leitor{
  position:absolute !important; width:1px; height:1px; margin:-1px !important; padding:0; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.opcao{ position:relative; }
.opcao input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.opcao span{
  display:block; text-align:center; padding:12px 8px; border-radius:10px; border:1px solid var(--line);
  font-weight:700; font-size:.9rem;
}
.opcao input:checked + span{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.opcao input:focus-visible + span{ outline:2px solid var(--accent); outline-offset:2px; }
.btn{
  width:100%; padding:14px; border-radius:10px; border:0; background:var(--accent); color:var(--accent-ink);
  font-size:1rem; font-weight:700; cursor:pointer; margin-top:6px;
}
.btn.secundario{ background:transparent; color:var(--ink); border:1px solid var(--line); }
.btn + .btn{ margin-top:8px; }
.pagamentos .opcao span small{ display:block; font-weight:600; font-size:.72rem; opacity:.85; margin-top:2px; }
.faixa-pagamento{
  display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--warn-bg);
  border-radius:10px; padding:10px 12px; font-weight:700; font-size:.9rem; margin-bottom:12px;
}
.faixa-pagamento button{
  border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:8px;
  padding:6px 10px; font-weight:700; cursor:pointer; flex:0 0 auto;
}
.erro{ color:var(--bad); font-size:.85rem; min-height:1.2em; margin:0 0 6px; }
.isca{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
body{ padding-bottom:84px; }
.ola{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.link{ background:none; border:0; color:var(--accent); font-weight:700; cursor:pointer; padding:4px 0; font-size:.85rem; text-decoration:underline; }
.busca{
  width:100%; padding:12px; border-radius:10px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); font-size:1rem; font-family:inherit; margin-bottom:10px;
}
.produtos{ display:flex; flex-direction:column; gap:8px; margin-bottom:12px; }
.produto{
  display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px;
  border:1px solid var(--line); border-radius:10px;
}
.produto .info{ flex:1; min-width:0; }
.produto .nome{ font-weight:700; font-size:.92rem; word-break:break-word; }
.produto .preco{ font-size:.85rem; color:var(--muted); margin-top:2px; }
.selo-quilo{
  display:inline-block; margin-left:6px; padding:1px 8px; border-radius:999px; font-size:.7rem; font-weight:700;
  background:var(--warn-bg); color:var(--ink);
}
.btn-mini{
  flex:0 0 auto; padding:8px 12px; border-radius:8px; border:1px solid var(--accent); background:var(--accent);
  color:var(--accent-ink); font-weight:700; font-size:.82rem; cursor:pointer;
}
.btn-mini.claro{ background:transparent; color:var(--ink); border-color:var(--line); }
.nota-lista{ color:var(--muted); font-size:.8rem; margin:0 0 14px; }
.linha-carrinho{ border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin-bottom:8px; }
.preco-linha{ font-size:.85rem; color:var(--muted); margin-top:2px; }
.linha-carrinho .topo-linha{ display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.linha-carrinho .nome{ font-weight:700; font-size:.92rem; word-break:break-word; }
.linha-carrinho .rodape{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; flex-wrap:wrap; }
.qtd{ display:flex; align-items:center; gap:6px; }
.qtd button{ width:34px; height:34px; border-radius:8px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-size:1.1rem; font-weight:700; cursor:pointer; }
.qtd input{ width:64px; text-align:center; padding:8px 4px; border-radius:8px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-size:1rem; font-family:inherit; }
.qtd .un{ font-size:.8rem; color:var(--muted); font-weight:600; }
.valor-linha{ font-weight:800; }
.valor-linha small{ font-weight:600; color:var(--muted); }
.erro-linha{ color:var(--bad); font-size:.8rem; margin-top:6px; }
.rm{ background:none; border:0; color:var(--bad); font-weight:700; cursor:pointer; font-size:.85rem; }
.total{ display:flex; justify-content:space-between; font-size:1.05rem; font-weight:800; padding:10px 0; border-top:1px solid var(--line); margin-top:4px; }
.barra-carrinho{
  position:fixed; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:12px 16px; background:var(--accent); color:var(--accent-ink); font-weight:700; box-shadow:0 -2px 10px rgba(0,0,0,.15);
}
.barra-carrinho button{ background:var(--accent-ink); color:var(--accent); border:0; border-radius:8px; padding:8px 14px; font-weight:800; cursor:pointer; }
.resumo{ margin:0 0 12px; display:grid; grid-template-columns:auto 1fr; gap:6px 12px; font-size:.92rem; }
.resumo dt{ color:var(--muted); font-weight:600; }
.resumo dd{ margin:0; font-weight:600; word-break:break-word; }
.aviso{ background:var(--warn-bg); border-radius:10px; padding:10px 12px; font-size:.85rem; margin:0 0 12px; }
.grade-categorias{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:14px; }
.cat{
  display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:14px 12px; text-align:left;
  border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink); cursor:pointer; font-family:inherit;
}
.cat:hover, .cat:focus-visible{ border-color:var(--accent); outline:none; }
.cat-icone{ font-size:1.9rem; line-height:1.1; }
.cat-nome{ font-weight:800; font-size:.92rem; margin-top:4px; }
.cat-qtd{ font-size:.75rem; color:var(--muted); }
.cab-lista{ position:sticky; top:0; z-index:5; background:var(--surface); display:flex; flex-direction:column; gap:8px; padding:8px 0 6px; margin-bottom:6px; }
.cab-lista h2{ margin:0 0 8px; }
.cartao-produto{
  display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:12px;
}
.cartao-produto.no-pedido{ border-color:var(--accent); }
.cartao-produto .foto{
  flex:0 0 52px; width:52px; height:52px; border-radius:10px; background:var(--bg); display:flex;
  align-items:center; justify-content:center; font-size:1.7rem;
}
.cartao-produto .info{ flex:1; min-width:0; }
.cartao-produto .nome{ font-weight:700; font-size:.88rem; word-break:break-word; }
.cartao-produto .preco{ font-size:.83rem; color:var(--muted); margin-top:2px; }
.cartao-produto .acao{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:2px; }
.cartao-produto .qtd button{ width:32px; height:32px; }
.cartao-produto .qtd input{ width:46px; padding:6px 2px; }
.un-card{ font-size:.7rem; color:var(--muted); font-weight:600; }
.btn-voltar{
  width:100%; padding:14px; border-radius:12px; border:0; background:#E8710A; color:#FFFFFF;
  font-size:1.05rem; font-weight:800; cursor:pointer; font-family:inherit; box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.btn-voltar:hover, .btn-voltar:focus-visible{ background:#C75F05; outline:2px solid var(--ink); outline-offset:2px; }
textarea{
  width:100%; padding:12px; border-radius:10px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); font-size:1rem; font-family:inherit; resize:vertical;
}
textarea:focus{ outline:2px solid var(--accent); outline-offset:1px; }
.btn-enviar{ background:var(--good); color:#fff; font-size:1.1rem; padding:16px; }
.btn:disabled{ opacity:.6; cursor:wait; }
.protocolo-rotulo{ margin:0; color:var(--muted); font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.protocolo{ margin:2px 0 14px; font-size:1.8rem; font-weight:800; letter-spacing:.06em; }
.env-itens .env-linha{ display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-top:1px solid var(--line); font-size:.9rem; }
.env-itens .env-linha small{ display:block; color:var(--muted); }
.env-itens .env-linha .v{ font-weight:700; white-space:nowrap; }
@media print{
  body{ background:#fff; color:#000; padding:0; }
  .topo, .btn, .barra-carrinho{ display:none !important; }
  .card{ border:0; box-shadow:none; padding:0; }
  .wrap{ max-width:none; }
}
.btn-topo{ margin:0 0 8px; }
.barra-botoes{ display:flex; gap:8px; }
.barra-botoes .barra-enviar{ background:var(--good); color:#fff; }
.obs-card{ margin-top:6px; }
.campo-obs{
  width:100%; padding:8px 10px; border-radius:8px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); font-size:.88rem; font-family:inherit; margin-top:6px;
}
.obs-card .campo-obs{ margin-top:0; }
.link-obs{ background:none; border:0; color:var(--accent); font-weight:700; cursor:pointer; padding:2px 0; font-size:.82rem; font-family:inherit; }
.obs-multi{ font-size:.78rem; color:var(--muted); }
.btn-denovo{
  display:block; width:100%; margin-top:10px; padding:11px 12px; border-radius:10px; border:2px solid var(--accent);
  background:var(--accent); color:var(--accent-ink); font-size:.95rem; font-weight:800; cursor:pointer; font-family:inherit;
}
.btn-denovo:hover, .btn-denovo:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }

.cartao-produto{ flex-direction:column; align-items:stretch; gap:8px; }
.cartao-produto .topo-card{ display:flex; align-items:center; gap:12px; }
.cartao-produto .acao{ min-height:0; }
.linhas-card{ display:flex; flex-direction:column; gap:8px; }
.linhas-card:empty{ display:none; }
.linha-card{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.linha-card .campo-obs{ flex:1 1 180px; margin-top:0; min-width:0; }
.linha-card .qtd{ flex:0 0 auto; }
.linha-card .un-card{ margin-left:2px; }
.linhas-card .btn-denovo{ margin-top:2px; }

.captcha-overlay{
  position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center; padding:16px;
  background:rgba(0,0,0,.55);
}
.captcha-card{ background:var(--surface); color:var(--ink); border-radius:14px; padding:20px; width:100%; max-width:360px; text-align:center; }
.captcha-card p{ margin:0 0 12px; font-weight:700; }
#captchaBox{ display:flex; justify-content:center; min-height:4px; margin-bottom:6px; }

.agradecimento{ margin:0 0 14px; font-size:1rem; line-height:1.45; }
.obrigado-final{ text-align:center; margin:16px 0 14px; font-size:1.05rem; color:var(--ink); }
.obrigado-final strong{ color:var(--accent); }
