/* ============================================================
   Sabor Caipira — identidade visual aplicada ao Sistema de Pedidos
   Paleta oficial (Identidade Visual Sabor Caipira.pdf):
     marrom escuro #4B1D18 · caramelo #B0783C · bege #E7D0A4 · off-white #FFFDF8 · terracota #9E3B21 (só alerta/destaque)
   Tipografia: Cormorant Garamond (marca, títulos) + Barlow (textos, números)
   Tom: rústico-elegante · sem emoji · filetes finos em caramelo · textura discreta
   ============================================================ */
@import url("fontes.css");

:root{
  --marrom:#4B1D18; --marrom-2:#5E2A22; --caramelo:#B0783C; --caramelo-claro:#C9A97A; --bege:#E7D0A4; --bege-claro:#F4EAD5; --bege-2:#EFE4CB;
  --offwhite:#FFFDF8; --fundo:#EFE8D8; --terracota:#9E3B21; --terracota-fundo:#F3DED6;
  --texto:#3A2622; --mudo:#8C7B6B; --linha:#E3D3B4; --linha-forte:#D7C9A8;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Barlow","Helvetica Neue",Arial,sans-serif;
  --sombra:0 1px 2px rgba(75,29,24,.06),0 6px 18px rgba(75,29,24,.06);
}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;font-family:var(--sans);background:var(--fundo);color:var(--texto);line-height:1.45;
  background-image:repeating-linear-gradient(0deg,rgba(75,29,24,.016) 0 1px,transparent 1px 3px)}
