/* =====================================================================
   CENTRAL DO CLIENTE C+ — Padrão C+ (cores e fontes de padrao_cmais)
   ===================================================================== */
:root{
  --ink:#023B58;          /* azul-marinho do logo */
  --brand:#0080C1;        /* azul do logo */
  --brand-dark:#00679B;
  --brand-soft:#E3F1F9;
  --paper:#F1F5F8;
  --surface:#FFFFFF;
  --line:#D3DEE6;
  --line-soft:#E7EEF3;
  --muted:#5B7385;
  --ok:#1E8A6A;
  --ok-soft:#E2F3EC;
  --warn:#B7791F;
  --warn-soft:#FBF1DE;
  --danger:#B3352C;
  --danger-soft:#FBE7E5;
  --radius-lg:10px;
  --radius-sm:5px;
  --font-body:"Barlow", "Segoe UI", Roboto, Arial, sans-serif;
  --font-head:"Barlow Semi Condensed", "Arial Narrow", "Segoe UI", Arial, sans-serif;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.5;
}
h1,h2,h3{
  font-family:var(--font-head);
  font-weight:600;
  color:var(--ink);
  margin:0 0 8px;
  letter-spacing:.005em;
}
h1{font-size:1.75rem;line-height:1.2;}
h2{font-size:1.3rem;}
h3{font-size:1.1rem;}
a{color:var(--brand);}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;}
code{font-size:.92em;background:var(--line-soft);padding:0 4px;border-radius:3px;}

.wrap{max-width:480px;margin:0 auto;padding:48px 16px;}
.wrap-wide{max-width:960px;margin:0 auto;padding:32px 16px 56px;}
.intro{color:var(--muted);margin:0 0 20px;}
.centro{text-align:center;}
.voltar{text-align:center;font-size:.9rem;margin-top:24px;}
.voltar a{color:var(--muted);}

/* ---------- topo ---------- */
header.top{background:var(--surface);border-bottom:1px solid var(--line);}
.top-inner{
  max-width:960px;margin:0 auto;padding:8px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.top-logo img{display:block;height:64px;width:auto;}
.top-nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.top-nav a{
  font-size:.95rem;font-weight:500;color:var(--ink);text-decoration:none;
  padding:8px 12px;border-radius:var(--radius-sm);
}
.top-nav a:hover{background:var(--brand-soft);}
.top-nav a.ativo{background:var(--brand-soft);color:var(--brand-dark);}
.top-nav a.logout{border:1px solid var(--line);margin-left:6px;}

/* ---------- login ---------- */
.login-logo{text-align:center;margin-bottom:20px;}
.login-logo img{
  height:170px;width:auto;max-width:100%;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:10px;
}

.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:28px;
}
.card + .card{margin-top:20px;}
.card-form{max-width:520px;}

/* ---------- formulários ---------- */
.field{margin-bottom:16px;}
.field label{display:block;font-size:.9rem;font-weight:500;color:var(--ink);margin-bottom:6px;}
.field input,.field select,.busca input,.troca-empresa select{
  width:100%;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  font-family:inherit;
  font-size:1rem;
  color:var(--ink);
  background:#fff;
}
.ajuda{font-size:.85rem;color:var(--muted);margin:6px 0 0;}

.field-icon{position:relative;margin-bottom:14px;}
.field-icon svg{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  width:18px;height:18px;color:var(--muted);pointer-events:none;
}
.field-icon input{
  width:100%;
  padding:12px 14px 12px 42px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  font-family:inherit;
  font-size:1rem;
  background:#fff;
}
.forgot-link{display:block;text-align:center;font-size:.9rem;margin-top:16px;}

.btn{
  display:inline-block;
  width:100%;
  background:var(--ink);
  color:#fff;
  padding:12px 18px;
  border:none;
  border-radius:var(--radius-sm);
  font-family:inherit;
  font-size:1rem;
  font-weight:600;
  cursor:pointer;
  text-align:center;
  text-decoration:none;
}
.btn:hover{background:var(--brand-dark);}
.btn-auto{width:auto;}

