/* RT Massas · Escritório Digital (protótipo) · cores da marca por cima da base */
:root{
  --marinho:#2A1512;
  --marinho-2:#4A221E;
  --azul:#8C2D33;
  --azul-forte:#6F2227;
  --azul-claro:#F6ECE8;
  --azul-txt:#8C2D33;
  --fundo:#FAF6EF;
  --papel:#FFFFFF;
  --papel-2:#FBF8F3;
  --ink:#1F1512;
  --grafite:#4A3B36;
  --mudo:#6F625C;
  --fio:rgba(31,21,18,.12);
  --fio-forte:rgba(31,21,18,.28);
  --fio-suave:rgba(31,21,18,.07);
  --no-escuro:#D8C8BE;
  --verde-claro:#F2ECE5;--ambar-claro:#F2ECE5;
  --wa-fundo:#F3EDE4;
  --wa-meu:#F7E6DF;
  --dourado:#C8913A;
  --sombra:0 12px 32px -16px rgba(42,21,18,.3);
}
body{background:var(--fundo)}
.alterna{background:#EFE7DD}

/* login claro: a logo é colorida e não pode ir em fundo escuro */
.pagina-login{background:var(--marinho)}
.cartao-login{background:#FAF6EF;border-color:transparent;color:var(--grafite)}
.cartao-login .selo{border-color:var(--fio);color:var(--mudo)}
.cartao-login .logo{width:240px;margin:18px auto 10px}
.cartao-login h1{color:var(--ink)}
.cartao-login .sub{color:var(--mudo)}
.cartao-login label,.cartao-login legend{color:var(--grafite)}
.cartao-login input[type=text],.cartao-login input[type=password]{background:#fff;color:var(--ink);border-color:var(--fio-forte)}
.cartao-login .perfis label{background:#fff;border-color:var(--fio)}
.cartao-login .perfis b{color:var(--ink)}
.cartao-login .perfis small{color:var(--mudo)}
.cartao-login .btn-azul{background:var(--azul);color:#fff}
.cartao-login .btn-azul:hover{background:var(--azul-forte)}
.login-pe{color:var(--mudo)}

/* lateral: logo original numa placa creme */
.lateral-placa{display:block;background:#FAF6EF;border-radius:10px;padding:10px 14px;margin:0 4px 4px}
.lateral-placa .lateral-logo{display:block;width:100%;max-width:170px;margin:0 auto}
.lateral-sub{margin-top:10px}
.lateral-pe{color:#A89286}
.wa-topo img{background:#FAF6EF}
.topo-logo{height:34px;width:auto;background:#FAF6EF;border-radius:6px;padding:3px 8px}

/* painel */
.parada-lista{display:flex;flex-direction:column;margin-top:8px}
.parada{display:flex;align-items:center;gap:12px;padding:10px 2px;border-top:1px solid var(--fio-suave)}
.parada:first-child{border-top:0}
.parada-n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:var(--fs-1);font-weight:600;background:var(--azul-claro);color:var(--azul-txt);flex:none}
.parada.feita .parada-n{background:var(--marinho);color:#fff}
.parada-txt{display:flex;flex-direction:column;min-width:0;flex:1}
.parada-txt b{color:var(--ink);font-size:var(--fs-2);font-weight:600}
.parada-txt small{color:var(--mudo);font-size:var(--fs-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mudo.peq,.peq.mudo{font-size:var(--fs-1)}

/* pedidos */
.rota-tabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:16px}
.rota-tabs button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:1px;background:var(--papel);border:1px solid var(--fio);border-radius:10px;padding:10px 12px;text-align:left;font-size:var(--fs-1);color:var(--mudo);font-weight:500}
.rota-tabs button b{font-size:var(--fs-4);color:var(--ink);font-weight:600;line-height:1.1}
.rota-tabs button small{font-size:var(--fs-1);color:var(--mudo);line-height:1.3}
.rota-tabs button i{position:absolute;top:8px;right:10px;font-style:normal;background:var(--azul);color:#fff;border-radius:4px;font-size:var(--fs-1);line-height:1.5;padding:0 6px}
.rota-tabs button.ativo{background:var(--marinho);border-color:var(--marinho);color:var(--no-escuro)}
.rota-tabs button.ativo b{color:#fff}.rota-tabs button.ativo small{color:var(--no-escuro)}
.rota-tabs button.ativo i{background:#FAF6EF;color:var(--marinho)}
.ped-grade{align-items:start}
table.ordem,table.precos,table.tabela-cl{width:100%;border-collapse:collapse;font-size:var(--fs-2);font-variant-numeric:tabular-nums}
table.ordem th{font-size:var(--fs-1);font-weight:500;color:var(--mudo);text-align:left;padding:6px 4px;border-bottom:1px solid var(--fio)}
table.ordem td{padding:8px 4px;border-bottom:1px solid var(--fio-suave);color:var(--ink)}
table.ordem td:nth-child(n+2),table.ordem th:nth-child(n+2){text-align:right}
table.ordem tr.grupo td{font-size:var(--fs-1);font-weight:600;color:var(--azul-txt);padding-top:14px;border-bottom:0}
table.ordem tfoot td{font-weight:700;border-bottom:0;padding-top:12px;font-size:var(--fs-3)}
.caixinha{display:inline-block;width:16px;height:16px;border:1.5px solid var(--fio-forte);border-radius:4px;vertical-align:middle}
.ped-itens{display:flex;flex-direction:column}
.ped-item{display:flex;align-items:center;gap:12px;width:100%;background:none;border:0;border-top:1px solid var(--fio-suave);padding:11px 2px;text-align:left}
.ped-item:first-child{border-top:0}
.ped-item:hover .ped-txt b{color:var(--azul-txt)}
.ped-txt{display:flex;flex-direction:column;min-width:0;flex:1}
.ped-txt b{color:var(--ink);font-size:var(--fs-2);font-weight:600}
.ped-txt small{color:var(--mudo);font-size:var(--fs-1)}
.ped-valor{font-size:var(--fs-2);font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}

/* clientes */
.cartao.sem-pad{padding:0;overflow-x:auto}
table.tabela-cl th{font-size:var(--fs-1);font-weight:500;color:var(--mudo);text-align:left;padding:12px 14px;border-bottom:1px solid var(--fio);white-space:nowrap}
table.tabela-cl td{padding:12px 14px;border-bottom:1px solid var(--fio-suave);vertical-align:top;color:var(--grafite)}
table.tabela-cl td b{display:block;color:var(--ink);font-weight:600}
table.tabela-cl td small{display:block;color:var(--mudo);font-size:var(--fs-1)}
table.tabela-cl td.peq{font-size:var(--fs-1);max-width:240px}
table.tabela-cl tr:last-child td{border-bottom:0}
.cartao.sem-pad .rodape-tab{padding:0 14px 12px}
.e-amostra{--dot:var(--azul)}.e-provou{--dot:var(--dourado)}.e-primeiro{--dot:var(--marinho);color:var(--ink);font-weight:600}.e-esfriou{--dot:#A3AAB8}
#cl-colunas{grid-template-columns:repeat(5,minmax(0,1fr))}

/* rotas */
.rotas-semana{grid-template-columns:repeat(5,minmax(0,1fr))}
.rota-nome{display:flex;align-items:center;gap:6px;padding:8px 12px 0;font-size:var(--fs-1);font-weight:600;color:var(--azul-txt);line-height:1.3}
.rota-nome svg{width:16px;height:16px;flex:none}
.rotas-semana .ev{gap:2px}
.rotas-semana .ev .chip{margin-top:4px;white-space:normal}
table.tabela-cl td:nth-child(3),table.tabela-cl td:nth-child(4){white-space:nowrap}

/* catálogo */
table.precos{margin:10px 0 4px}
table.precos td{padding:5px 0;border-bottom:1px solid var(--fio-suave);color:var(--grafite)}
table.precos td:last-child{text-align:right;font-weight:600;color:var(--ink)}
.msg-foto{display:block;width:100%;border-radius:6px;margin:4px 0 6px;aspect-ratio:16/9;object-fit:cover}

@media (max-width:1100px){
  .rotas-semana{grid-template-columns:repeat(3,minmax(0,1fr))}
  #cl-colunas{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:820px){
  .rota-tabs{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .rota-tabs button{padding:8px 6px}
  .rota-tabs button small{display:none}
  .rotas-semana{grid-template-columns:1fr}
  .rotas-semana .dia{display:flex}
  #cl-colunas{grid-template-columns:1fr}
  table.tabela-cl th:nth-child(3),table.tabela-cl td:nth-child(3),table.tabela-cl th:nth-child(5),table.tabela-cl td:nth-child(5){display:none}
}