a{color:var(--marrom)}
.wrap{max-width:1200px;margin:0 auto;padding:0 18px}
h1,h2,h3{font-family:var(--serif);color:var(--marrom);font-weight:600;letter-spacing:.005em}
h1{font-size:2rem;margin:0 0 12px;line-height:1.15}h2{font-size:1.45rem;margin:0 0 10px}h3{font-size:1.2rem;margin:20px 0 8px}
h3 small{font-family:var(--sans);font-weight:400;font-size:.85rem;color:var(--mudo)}
/* ---- topo */
.topo{background:var(--marrom);color:var(--offwhite);border-bottom:3px solid var(--caramelo)}
.barra{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:66px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.marca{display:flex;align-items:center;gap:12px;color:var(--offwhite);text-decoration:none}
.marca img{height:40px;width:auto;display:block}
.marca .m1{font-family:var(--serif);font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--caramelo-claro);line-height:1}
.marca .m2{font-family:var(--sans);font-weight:600;font-size:1.1rem;line-height:1.15;color:var(--offwhite)}
.menu{display:flex;gap:2px;flex-wrap:wrap;align-items:center}
.menu a,.menu .sair{color:var(--offwhite);text-decoration:none;padding:7px 11px;border-radius:4px;font-size:.95rem;font-weight:500;opacity:.88;border-bottom:2px solid transparent}
.menu a:hover{opacity:1;background:rgba(255,253,248,.07)}
.menu a.ativo{opacity:1;border-bottom-color:var(--caramelo)}
.menu .sair{background:none;border:0;border-bottom:2px solid transparent;cursor:pointer;font:inherit;font-size:.95rem;opacity:.7;color:var(--bege)}
main{padding-top:22px;padding-bottom:40px}
/* ---- cards / blocos */
.card{background:var(--offwhite);border:1px solid var(--linha);border-radius:6px;padding:20px 22px;margin-bottom:18px;box-shadow:var(--sombra)}
.card.vazio{color:var(--mudo)}
.cabecalho-pagina{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.voltar{display:inline-block;color:var(--caramelo);text-decoration:none;font-size:.85rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.linha-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.linha-form label{display:flex;flex-direction:column;gap:4px;margin:0}
/* ---- botões */
.btn{display:inline-block;background:transparent;border:1px solid var(--caramelo);color:var(--marrom);padding:9px 18px;border-radius:4px;font:inherit;font-weight:600;font-size:.95rem;letter-spacing:.02em;cursor:pointer;text-decoration:none;line-height:1.2;transition:background .15s}
.btn:hover{background:var(--bege-claro)}
.btn.primario{background:var(--marrom);border-color:var(--marrom);color:var(--offwhite)}.btn.primario:hover{background:var(--marrom-2)}
.btn.perigo{color:var(--terracota);border-color:var(--terracota)}.btn.perigo:hover{background:var(--terracota-fundo)}
.btn.fantasma{border-color:transparent}
.btn.pequeno{padding:5px 11px;font-size:.85rem;font-weight:500}
.btn.largo{width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.link{background:none;border:0;padding:0;color:var(--marrom);cursor:pointer;font:inherit;text-decoration:underline}
.inline{display:inline}
.acoes{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.acoes-linha{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
/* ---- avisos / textos */
.flash{padding:10px 14px;border-radius:4px;margin-bottom:14px;border:1px solid;font-weight:500}
.flash.ok{background:var(--bege-claro);border-color:var(--bege);color:var(--marrom)}
.flash.erro{background:var(--terracota-fundo);border-color:#E0B7AB;color:var(--terracota)}
.dica{color:var(--mudo);font-size:.92rem;margin:6px 0 12px}
.card.dica{color:var(--texto);background:var(--bege-claro);border-color:var(--bege)}
.mudo{color:var(--mudo)}.pequeno-texto{font-size:.8rem}.alerta-texto{color:var(--terracota)}
.rotulo{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--caramelo)}
.badge{display:inline-block;padding:2px 9px;border-radius:3px;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--bege-claro);color:var(--marrom);vertical-align:middle;border:1px solid var(--bege)}
.badge.ok{background:var(--bege-claro);color:var(--marrom);border-color:var(--bege)}
.badge.alerta{background:var(--terracota-fundo);color:var(--terracota);border-color:#E0B7AB}
.badge.rascunho{background:var(--bege);color:var(--marrom);border-color:var(--caramelo-claro)}
.badge.enviado{background:var(--marrom);color:var(--offwhite);border-color:var(--marrom)}
/* ---- tabelas */
.tabela{width:100%;border-collapse:collapse;font-size:.93rem}
.tabela th,.tabela td{padding:9px 10px;border-bottom:1px solid var(--linha);text-align:left;vertical-align:middle}
.tabela th{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--caramelo);background:var(--offwhite);border-bottom:1px solid var(--caramelo);position:sticky;top:0}
.tabela.compacta th,.tabela.compacta td{padding:5px 8px;font-size:.85rem}
.tabela tr.inativo td{opacity:.5}
.tabela-rolagem{overflow-x:auto;-webkit-overflow-scrolling:touch}
/* ---- formulários */
input,select,textarea{font:inherit;padding:8px 10px;border:1px solid var(--linha-forte);border-radius:4px;background:var(--offwhite);color:var(--texto);width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--caramelo-claro);border-color:var(--caramelo)}
input.curto{width:110px}
textarea{resize:vertical;font-family:var(--sans);font-size:.95rem;line-height:1.4}
label{display:block;font-weight:600;font-size:.9rem;margin-bottom:10px;color:var(--marrom)}
label small{display:block;font-weight:400;color:var(--mudo);margin-bottom:3px}
label.check,label.radio{font-weight:500;display:flex;gap:8px;align-items:flex-start;color:var(--texto)}
label.check input,label.radio input{width:auto;margin-top:3px;accent-color:var(--marrom)}
.formulario .grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:6px 20px}
/* ---- login */
.login-topo{text-align:center;margin:36px 0 10px}
.login-topo img{height:96px;width:auto}
.login{max-width:400px;margin:10px auto 40px;padding:26px 28px}
.login h1{text-align:center;font-size:1.7rem}
.login label{margin-bottom:14px}
.rodape{color:var(--mudo);font-size:.8rem;padding-bottom:30px;border-top:1px solid var(--linha);padding-top:12px;margin-top:10px}
.rodape a{color:var(--caramelo)}
/* ---- página do pedido */
.passo h2{display:flex;align-items:center;gap:10px}
.passo h2 .num{display:inline-flex;width:30px;height:30px;border-radius:50%;background:var(--caramelo);color:var(--offwhite);align-items:center;justify-content:center;font-family:var(--serif);font-size:1.05rem;font-weight:700;flex:none}
.filete{height:1px;background:var(--caramelo);opacity:.55;margin:4px 0 14px}
.cab-campos{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.cab-campos label{margin:0;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--caramelo)}
.cab-campos input,.cab-campos select{width:auto;min-width:160px;background:var(--bege-claro);border-color:var(--bege);color:var(--marrom);font-weight:600;margin-top:4px}
.cab-campos .mult{font-size:.9rem;color:var(--mudo);padding-bottom:9px}
.resumo{font-weight:600}
.geral{font-family:var(--serif);font-weight:700;font-size:1.25rem;color:var(--marrom);padding:10px 16px;background:var(--bege-claro);border-left:3px solid var(--caramelo);border-radius:0 4px 4px 0;margin-bottom:10px}
.tabela.itens td.entrada input{width:86px;text-align:right;background:var(--bege-claro);border-color:var(--bege);color:var(--marrom);font-weight:600;padding:6px 8px}
.tabela.itens td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tabela.itens th.destaque{color:var(--marrom)}
.tabela.itens td.pedido{font-weight:700;font-size:1.25rem;text-align:right;color:var(--marrom);font-variant-numeric:tabular-nums;background:var(--bege-claro)}
.tabela.itens tr.grupo td{background:var(--bege);color:var(--marrom);font-weight:700;font-size:.74rem;text-transform:uppercase;letter-spacing:.16em;padding:6px 10px}
.tabela.itens tr.forn td{background:var(--marrom);color:var(--offwhite);font-family:var(--serif);font-weight:600;font-size:1.15rem;padding:8px 12px}
.tabela.itens tr.pendente td.sit,.tabela.itens tr.nao_informado td.sit,.tabela.itens tr.sem_alvo td.sit{color:var(--terracota);font-weight:600}
.tabela.itens tr.pendente td.pedido,.tabela.itens tr.nao_informado td.pedido,.tabela.itens tr.sem_alvo td.pedido{background:var(--terracota-fundo);color:var(--terracota)}
.tabela.itens td.sit{font-size:.86rem;max-width:330px}
.marca-alerta{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--terracota);margin-right:6px;vertical-align:middle}
.msg{border:1px solid var(--linha);border-radius:6px;padding:16px;margin-bottom:14px;background:var(--offwhite)}
.msg .msg-cab{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--linha)}
.msg .msg-cab b{font-family:var(--serif);font-size:1.25rem;color:var(--marrom)}
.msg textarea{background:var(--bege-claro);border-color:var(--bege);min-height:280px;white-space:pre;color:var(--marrom)}
.avisos{margin-top:12px;background:var(--terracota-fundo);border:1px solid #E0B7AB;border-left:3px solid var(--terracota);border-radius:0 4px 4px 0;padding:10px 14px;font-size:.9rem;color:var(--marrom)}
.avisos b{display:block;margin-bottom:4px;color:var(--terracota);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--marrom);color:var(--offwhite);padding:10px 18px;border-radius:4px;box-shadow:var(--sombra);z-index:50;font-size:.95rem;border-left:3px solid var(--caramelo)}
.toast.erro{background:var(--terracota);border-left-color:var(--bege)}
.travado input,.travado select,.travado textarea{background:#F5F1E8!important;border-color:var(--linha)!important;color:var(--mudo)!important}
ol.passos li{margin-bottom:8px}
@media (max-width:700px){html{font-size:15px}.card{padding:14px}.tabela.itens td.entrada input{width:64px}.tabela.itens td.sit{max-width:200px}.marca img{height:34px}.marca .m2{font-size:1rem}h1{font-size:1.6rem}}

/* ---- unidades (Restaurante / Delivery) */
.unidades{display:flex;gap:4px;background:rgba(255,253,248,.08);padding:3px;border-radius:5px;border:1px solid rgba(231,208,164,.35)}
.aba-unidade{background:transparent;border:0;color:var(--bege);font:inherit;font-weight:600;font-size:.88rem;letter-spacing:.04em;padding:6px 14px;border-radius:4px;cursor:pointer}
.aba-unidade.ativa{background:var(--caramelo);color:var(--offwhite)}
.aba-unidade:hover:not(.ativa){background:rgba(255,253,248,.1)}
.forn-semana{display:flex;flex-wrap:wrap;gap:8px 18px;margin:6px 0 12px;padding:10px 14px;background:var(--bege-claro);border-radius:4px;border:1px solid var(--bege)}
.forn-semana label{margin:0;font-weight:500;display:flex;align-items:center;gap:6px;color:var(--texto)}
.forn-semana label input{width:auto;accent-color:var(--marrom)}
.tabela.itens tr.fora td{opacity:.4}
.tabela.itens tr.zerado td.pedido{background:var(--terracota-fundo);color:var(--terracota)}
.tabela.itens tr.zerado td.sit{color:var(--terracota);font-weight:600}
@media (max-width:900px){.unidades{order:3;width:100%;justify-content:center}}

/* ---- rotina: onde colher / onde entregar */
.rotina-linha{background:var(--offwhite);border:1px solid var(--linha);border-left:3px solid var(--caramelo);border-radius:0 4px 4px 0;padding:9px 14px;margin:0 0 14px;font-size:.92rem;color:var(--texto)}
.rotina-linha b{color:var(--marrom)}
.rotina-linha .sep{color:var(--linha-forte);margin:0 10px}
.rotina-linha.falta{border-left-color:var(--terracota);background:var(--terracota-fundo);color:var(--terracota)}
.rotina-linha.falta a{color:var(--terracota);font-weight:600}