.btn-small{
  background:none;
  border:1px solid var(--danger);
  color:var(--danger);
  padding:6px 10px;
  border-radius:var(--radius-sm);
  font-family:inherit;
  font-size:.85rem;
  cursor:pointer;
  white-space:nowrap;
}
.btn-small:hover{background:var(--danger-soft);}
.btn-small.btn-neutro{border-color:var(--brand);color:var(--brand-dark);}
.btn-small.btn-neutro:hover{background:var(--brand-soft);}

.busca{display:flex;gap:8px;margin:12px 0 16px;}
.busca input{flex:1;}
.form-linha{display:flex;gap:6px;align-items:center;margin:0;flex-wrap:wrap;}
.form-linha input[type=text]{width:150px;padding:6px 8px;border:1px solid var(--line);border-radius:var(--radius-sm);font-family:inherit;font-size:.88rem;}
.form-estreito{max-width:460px;}

/* ---------- avisos ---------- */
.alert{padding:12px 14px;border-radius:var(--radius-sm);font-size:.95rem;margin-bottom:18px;}
.alert-error{background:var(--danger-soft);color:var(--danger);border:1px solid #F0C4BF;}
.alert-ok{background:var(--ok-soft);color:var(--ok);border:1px solid #BFE3D1;}
.aviso-escritorio{
  background:var(--warn-soft);color:#7A5113;border:1px solid #EED9AE;
  padding:10px 14px;border-radius:var(--radius-sm);font-size:.92rem;margin-bottom:20px;
}
.info-envio{
  background:var(--brand-soft);border:1px solid #BFDDEF;border-radius:var(--radius-sm);
  padding:12px 14px;font-size:.95rem;margin:4px 0 24px;
}
.chip{
  display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.03em;
  background:var(--brand);color:#fff;padding:2px 9px;border-radius:20px;vertical-align:middle;
}
.chip-aviso{background:var(--warn-soft);color:#7A5113;}

/* ---------- painel ---------- */
.destaque{
  display:block;background:var(--ink);color:#fff;text-decoration:none;
  border-radius:var(--radius-lg);padding:20px 22px;margin:18px 0 28px;
}
.destaque:hover{background:var(--brand-dark);}
.destaque-titulo{display:block;font-family:var(--font-head);font-size:1.35rem;font-weight:600;}
.destaque-texto{display:block;color:#CFE6F4;font-size:.95rem;}

.dept-title{
  font-size:1.2rem;
  margin:32px 0 0;
  padding-bottom:8px;
  border-bottom:1px solid var(--line);
}
.agent-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:14px;
  margin-top:18px;
}
.agent-card{
  display:block;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:20px;
  text-decoration:none;
  color:var(--ink);
  font-weight:600;
  transition:box-shadow .15s ease, border-color .15s ease;
}
.agent-card:hover{box-shadow:0 6px 16px rgba(2,59,88,.08);border-color:var(--brand);}
.agent-empty{color:var(--muted);font-size:.95rem;margin-top:16px;}

/* ---------- minha empresa ---------- */
.troca-empresa{max-width:560px;margin-bottom:24px;}
.troca-empresa label{display:block;font-size:.9rem;font-weight:500;margin-bottom:6px;}
.empresa-cab{margin-bottom:18px;}
.empresa-cab .rotulo{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 2px;}
.empresa-cab .fantasia{color:var(--muted);font-size:1.05rem;margin:0;}
.dados{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;
  margin:0 0 8px;
}
.dados div{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;}
.dados dt{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
.dados dd{margin:2px 0 0;font-weight:600;font-variant-numeric:tabular-nums;}
.resp-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:16px;
}
.resp-card{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:var(--radius-sm);padding:14px 16px;}
.resp-card p{margin:0;}
.resp-dep{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;}
.resp-nome{font-weight:600;font-size:1.05rem;}
.resp-email{font-size:.9rem;word-break:break-all;}
.rodape-dados{color:var(--muted);font-size:.88rem;margin-top:24px;}
.lista-empresas{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.lista-empresas a{
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:12px 14px;text-decoration:none;color:var(--ink);
}
.lista-empresas a:hover{border-color:var(--brand);}
.lista-empresas span{color:var(--muted);font-variant-numeric:tabular-nums;}

/* ---------- administração ---------- */
.secao{margin-top:40px;}
.sub{margin-top:24px;}
table.admin-table{width:100%;border-collapse:collapse;margin-top:12px;font-size:.93rem;}
table.admin-table th,table.admin-table td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle;}
table.admin-table th{color:var(--muted);font-weight:600;font-size:.82rem;}
td.links{white-space:nowrap;}
td.links .manage-link + .manage-link{margin-left:10px;}
.manage-link{font-size:.88rem;}
.type-badge{display:inline-block;font-size:.75rem;font-weight:700;padding:3px 9px;border-radius:20px;}
.type-badge.cliente{background:var(--brand-soft);color:var(--ink);}
.type-badge.escritorio{background:var(--brand);color:#fff;}
.agent-checklist{display:flex;flex-direction:column;gap:2px;margin:12px 0 18px;max-height:360px;overflow-y:auto;border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px;background:var(--surface);}
.agent-checklist label{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:4px;cursor:pointer;}
.agent-checklist label:hover{background:var(--paper);}
.checklist-grupo{font-size:.78rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;padding:8px 10px 2px;}

/* ---------- menu lateral (páginas do cliente) ---------- */
body.com-menu{display:flex;min-height:100vh;}
.pular{position:absolute;left:-9999px;top:8px;z-index:100;background:#fff;padding:8px 12px;border-radius:var(--radius-sm);}
.pular:focus{left:16px;}
.menu-lateral{
  width:280px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--line);
  position:sticky;top:0;height:100vh;overflow-y:auto;padding:14px 12px 20px;
  display:flex;flex-direction:column;gap:6px;
}
.menu-logo{display:block;padding:0 8px 4px;}
.menu-logo img{display:block;height:76px;width:auto;}
.menu-usuario{font-size:.88rem;color:var(--muted);margin:0 10px 8px;}
.menu{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;}
.menu a,.menu summary{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-sm);
  color:var(--ink);text-decoration:none;font-size:.95rem;font-weight:500;cursor:pointer;
}
.menu a:hover,.menu summary:hover{background:var(--brand-soft);}
.menu a.ativo{background:var(--brand-soft);color:var(--brand-dark);font-weight:600;}
.menu svg{width:20px;height:20px;flex-shrink:0;color:var(--brand);}
.menu summary{list-style:none;}
.menu summary::-webkit-details-marker{display:none;}
.menu summary::after{
  content:"";margin-left:auto;flex-shrink:0;width:7px;height:7px;
  border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
  transform:rotate(45deg);transition:transform .15s ease;
}
.menu details[open] > summary::after{transform:rotate(-135deg);}
.submenu{list-style:none;margin:2px 0 6px;padding:0 0 0 30px;display:flex;flex-direction:column;gap:1px;}
.submenu a{font-size:.9rem;font-weight:400;padding:6px 10px;}
.submenu a.agente{color:var(--muted);}
.submenu a.agente::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--line);flex-shrink:0;}
.menu-rodape{margin-top:auto;padding-top:10px;border-top:1px solid var(--line);}
.menu-fundo{display:none;}
.barra-celular{display:none;}
.conteudo{flex:1;min-width:0;padding:28px 36px 56px;}
.conteudo-interno{width:100%;}
.contexto{
  display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:10px 14px;margin-bottom:24px;font-size:.92rem;
}
.contexto-doc{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:6px;}

.painel-bloco{margin-top:28px;}
.painel-bloco .dept-title{margin-top:0;}
.agent-dep{display:block;font-size:.75rem;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px;}
.atalhos{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:16px;}
.atalho{
  display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:16px 18px;text-decoration:none;color:var(--ink);
}
.atalho:hover{border-color:var(--brand);box-shadow:0 6px 16px rgba(2,59,88,.08);}
.atalho strong{display:block;font-family:var(--font-head);font-size:1.1rem;font-weight:600;}
.atalho span{display:block;color:var(--muted);font-size:.88rem;margin-top:2px;}
.trilha{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:0 0 4px;}
.em-breve{background:var(--surface);border:1px dashed #B9CCD8;border-radius:var(--radius-lg);padding:24px;margin-top:8px;}
.em-breve p{margin:0 0 10px;}

.contador{
  margin-left:auto;background:var(--danger);color:#fff;font-size:.72rem;font-weight:700;
  border-radius:20px;padding:1px 8px;min-width:22px;text-align:center;
}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ---------- pedidos (folha, admissão, rescisão) ---------- */
.form-pedido{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;margin-top:8px;}
.form-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px 16px;}
.campo{min-width:0;}
.campo-1{grid-column:span 6;}
.campo-2{grid-column:span 3;}
.campo-3{grid-column:span 2;}
.campo > label{display:block;font-size:.9rem;font-weight:500;margin-bottom:5px;}
.campo input[type=text],.campo input[type=date],.campo select,.campo textarea,
.tabela-linhas input,.tabela-linhas select{
  width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);
  font-family:inherit;font-size:.95rem;color:var(--ink);background:#fff;
}
.campo textarea{resize:vertical;}
.form-bloco{grid-column:1 / -1;font-size:1.05rem;margin:14px 0 0;padding-bottom:6px;border-bottom:1px solid var(--line);}
.form-grid > .form-bloco:first-child{margin-top:0;}
.obrig{color:var(--danger);font-weight:700;}
.opcoes{border:0;margin:0;padding:0;min-width:0;}
.opcoes legend{font-size:.9rem;font-weight:500;margin-bottom:5px;padding:0;}
.opcoes-lista{display:flex;flex-wrap:wrap;gap:6px 8px;}
.opcoes-lista label{
  display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:7px 10px;font-size:.92rem;background:#fff;cursor:pointer;
}
.opcoes-lista label:has(input:checked){border-color:var(--brand);background:var(--brand-soft);}
.caixa{display:flex;align-items:flex-start;gap:8px;font-weight:500;cursor:pointer;}
.caixa input{margin-top:4px;}
.com-erro input,.com-erro select,.com-erro textarea{border-color:var(--danger);}
.erro-campo{color:var(--danger);font-size:.85rem;margin:4px 0 0;}
.linhas{border:0;margin:0;padding:0;min-width:0;}
.linhas legend{font-size:.9rem;font-weight:500;margin-bottom:6px;padding:0;}
.tabela-rolagem{overflow-x:auto;}
.tabela-linhas{width:100%;border-collapse:collapse;min-width:640px;}
.tabela-linhas th{text-align:left;font-size:.8rem;font-weight:600;color:var(--muted);padding:4px 6px;}
.tabela-linhas td{padding:3px 4px;vertical-align:top;}
.tabela-linhas td:last-child{width:40px;}
.linhas [data-adicionar-linha]{margin-top:8px;}
.anexos-campo{border:1px dashed #B9CCD8;border-radius:var(--radius-sm);margin:20px 0;padding:14px 16px;}
.anexos-campo legend{font-weight:600;padding:0 4px;}
.anexos-campo label{display:block;font-size:.9rem;margin-bottom:6px;}
.anexos{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px;}
.anexos li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;}
.anexos span{color:var(--muted);font-size:.85rem;}
.anexos .remover{font-size:.85rem;color:var(--danger);display:inline-flex;align-items:center;gap:4px;}
.pedido-cab{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:16px;
}
.pedido-quando{flex-basis:100%;color:var(--muted);font-size:.88rem;}
.chip.situacao-enviado{background:var(--warn-soft);color:#7A5113;}
.chip.situacao-recebido{background:var(--brand-soft);color:var(--brand-dark);}
.chip.situacao-concluido{background:var(--ok-soft);color:var(--ok);}
.acoes-pedido{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:4px 0 8px;}
.acoes-pedido form{margin:0;}
.resumo{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px 16px;margin:12px 0;}
.resumo:empty{display:none;}
.resumo > div{grid-column:span 3;border-bottom:1px solid var(--line-soft);padding-bottom:6px;}
.resumo > .resumo-1{grid-column:span 6;}
.resumo > .resumo-3{grid-column:span 2;}
.resumo dt{font-size:.8rem;color:var(--muted);}
.resumo dd{margin:2px 0 0;font-weight:500;overflow-wrap:anywhere;}
.resumo .vazio{color:var(--line);}
.tabela-grade{border-collapse:collapse;min-width:100%;}
.tabela-grade th,.tabela-grade td{border:1px solid var(--line);padding:4px 6px;}
.tabela-grade thead th{background:var(--paper);font-size:.8rem;font-weight:600;text-align:center;vertical-align:bottom;min-width:96px;}
.tabela-grade tbody th{text-align:left;font-weight:500;font-size:.9rem;white-space:nowrap;position:sticky;left:0;background:var(--surface);z-index:1;}
/* coluna do nome fixa à esquerda, com o título dela; a sombra marca onde a tabela rola por baixo */
.tabela-grade thead th:first-child{position:sticky;left:0;z-index:2;text-align:left;}
.tabela-grade tbody th,.tabela-grade thead th:first-child{box-shadow:inset -1px 0 0 var(--line),6px 0 8px -6px rgba(2,59,88,.25);}
.tabela-grade input{width:100%;min-width:76px;padding:7px 6px;border:1px solid transparent;border-radius:4px;font-family:inherit;font-size:.95rem;text-align:right;font-variant-numeric:tabular-nums;}
.tabela-grade input:focus{border-color:var(--brand);outline:none;background:var(--brand-soft);}
.grade-tipo{display:block;font-weight:400;color:var(--muted);font-size:.75rem;}
.grade-cod{color:var(--muted);font-size:.78rem;font-weight:400;margin-left:6px;}
.plano .ajuda{margin-top:0;}
.tabela-plano{margin-bottom:12px;}
.tabela-plano caption{text-align:left;font-weight:600;padding:6px 0;}
.tabela-plano select{width:100%;min-width:150px;padding:6px;border:1px solid var(--line);border-radius:4px;font-family:inherit;font-size:.9rem;background:var(--surface);}
.tabela-plano td:last-child input{text-align:left;min-width:160px;}
.tabela-plano tr.plano-dependente th{padding-left:22px;font-weight:400;}
.arquivos-questor li{align-items:baseline;}
[hidden]{display:none !important;}
.dica-linhas{margin:0 0 8px;}
.rotulo-outro{display:block;font-size:.85rem;color:var(--muted);margin:10px 0 4px;}
.departamento{margin-top:32px;}
.departamento .dept-title{margin-top:0;}
/* 12 colunas: "Quem atende" ocupa 3, as obrigações 9; os dois quadros do pessoal, 6 cada (linha de baixo) */
.dept-grade{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:stretch;}
.dept-card{grid-column:span 3;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px 18px;min-width:0;}
.dept-card.dept-largo{grid-column:span 9;}
.dept-card.dept-meio{grid-column:span 6;}
.dept-card h3{margin:0 0 10px;font-size:1rem;}
.dept-card .agent-empty{margin-top:0;}
.dept-card .tabela-rolagem{margin:0 -4px;}
.dept-resp{border-left:4px solid var(--brand);padding:2px 0 2px 10px;margin-bottom:10px;}
.dept-resp p{margin:0;}
.dept-sub{margin-top:18px !important;}
.dept-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.historico td{white-space:nowrap;}
.historico-nota{display:block;color:var(--muted);font-size:.8rem;}
.form-config{margin:12px 0 16px;}
.agenda td:first-child{white-space:nowrap;font-variant-numeric:tabular-nums;}
.agenda tr.hoje td{background:var(--warn-soft);}
.filtros-agenda{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px;}
.filtros-agenda a{padding:6px 12px;border:1px solid var(--line);border-radius:20px;text-decoration:none;color:var(--ink);font-size:.9rem;background:var(--surface);}
.filtros-agenda a.ativo{background:var(--brand-soft);border-color:var(--brand);color:var(--brand-dark);font-weight:600;}
.noticias{display:flex;flex-direction:column;gap:12px;margin-top:14px;}
.noticia{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:var(--radius-sm);padding:14px 16px;margin-top:12px;}
.noticias .noticia{margin-top:0;}
.noticia h3{margin:0 0 4px;}
.noticia p{margin:0 0 6px;}
.noticia-data{color:var(--muted);font-size:.82rem;}
.filtros{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 16px;}
.filtros label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;font-weight:500;}
.filtros select{padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);font-family:inherit;font-size:.95rem;}

@media (max-width:900px){
  body.com-menu{display:block;}
  .barra-celular{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:sticky;top:0;z-index:20;background:var(--surface);border-bottom:1px solid var(--line);padding:6px 16px;
  }
  .barra-celular img{display:block;height:44px;width:auto;}
  .botao-menu{
    display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--line);
    border-radius:var(--radius-sm);padding:8px 12px;font-family:inherit;font-size:.95rem;font-weight:500;
    color:var(--ink);cursor:pointer;
  }
  .botao-menu svg{width:20px;height:20px;}
  .menu-lateral{
    position:fixed;left:0;top:0;bottom:0;height:auto;z-index:40;width:min(300px,86vw);
    transform:translateX(-100%);visibility:hidden;transition:transform .2s ease,visibility .2s;
    box-shadow:0 0 24px rgba(2,59,88,.18);
  }
  body.menu-aberto .menu-lateral{transform:none;visibility:visible;}
  body.menu-aberto .menu-fundo{display:block;position:fixed;inset:0;z-index:30;background:rgba(2,59,88,.35);}
  .conteudo{padding:20px 16px 40px;}
}
/* Dashboard em tela média: "Quem atende" mais largo e os quadros do pessoal um embaixo do outro; em tela pequena,
   tudo em uma coluna */
@media (max-width:1400px){
  .dept-card{grid-column:span 4;}
  .dept-card.dept-largo{grid-column:span 8;}
  .dept-card.dept-meio{grid-column:span 12;}
}
@media (max-width:1000px){
  .dept-card,.dept-card.dept-largo,.dept-card.dept-meio{grid-column:1 / -1;}
}

/* ---------- celular ---------- */
@media (max-width:640px){
  .wrap{padding:28px 16px;}
  .wrap-wide{padding:20px 16px 40px;}
  .card{padding:20px;}
  .top-logo img{height:48px;}
  .top-nav a{padding:6px 8px;font-size:.9rem;}
  .login-logo img{height:140px;}
  h1{font-size:1.5rem;}
  .agent-grid,.resp-grid,.atalhos{grid-template-columns:1fr;}
  .form-pedido{padding:16px;}
  .campo-1,.campo-2,.campo-3,.resumo > div,.resumo > .resumo-1,.resumo > .resumo-3{grid-column:1 / -1;}
  .busca{flex-direction:column;}
  table.admin-table{display:block;overflow-x:auto;white-space:nowrap;}
}