:root {
  color-scheme: light;
  --fundo: #f4f4f2;
  --superficie: #ffffff;
  --superficie-2: #f8f8f6;
  --borda: #e3e2de;
  --texto: #1b1b1a;
  --texto-2: #52514e;
  --texto-3: #7a7974;
  --marca: #1c5cab;
  --marca-forte: #184f95;
  --marca-suave: #e6effb;
  --barra: #2a78d6;
  --barra-trilho: #ecebe7;
  --lateral: #15263d;
  --lateral-texto: #c9d4e3;
  --lateral-ativo: #24405f;
  --ok: #0a7a0a;        --ok-fundo: #e5f4e5;
  --alerta: #8a5a00;    --alerta-fundo: #fff3d6;
  --serio: #a8461c;     --serio-fundo: #fdeae1;
  --critico: #b52f2f;   --critico-fundo: #fbe6e6;
  --neutro-fundo: #efeeea;
  --sombra: 0 1px 2px rgb(0 0 0 / .06), 0 2px 8px rgb(0 0 0 / .04);
  --raio: 10px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --fundo: #0a1220; --superficie: #111b2d; --superficie-2: #16223a; --borda: #22314d;
    --texto: #f2f5fa; --texto-2: #b8c3d6; --texto-3: #8190a8;
    --marca: #5598e7; --marca-forte: #86b6ef; --marca-suave: #1c2a3d;
    --barra: #3987e5; --barra-trilho: #1f2c44;
    --lateral: #070d18; --lateral-texto: #b3c0d1; --lateral-ativo: #1d3048;
    --ok: #5fcf5f; --ok-fundo: #173117; --alerta: #fab219; --alerta-fundo: #3a2e10;
    --serio: #ec835a; --serio-fundo: #3a2217; --critico: #f07a7a; --critico-fundo: #3d1b1b;
    --neutro-fundo: #1f2c44; --sombra: none;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --fundo: #0a1220; --superficie: #111b2d; --superficie-2: #16223a; --borda: #22314d;
  --texto: #f2f5fa; --texto-2: #b8c3d6; --texto-3: #8190a8;
  --marca: #5598e7; --marca-forte: #86b6ef; --marca-suave: #1c2a3d;
  --barra: #3987e5; --barra-trilho: #1f2c44;
  --lateral: #070d18; --lateral-texto: #b3c0d1; --lateral-ativo: #1d3048;
  --ok: #5fcf5f; --ok-fundo: #173117; --alerta: #fab219; --alerta-fundo: #3a2e10;
  --serio: #ec835a; --serio-fundo: #3a2217; --critico: #f07a7a; --critico-fundo: #3d1b1b;
  --neutro-fundo: #1f2c44; --sombra: none;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--fundo); color: var(--texto);
  font: 14px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}
h1 { font-size: 22px; margin: 0; font-weight: 650; letter-spacing: -.01em; }
h2 { font-size: 15px; margin: 0 0 12px; font-weight: 650; }
a { color: var(--marca); }
.sub { color: var(--texto-2); margin: 2px 0 0; }
.muted { color: var(--texto-3); }
.num { font-variant-numeric: tabular-nums; }
.carregando { padding: 48px; text-align: center; color: var(--texto-3); }

/* ---------- Layout ---------- */
.layout { display: grid; grid-template-columns: 232px 1fr; min-height: 100vh; }
.lateral { background: var(--lateral); color: var(--lateral-texto); padding: 18px 12px; display: flex; flex-direction: column; gap: 4px; position: sticky; top: 0; height: 100vh; overflow: hidden; }
.logo { display: flex; align-items: center; gap: 10px; color: #fff; font-weight: 700; font-size: 15px; padding: 4px 10px 18px; flex: none; }
.logo img { width: 26px; height: 26px; }
/* BUG REAL: a barra lateral tem altura fixa (100vh); com muitos módulos no menu (comercial,
   atendimento, processos...) o conteúdo passava dessa altura sem rolagem, e a parte que
   "vazava" ficava sem o fundo azul (o navegador simplesmente parava de desenhar o .lateral ali).
   Corrigido dando rolagem própria só ao <nav>, com logo e rodapé (usuário/ações) sempre visíveis. */
.lateral nav { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; }
.lateral nav a { color: var(--lateral-texto); text-decoration: none; padding: 9px 12px; border-radius: 8px; display: flex; gap: 10px; align-items: center; }
.lateral nav a:hover { background: rgb(255 255 255 / .06); color: #fff; }
.lateral nav a.ativo { background: var(--lateral-ativo); color: #fff; font-weight: 600; }
.lateral .grupo { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; opacity: .55; padding: 16px 12px 4px; }
.lateral .rodape { margin-top: auto; padding: 12px; border-top: 1px solid rgb(255 255 255 / .1); font-size: 13px; }
.lateral .rodape strong { color: #fff; display: block; }
.lateral .rodape .perfil { opacity: .7; font-size: 12px; }
/* ações do rodapé: botões do mesmo tamanho em 2 colunas; "Sair" ocupa a linha inteira por último */
.lateral .rodape .acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 10px; }
.lateral .rodape .acoes button { text-decoration: none; padding: 6px 8px; border-radius: 6px; background: rgb(255 255 255 / .06); font-size: 12px; line-height: 1.25; text-align: center; display: flex; align-items: center; justify-content: center; min-height: 30px; }
.lateral .rodape .acoes button[hidden] { display: none; }
.lateral .rodape .acoes button:hover { background: rgb(255 255 255 / .13); color: #fff; }
.lateral .rodape .acoes button[data-acao="sair"] { grid-column: 1 / -1; color: #fca5a5; }
.lateral .rodape .acoes button[data-acao="sair"]:hover { background: rgb(239 68 68 / .18); color: #fff; }
.lateral .rodape button { background: none; border: 0; color: var(--lateral-texto); padding: 0; cursor: pointer; font: inherit; text-decoration: underline; }
.lateral .rodape button.btn-atualizar-versao {
  display: flex; align-items: center; justify-content: center; gap: 7px;
  width: 100%; padding: 7px 10px; margin-bottom: 10px;
  background: rgb(255 255 255 / .12); color: #fff; border: 1px solid rgb(255 255 255 / .2);
  border-radius: 6px; font-size: 12px; font-weight: 600; cursor: pointer; text-decoration: none;
  transition: all .15s ease;
}
.lateral .rodape button.btn-atualizar-versao:hover {
  background: var(--marca, #1d4ed8); border-color: transparent; color: #fff; text-decoration: none;
}
.lateral .rodape button.btn-atualizar-versao svg { width: 13px; height: 13px; flex: none; }
body.menu-recolhido .lateral .rodape button.btn-atualizar-versao { padding: 7px 0; width: 34px; margin: 0 auto 10px; }
body.menu-recolhido .lateral .rodape button.btn-atualizar-versao span { display: none; }
@media (max-width: 860px) { .lateral .rodape button.btn-atualizar-versao { display: none; } }
.conteudo { padding: 24px 28px 48px; min-width: 0; }
.cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.cab .botoes { display: flex; gap: 8px; flex-wrap: wrap; }

@media (max-width: 860px) {
  .layout { grid-template-columns: 1fr; }
  .lateral { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 10px 16px; }
  .logo { padding: 0 8px 0 0; }
  .lateral nav { flex-direction: row; overflow-x: auto; flex: 1 1 100%; order: 3; }
  .lateral nav a { white-space: nowrap; padding: 7px 10px; }
  .lateral .grupo { display: none; }
  .lateral .rodape { margin: 0 0 0 auto; border: 0; padding: 0; display: flex; gap: 12px; align-items: center; }
  .lateral .rodape .perfil, .lateral .rodape strong { display: none; }
  .lateral .rodape .acoes { display: flex; margin: 0; }
  .conteudo { padding: 16px 16px 40px; }
}

/* ---------- Componentes ---------- */
.card { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); padding: 18px; box-shadow: var(--sombra); min-width: 0; }
.card + .card, .card + .grid2, .grid2 + .card, .kpis + .card, .kpis + .grid2 { margin-top: 16px; }
.card .card-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.card .card-cab h2 { margin: 0; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 1100px) { .grid2 { grid-template-columns: 1fr; } }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.kpi { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); padding: 14px 16px; text-decoration: none; color: var(--texto); box-shadow: var(--sombra); display: block; }
a.kpi:hover { border-color: var(--marca); }
.kpi .rot { color: var(--texto-2); font-size: 13px; display: flex; gap: 6px; align-items: center; }
.kpi .val { font-size: 28px; font-weight: 650; font-variant-numeric: tabular-nums; margin-top: 2px; }
.kpi .det { font-size: 12px; color: var(--texto-3); }
.kpi.perigo .val { color: var(--critico); }
.kpi.alerta .val { color: var(--alerta); }
.kpi.ok .val { color: var(--ok); }

.btn { background: var(--marca); color: #fff; border: 1px solid var(--marca); border-radius: 8px; padding: 8px 14px; font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.btn:hover { filter: brightness(1.08); }
.btn:disabled { opacity: .55; cursor: default; }
.btn.sec { background: var(--superficie); color: var(--texto); border-color: var(--borda); }
.btn.sec:hover { border-color: var(--texto-3); filter: none; }
.btn.perigo { background: var(--critico); border-color: var(--critico); }
.btn.peq { padding: 4px 10px; font-size: 13px; font-weight: 550; }
.icone { background: none; border: 0; color: var(--texto-2); font-size: 22px; line-height: 1; cursor: pointer; padding: 2px 6px; border-radius: 6px; }
.icone:hover { background: var(--superficie-2); }
.link { background: none; border: 0; padding: 0; color: var(--marca); cursor: pointer; font: inherit; }
.link:hover { text-decoration: underline; }
.acoes-linha { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }

/* Formulários */
label.campo { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--texto-2); font-weight: 550; min-width: 0; }
label.campo .dica { font-weight: 400; color: var(--texto-3); font-size: 12px; }
label.campo span.obrig-ret::after { content: " * (ISS retido)"; color: var(--critico); font-weight: 550; }
input, select, textarea {
  font: inherit; color: var(--texto); background: var(--superficie); border: 1px solid var(--borda);
  border-radius: 8px; padding: 7px 10px; min-width: 0; width: 100%;
}
input:focus, select:focus, textarea:focus, .btn:focus-visible, a:focus-visible, button:focus-visible { outline: 2px solid var(--marca); outline-offset: 1px; }
textarea { min-height: 72px; resize: vertical; }
input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--marca); }
label.check { display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--texto); cursor: pointer; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.form-grid .inteiro { grid-column: 1 / -1; }
.form-grid.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 640px) { .form-grid, .form-grid.tres { grid-template-columns: 1fr; } }
.secao-form { grid-column: 1 / -1; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-3); border-top: 1px solid var(--borda); padding-top: 12px; margin-top: 4px; }

.filtros { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 14px; }
.filtros label.campo { flex: 1 1 150px; max-width: 240px; }
.filtros label.campo.largo { flex: 2 1 220px; max-width: 340px; }

/* Tabelas */
.tabela-wrap { overflow-x: auto; margin: 0 -18px; padding: 0 18px; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--borda); vertical-align: middle; }
th { font-size: 12px; font-weight: 600; color: var(--texto-2); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; background: var(--superficie); position: sticky; top: 0; }
tbody tr:hover { background: var(--superficie-2); }
td.n, th.n { text-align: right; font-variant-numeric: tabular-nums; }
td .l2 { display: block; font-size: 12px; color: var(--texto-3); }
tr.inativo td { opacity: .55; }
.vazio { text-align: center; color: var(--texto-3); padding: 28px 10px; }
.contador { color: var(--texto-3); font-size: 13px; }

/* Selos de situação: ícone + texto (a cor nunca é o único sinal) */
.selo { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; background: var(--neutro-fundo); color: var(--texto-2); }
.selo::before { font-size: 11px; }
.selo.a_vencer { background: var(--marca-suave); color: var(--marca-forte); }
.selo.a_vencer::before { content: "○"; }
.selo.meta_vencida { background: var(--alerta-fundo); color: var(--alerta); }
.selo.meta_vencida::before { content: "◔"; }
.selo.vence_hoje { background: var(--serio-fundo); color: var(--serio); }
.selo.vence_hoje::before { content: "!"; font-weight: 800; }
.selo.vencida { background: var(--critico-fundo); color: var(--critico); }
.selo.vencida::before { content: "✕"; }
.selo.entregue_no_prazo { background: var(--ok-fundo); color: var(--ok); }
.selo.entregue_no_prazo::before { content: "✓"; }
.selo.entregue_atraso { background: var(--serio-fundo); color: var(--serio); }
.selo.entregue_atraso::before { content: "✓"; }
.selo.dispensada::before { content: "–"; }
.tag { display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 5px; background: var(--neutro-fundo); color: var(--texto-2); font-weight: 600; white-space: nowrap; }
.tag.ok { background: var(--ok-fundo); color: var(--ok); }
.tag.critico { background: var(--critico-fundo); color: var(--critico); }
.tag.alerta { background: var(--alerta-fundo); color: var(--alerta); }

/* Barras de desempenho */
.barra { display: flex; align-items: center; gap: 8px; min-width: 150px; }
.barra .trilho { flex: 1; height: 8px; background: var(--barra-trilho); border-radius: 4px; overflow: hidden; }
.barra .preench { height: 100%; background: var(--barra); border-radius: 0 4px 4px 0; width: 0; }
.barra .v { font-variant-numeric: tabular-nums; font-weight: 600; min-width: 48px; text-align: right; }

.colunas { display: flex; align-items: flex-end; gap: 14px; height: 190px; padding: 18px 4px 0; border-bottom: 1px solid var(--borda); }
.colunas .col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 6px; min-width: 0; }
.colunas .col .rotv { font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--texto); }
.colunas .col .pilar { width: min(44px, 70%); background: var(--barra); border-radius: 4px 4px 0 0; min-height: 2px; }
.colunas .col.sem .pilar { background: var(--barra-trilho); }
.colunas-rotulos { display: flex; gap: 14px; padding: 6px 4px 0; }
.colunas-rotulos span { flex: 1; text-align: center; font-size: 12px; color: var(--texto-2); }

/* Modal */
.modal-fundo { position: fixed; inset: 0; background: rgb(10 14 20 / .5); display: flex; align-items: flex-start; justify-content: center; padding: 5vh 16px; z-index: 50; overflow-y: auto; }
.modal { background: var(--superficie); border-radius: 12px; width: 100%; max-width: 560px; box-shadow: 0 20px 50px rgb(0 0 0 / .3); border: 1px solid var(--borda); }
.modal.largo { max-width: 860px; }
.modal.xl { max-width: 1180px; }
.modal header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--borda); }
.modal header h2 { margin: 0; font-size: 17px; }
.modal-corpo { padding: 18px 20px; max-height: 70vh; overflow-y: auto; }
.modal footer { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--borda); }
.modal-erro { margin: 0 20px 4px; padding: 9px 12px; border-radius: 8px; background: var(--critico-fundo); color: var(--critico); font-weight: 550; }
.caixa-info { background: var(--marca-suave); color: var(--texto); border-radius: 8px; padding: 10px 12px; font-size: 13px; }
.caixa-alerta { background: var(--alerta-fundo); color: var(--texto); border-radius: 8px; padding: 10px 12px; font-size: 13px; }
.senha-temp { font: 600 20px/1.2 ui-monospace, Consolas, monospace; letter-spacing: .04em; padding: 12px; text-align: center; background: var(--superficie-2); border: 1px dashed var(--borda); border-radius: 8px; margin: 10px 0; user-select: all; }

/* Avisos */
#avisos { position: fixed; bottom: 18px; right: 18px; display: flex; flex-direction: column; gap: 8px; z-index: 60; max-width: calc(100vw - 36px); }
.aviso { background: var(--texto); color: var(--superficie); padding: 10px 16px; border-radius: 8px; box-shadow: 0 6px 20px rgb(0 0 0 / .2); font-weight: 550; }
.aviso.erro { background: var(--critico); color: #fff; }

/* Login */
.login-pag { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.login-caixa { width: 100%; max-width: 380px; }
.login-caixa .logo { color: var(--texto); justify-content: center; font-size: 19px; padding-bottom: 20px; }
.login-caixa form { display: flex; flex-direction: column; gap: 14px; }
.login-caixa .btn { justify-content: center; padding: 10px; }
.erro-inline { color: var(--critico); font-weight: 550; font-size: 13px; }
.politica { font-size: 12px; color: var(--texto-3); margin: 0; padding-left: 18px; }

.lista-check { display: flex; flex-direction: column; }
.lista-check .linha { display: grid; grid-template-columns: 24px 1fr 190px; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--borda); }
.lista-check .linha .l2 { display: block; font-size: 12px; color: var(--texto-3); }
.lista-check h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-3); margin: 14px 0 2px; }
@media (max-width: 640px) { .lista-check .linha { grid-template-columns: 24px 1fr; } .lista-check .linha select { grid-column: 2; } }

.paginacao { display: flex; gap: 10px; align-items: center; justify-content: flex-end; margin-top: 12px; }
.barra-lote { display: flex; gap: 10px; align-items: center; padding: 10px 12px; background: var(--marca-suave); border-radius: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.barra-lote select { width: auto; }
.previa { font-size: 13px; }
.previa li { font-variant-numeric: tabular-nums; }
dl.info { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
dl.info dt { color: var(--texto-2); }
dl.info dd { margin: 0; font-weight: 550; }

/* Utilitários (sem estilos inline, por causa da CSP) */
.espaco { flex: 1; }
.nota-login { text-align: center; font-size: 12px; margin-top: 14px; }
.mb { margin-bottom: 14px; }
.mt { margin-top: 16px; }
.mt0 { margin-top: 0; }
.peq { font-size: 12px; }
.nowrap { white-space: nowrap; }
td.detalhes { max-width: 420px; word-break: break-word; font-size: 12px; }
.linha-checks { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.grupo-botoes { display: flex; gap: 6px; flex-wrap: wrap; }
.pilha { display: flex; flex-direction: column; gap: 12px; }
.previa ul { margin: 4px 0 0; padding-left: 18px; }

/* ---------- Módulo comercial ---------- */
.titulo-secao { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); margin: 22px 0 10px; }
.kpi .barra { min-width: 0; margin-top: 8px; }
.barra .preench.cheia { background: var(--ok); }

.funil-linha { display: grid; grid-template-columns: 130px 1fr auto; gap: 10px; align-items: center; padding: 6px 0; }
.funil-linha .fl-rot { font-size: 13px; color: var(--texto-2); }
.funil-linha .trilho { height: 12px; background: var(--barra-trilho); border-radius: 4px; overflow: hidden; }
.funil-linha .preench { height: 100%; background: var(--barra); border-radius: 0 4px 4px 0; width: 0; }
.funil-linha .fl-v { font-variant-numeric: tabular-nums; font-size: 13px; font-weight: 600; white-space: nowrap; }

.colunas .col .pilar-area { position: relative; flex: 1; width: 100%; display: flex; align-items: flex-end; justify-content: center; }
.colunas .col .pilar-area .pilar { height: 0; }
.marca-meta { position: absolute; left: 18%; right: 18%; height: 0; border-top: 2px dashed var(--texto-2); z-index: 1; }

.quadro { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
.coluna { background: var(--superficie-2); border: 1px solid var(--borda); border-radius: var(--raio); min-height: 220px; display: flex; flex-direction: column; }
.coluna.alvo { border-color: var(--marca); background: var(--marca-suave); }
.coluna-cab { padding: 10px 12px; border-bottom: 1px solid var(--borda); display: flex; flex-direction: column; gap: 2px; border-top: 3px solid var(--barra); border-radius: var(--raio) var(--raio) 0 0; }
.coluna-cab span { font-size: 12px; color: var(--texto-3); font-variant-numeric: tabular-nums; }
.coluna-cab.ganho { border-top-color: var(--ok); }
.coluna-cab.perdido { border-top-color: var(--texto-3); }
.coluna-corpo { padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.cartao { background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; padding: 10px; cursor: pointer; display: flex; flex-direction: column; gap: 4px; box-shadow: var(--sombra); }
.cartao:hover, .cartao:focus-visible { border-color: var(--marca); outline: none; }
.cartao[draggable="true"] { cursor: grab; }
.cartao.arrastando { opacity: .45; }
.cartao .l2 { font-size: 12px; color: var(--texto-3); }
.cartao-linha { display: flex; justify-content: space-between; gap: 8px; align-items: center; font-size: 12px; flex-wrap: wrap; }
.tag.etapa-ganho { background: var(--ok-fundo); color: var(--ok); }
.tag.etapa-perdido { background: var(--neutro-fundo); color: var(--texto-3); }
.tag.prio-alta { background: var(--critico-fundo); color: var(--critico); }
.tag.prio-media { background: var(--alerta-fundo); color: var(--alerta); }
.historico { margin: 0; padding-left: 18px; font-size: 13px; }
.historico li { padding: 2px 0; }
.entrada-meta { max-width: 150px; }
td select { width: auto; }

.grade-cartoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.cartao-script { display: flex; flex-direction: column; gap: 8px; }
.cartao-script .card-cab { margin-bottom: 0; align-items: flex-start; }
.cartao-script h3 { margin: 0; font-size: 14px; }
.cartao-script.inativo { opacity: .6; }
.previa-texto { margin: 0; font-size: 13px; white-space: pre-line; flex: 1; }
.caixa-previa { background: var(--superficie-2); border: 1px solid var(--borda); border-radius: 8px; padding: 12px 14px; }
.texto-rico { line-height: 1.6; }
.texto-rico h3 { font-size: 15px; margin: 16px 0 6px; }
.texto-rico h3:first-child { margin-top: 0; }
.texto-rico p { margin: 0 0 8px; }
.texto-rico ol, .texto-rico ul { margin: 0 0 10px; padding-left: 22px; }
.texto-rico li { margin: 3px 0; }
.texto-rico mark { background: var(--alerta-fundo); color: var(--texto); border-radius: 3px; padding: 0 2px; }
textarea.editor { font: 13px/1.5 ui-monospace, Consolas, monospace; }
.secao-historico { margin-top: 18px; border-top: 1px solid var(--borda); padding-top: 10px; font-size: 13px; }
.secao-historico h3 { font-size: 13px; margin: 0 0 6px; }
.fora-da-tela { position: fixed; left: -9999px; top: 0; }
@media (max-width: 640px) { .funil-linha { grid-template-columns: 96px 1fr auto; } }

/* Impressão de POP (somente o conteúdo do modal) */
@media print {
  body.imprimir-modal #app, body.imprimir-modal #avisos { display: none !important; }
  body.imprimir-modal .modal-fundo { position: static; background: none; padding: 0; overflow: visible; display: block; }
  body.imprimir-modal .modal { box-shadow: none; border: 0; max-width: none; }
  body.imprimir-modal .modal header button, body.imprimir-modal .modal footer, body.imprimir-modal .secao-historico { display: none; }
  body.imprimir-modal .modal-corpo { max-height: none; overflow: visible; }
}

/* ---------- Painel principal ---------- */
:root { --serie-1: #2a78d6; --serie-2: #eb6834; --serie-3: #1baf7a; --serie-4: #eda100; --serie-5: #e87ba4; --serie-6: #008300; --serie-7: #4a3aa7; --serie-8: #e34948; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --serie-1: #3987e5; --serie-2: #d95926; --serie-3: #199e70; --serie-4: #c98500; --serie-5: #d55181; --serie-6: #008300; --serie-7: #9085e9; --serie-8: #e66767; }
}
:root[data-theme="dark"] { --serie-1: #3987e5; --serie-2: #d95926; --serie-3: #199e70; --serie-4: #c98500; --serie-5: #d55181; --serie-6: #008300; --serie-7: #9085e9; --serie-8: #e66767; }

.cab-painel { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.cab-painel .botoes { display: flex; gap: 8px; flex-wrap: wrap; }
.btn .ico { width: 16px; height: 16px; }
.kpis-painel { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1250px) { .kpis-painel { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); } }
.indicador { display: flex; flex-direction: column; gap: 4px; }
.indicador .ind-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.indicador .rot { text-transform: uppercase; font-size: 11px; letter-spacing: .06em; font-weight: 600; }
.indicador .ind-ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: var(--marca-suave); color: var(--marca); flex: none; }
.indicador .ind-ico .ico { width: 18px; height: 18px; }
.indicador.ok .ind-ico { background: var(--ok-fundo); color: var(--ok); }
.indicador.alerta .ind-ico { background: var(--alerta-fundo); color: var(--alerta); }
.indicador.perigo .ind-ico { background: var(--critico-fundo); color: var(--critico); }
.indicador.sla .val { color: var(--ok); }
.indicador .barra { min-width: 0; }
.indicador.sla .preench { background: var(--ok); }
.indicador.perigo .det { color: var(--critico); }

.grid-painel { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 16px; margin-top: 16px; }
.grid-painel + .card { margin-top: 16px; }
@media (max-width: 1100px) { .grid-painel { grid-template-columns: 1fr; } }
.ico-titulo { width: 18px; height: 18px; vertical-align: -3px; color: var(--marca); margin-right: 4px; }

.urgencias { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.urg { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto 34px; gap: 14px; align-items: center; padding: 10px 12px;
  border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie-2); border-left: 3px solid var(--barra); }
.urg.vencida { border-left-color: var(--critico); background: var(--critico-fundo); }
.urg.vence_hoje { border-left-color: var(--serio); }
.urg.meta_vencida { border-left-color: var(--alerta); }
.urg .tag.dep { background: var(--critico-fundo); color: var(--critico); font-size: 10px; letter-spacing: .04em; }
.urg:not(.vencida) .tag.dep { background: var(--marca-suave); color: var(--marca); }
.urg-txt { min-width: 0; }
.urg-txt strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.urg-dado { text-align: right; font-size: 13px; }
.urg-dado .l2 { display: block; font-size: 11px; color: var(--texto-3); }
.urg-txt .l2 { display: block; font-size: 12px; color: var(--texto-3); }
.urg.vencida .urg-dado strong.num { color: var(--critico); }
.btn-ico { width: 34px; height: 34px; border-radius: 8px; border: 0; display: grid; place-items: center; cursor: pointer; background: var(--marca); color: #fff; }
.urg.vencida .btn-ico { background: var(--critico); }
.btn-ico .ico { width: 16px; height: 16px; }
.btn-ico:hover { filter: brightness(1.1); }
@media (max-width: 640px) {
  .urg { grid-template-columns: minmax(0, 1fr) 34px; }
  .urg .tag.dep { justify-self: start; grid-column: 1 / -1; }
  .urg-dado { text-align: left; }
}

.regime { padding: 8px 0; }
.regime-topo { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; margin-bottom: 6px; }
.regime-topo span { color: var(--texto-2); }
.regime .trilho { height: 8px; background: var(--barra-trilho); border-radius: 4px; overflow: hidden; }
.regime .preench { height: 100%; border-radius: 0 4px 4px 0; width: 0; }
.serie-1 { background: var(--serie-1); } .serie-2 { background: var(--serie-2); } .serie-3 { background: var(--serie-3); } .serie-4 { background: var(--serie-4); }
.serie-5 { background: var(--serie-5); } .serie-6 { background: var(--serie-6); } .serie-7 { background: var(--serie-7); } .serie-8 { background: var(--serie-8); }

/* =====================================================================
   Identidade visual do escritório (paleta e tipografia da marca)
   ===================================================================== */

:root {
  --fundo: #F2F2F2; --superficie: #ffffff; --superficie-2: #f7f8fa; --borda: #e1e4ec;
  --texto: #0f1b33; --texto-2: #465170; --texto-3: #737c95;
  --marca: #31427A; --marca-forte: #162D59; --marca-suave: #e8ebf5;
  --btn: #162D59; --btn-hover: #31427A;
  --barra: #31427A; --barra-trilho: #e5e8f0;
  --lateral: #162D59; --lateral-texto: #c9d1e6; --lateral-ativo: #31427A; --destaque: #3DE600;
  --ok: #0C5920; --ok-forte: #1F8C3A; --ok-fundo: #e1f1e5;
  --fonte-texto: 'Open Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fonte-titulo: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fundo: #0a1429; --superficie: #101e3d; --superficie-2: #15264b; --borda: #243a68;
    --texto: #eef2fb; --texto-2: #b7c2dd; --texto-3: #8592b4;
    --marca: #93a6e8; --marca-forte: #b8c5f1; --marca-suave: #1b2d5b;
    --btn: #31427A; --btn-hover: #3d5294;
    --barra: #7089dc; --barra-trilho: #1d2f5c;
    --lateral: #071025; --lateral-ativo: #1d2f5c;
    --ok: #3DE600; --ok-forte: #1F8C3A; --ok-fundo: #11341f;
  }
}
:root[data-theme="dark"] {
  --fundo: #0a1429; --superficie: #101e3d; --superficie-2: #15264b; --borda: #243a68;
  --texto: #eef2fb; --texto-2: #b7c2dd; --texto-3: #8592b4;
  --marca: #93a6e8; --marca-forte: #b8c5f1; --marca-suave: #1b2d5b;
  --btn: #31427A; --btn-hover: #3d5294;
  --barra: #7089dc; --barra-trilho: #1d2f5c;
  --lateral: #071025; --lateral-ativo: #1d2f5c;
  --ok: #3DE600; --ok-forte: #1F8C3A; --ok-fundo: #11341f;
}
body, input, select, textarea, button { font-family: var(--fonte-texto); }
h1, h2, h3, .logo, .kpi .val, .btn, .pilula, th, .fluxo-no { font-family: var(--fonte-titulo); }
h1 { font-weight: 700; }
.btn { background: var(--btn); border-color: var(--btn); }
.btn:hover { background: var(--btn-hover); filter: none; }
.btn.sec { background: var(--superficie); color: var(--texto); border-color: var(--borda); }
.btn.sec:hover { background: var(--superficie-2); border-color: var(--marca); }
.btn.whats { background: var(--ok-forte); border-color: var(--ok-forte); }

/* ---------- Menu lateral com ícones e contadores ---------- */
.logo span { display: flex; flex-direction: column; line-height: 1.15; }
.logo small { font: 500 11px var(--fonte-texto); opacity: .6; }
.lateral nav a .ico { width: 18px; height: 18px; flex: none; opacity: .85; }
.menu-rot { flex: 1; min-width: 0; }
.menu-badge { background: rgb(255 255 255 / .14); color: #fff; font-size: 11px; font-weight: 700; border-radius: 999px; padding: 1px 8px; font-variant-numeric: tabular-nums; }
.menu-badge.alerta { background: #d03b3b; }
.lateral nav a.ativo { background: var(--lateral-ativo); box-shadow: inset 3px 0 0 var(--destaque); }

/* ---------- Ícones, pílulas, pessoas ---------- */
.ico-h1 { width: 24px; height: 24px; vertical-align: -4px; color: var(--marca); margin-right: 4px; }
.ico-mini { width: 14px; height: 14px; vertical-align: -2px; opacity: .75; }
.pilula { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; text-decoration: none; border: 1px solid transparent; white-space: nowrap; }
.pilula .ico { width: 16px; height: 16px; }
.pilula.ok { background: var(--ok-fundo); color: var(--ok); border-color: color-mix(in srgb, var(--ok) 35%, transparent); }
.pilula.alerta { background: var(--alerta-fundo); color: var(--alerta); border-color: color-mix(in srgb, var(--alerta) 35%, transparent); }
.pilula.perigo { background: var(--critico-fundo); color: var(--critico); border-color: color-mix(in srgb, var(--critico) 35%, transparent); }
.barra-botoes { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; margin: -6px 0 12px; }
.pessoa { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.avatar { width: 28px; height: 28px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--marca-suave); color: var(--marca-forte);
  font: 700 11px var(--fonte-titulo); flex: none; }
.avatar.grande { width: 46px; height: 46px; border-radius: 12px; font-size: 16px; background: var(--btn); color: #fff; }
.tag.sigla { background: var(--marca-suave); color: var(--marca-forte); font-family: ui-monospace, Consolas, monospace; letter-spacing: .03em; }
.tag.regime { background: color-mix(in srgb, var(--rc) 14%, transparent); color: var(--texto); border: 1px solid color-mix(in srgb, var(--rc) 50%, transparent); }
.tag.regime.r-1 { --rc: var(--serie-1); } .tag.regime.r-2 { --rc: var(--serie-2); } .tag.regime.r-3 { --rc: var(--serie-3); } .tag.regime.r-4 { --rc: var(--serie-4); }
.tag.regime.r-5 { --rc: var(--serie-5); } .tag.regime.r-6 { --rc: var(--serie-6); } .tag.regime.r-7 { --rc: var(--serie-7); } .tag.regime.r-8 { --rc: var(--serie-8); }
.tag.todos-regimes { background: transparent; border: 1px solid var(--texto-3); color: var(--texto); }
td .l2 .tag { font-size: 10px; padding: 0 6px; margin-left: 4px; }
.btn-ico.sec { background: var(--superficie); color: var(--texto-2); border: 1px solid var(--borda); }
.btn-ico.sec:hover { border-color: var(--marca); color: var(--marca); filter: none; }

/* ---------- Comprovantes ---------- */
.lista-anexos { list-style: none; padding: 0; margin: 0; }
.lista-anexos li { padding: 7px 0; border-bottom: 1px solid var(--borda); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.linha-anexar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.linha-anexar input { width: auto; flex: 1 1 220px; }

/* ---------- Matriz de obrigações ---------- */
.grade-obr { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.cartao-obr { display: flex; flex-direction: column; gap: 6px; }
.cartao-obr[role="button"] { cursor: pointer; }
.cartao-obr[role="button"]:hover, .cartao-obr[role="button"]:focus-visible { border-color: var(--marca); outline: none; }
.cartao-obr.inativo { opacity: .55; }
.obr-topo { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.obr-regimes { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.cartao-obr h3 { margin: 4px 0 0; font-size: 15px; }
.cartao-obr p { margin: 0; }
.obr-rodape { display: flex; justify-content: space-between; align-items: center; gap: 8px; border-top: 1px solid var(--borda); padding-top: 10px; margin-top: auto; font-size: 13px; color: var(--texto-2); }
.pilula-venc { background: var(--marca-suave); color: var(--marca-forte); font-weight: 700; border-radius: 6px; padding: 3px 10px; white-space: nowrap; }

/* ---------- Equipe ---------- */
.caixa-politica h2 { margin-bottom: 8px; }
.caixa-politica ul { margin: 0; padding-left: 20px; }
.caixa-politica li { margin: 4px 0; }
.grade-pessoas { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.cartao-pessoa { display: flex; flex-direction: column; gap: 6px; }
.cartao-pessoa.inativo { opacity: .6; }
.cp-topo { display: flex; justify-content: space-between; align-items: flex-start; }
.cartao-pessoa h3 { margin: 6px 0 0; font-size: 16px; }
.cp-linha { margin: 0; overflow-wrap: anywhere; }
.cp-registro { margin: 0; font: 600 12px ui-monospace, Consolas, monospace; color: var(--marca); }
.cp-tags { display: flex; gap: 4px; flex-wrap: wrap; }
.cp-rodape { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--borda); padding-top: 8px; margin-top: auto; font-size: 13px; }
.status-ponto::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--texto-3); margin-right: 6px; }
.status-ponto.on { color: var(--ok); font-weight: 600; }
.status-ponto.on::before { background: var(--ok); }
.tag.papel { background: var(--marca-suave); color: var(--marca-forte); }
.tag.papel.admin { background: var(--alerta-fundo); color: var(--alerta); }

/* ---------- Trilha de auditoria ---------- */
.linha-tempo { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.evento { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 14px; padding: 14px; border: 1px solid var(--borda); border-radius: 10px; background: var(--superficie-2); }
.ev-ico { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--marca-suave); color: var(--marca); }
.ev-ico .ico { width: 18px; height: 18px; }
.ev-ico.ok { background: var(--ok-fundo); color: var(--ok); }
.ev-ico.perigo { background: var(--critico-fundo); color: var(--critico); }
.ev-ico.alerta { background: var(--alerta-fundo); color: var(--alerta); }
.ev-quem { display: flex; gap: 6px; align-items: center; font-size: 13px; }
.evento p { margin: 4px 0 6px; }
.ev-acao { font: 600 11px ui-monospace, Consolas, monospace; background: var(--marca-suave); color: var(--marca-forte); padding: 2px 8px; border-radius: 5px; letter-spacing: .03em; }
.ev-quando { text-align: right; font-size: 12px; white-space: nowrap; }
.ev-quando .l2 { display: block; color: var(--texto-3); }
@media (max-width: 640px) { .evento { grid-template-columns: 38px minmax(0, 1fr); } .ev-quando { grid-column: 2; text-align: left; } }

/* ---------- Follow-up em cadência ---------- */
.cadencia { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 10px; }
.passo-cad { flex: 1 1 160px; text-align: center; padding: 8px 10px; border-radius: 8px; background: var(--ok-fundo); color: var(--ok); text-decoration: none; font-size: 13px; font-weight: 600; }
.passo-cad.ativo { background: var(--btn); color: #fff; }
.passo-cad strong { background: rgb(0 0 0 / .12); border-radius: 999px; padding: 0 7px; margin-left: 4px; }
.grade-fu { display: flex; flex-direction: column; gap: 12px; }
.fu-topo { display: flex; gap: 10px; align-items: center; }
.fu-quem { flex: 1; min-width: 0; }
.fu-quem .l2 { display: block; font-size: 12px; color: var(--texto-3); }
.fu-passo { margin: 10px 0 6px; font-size: 13px; }
.fu-msg { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.fu-msg span { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--alerta); }

/* ---------- POP em fluxograma ---------- */
.alternar-visao { display: flex; gap: 6px; margin-bottom: 14px; }
.alternar-visao .btn.ativo { background: var(--btn); color: #fff; border-color: var(--btn); }
.fluxo { display: flex; flex-direction: column; align-items: center; padding: 6px 0; }
.fluxo-no { background: var(--btn); color: #fff; font-weight: 700; padding: 8px 28px; border-radius: 999px; }
.fluxo-no.fim { background: var(--ok-forte); }
.fluxo-seta { width: 2px; height: 22px; background: var(--texto-3); position: relative; flex: none; }
.fluxo-seta::after { content: ''; position: absolute; bottom: -2px; left: -5px; border: 6px solid transparent; border-top-color: var(--texto-3); border-bottom: 0; }
.fluxo-passo { display: flex; gap: 12px; width: min(580px, 100%); background: var(--superficie); border: 1px solid var(--borda); border-left: 4px solid var(--marca); border-radius: 10px; padding: 10px 14px; box-shadow: var(--sombra); }
.fluxo-num { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--btn); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 13px; }
.fluxo-passo ul { margin: 6px 0 0; padding-left: 18px; font-size: 13px; color: var(--texto-2); }
.fluxo-passo li.decisao { list-style: none; margin-left: -18px; color: var(--alerta); font-weight: 600; }
.fluxo-secao { margin: 18px 0 2px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-3); font-weight: 700; }

/* ---------- Relatórios ---------- */
.preench.verde, .funil-linha .preench.verde { background: var(--ok-forte); }
.sub-h { font-size: 13px; margin: 0 0 8px; color: var(--texto-2); }
.grid2.sem-mt { margin-top: 0; }

/* Elementos ocultos sempre ocultos, mesmo com display definido em outra regra */
[hidden] { display: none !important; }

/* =====================================================================
   Processos (Kanban) e Guia de legalização
   ===================================================================== */
.tag.pontual { background: var(--alerta-fundo); color: var(--alerta); font-family: ui-monospace, Consolas, monospace; }
.tag.prio-urgente { background: var(--critico); color: #fff; }
.abas-setor { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.abas-setor a { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--borda); background: var(--superficie); color: var(--texto-2); text-decoration: none; font-size: 13px; font-weight: 600; }
.abas-setor a.ativo { background: var(--btn); border-color: var(--btn); color: #fff; }
fieldset.sem-borda { border: 0; padding: 0; margin: 0; min-width: 0; }
.adv-anexos ul { list-style: none; padding: 0; margin: 0; }
.adv-anexos li { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--borda); }
.adv-anexo-envio { align-items: center; }
.adv-anexo-envio select { width: auto; }
.ct-previa { white-space: pre; overflow-x: auto; margin: 4px 0 0; padding: 8px; border: 1px solid var(--borda); border-radius: 6px; max-height: 180px; }
.cart-mini { display: flex; align-items: flex-end; gap: 2px; height: 28px; width: 132px; }
.cart-mini span { flex: 1; min-height: 2px; background: var(--btn); border-radius: 2px 2px 0 0; opacity: .85; }
.cart-tempo { list-style: none; padding: 0; margin: 0; max-height: 320px; overflow-y: auto; }
.cart-tempo li { padding: 4px 0; border-bottom: 1px solid var(--borda); }
.ok-txt { color: var(--ok, #1f7a3a); }
.alerta-txt { color: var(--critico, #b3261e); }
.abas-setor.tipos a { padding: 3px 10px; font-size: 12px; font-weight: 500; }
.abas-setor.tipos a.ativo { background: transparent; color: var(--btn); border-color: var(--btn); font-weight: 650; }
.grade-paineis { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.cartao-painel { display: flex; flex-direction: column; gap: 8px; }
.cartao-painel.inativo { opacity: .55; }
.cp-cab { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.cp-cab h3 { margin: 0; font-size: 15px; }
.cp-cab h3 a { color: var(--texto); text-decoration: none; }
.cp-cab h3 a:hover { color: var(--marca); }
.cartao-painel p { margin: 0; }
.cp-fases { display: flex; gap: 3px; flex-wrap: wrap; }
.cp-fases span { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--marca-suave); color: var(--marca-forte); }
.cp-nums { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 13px; margin-top: auto; }

.quadro-proc { grid-auto-columns: minmax(250px, 1fr); }
.cartao-proc { border-left: 3px solid var(--borda); }
.cartao-proc.prio-alta { border-left-color: var(--serio); }
.cartao-proc.prio-urgente { border-left-color: var(--critico); }
.pessoa.peq { font-size: 12px; gap: 5px; }
.pessoa.peq .avatar { width: 22px; height: 22px; font-size: 9px; }

.modal.extra-largo { max-width: 1080px; }
.proc-topo dl.info { grid-template-columns: max-content 1fr max-content 1fr; }
@media (max-width: 760px) { .proc-topo dl.info { grid-template-columns: max-content 1fr; } }
.passos { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 14px 0; }
.passo { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--borda); background: var(--superficie); color: var(--texto-2); font-weight: 700; cursor: pointer; font-family: var(--fonte-titulo, inherit); }
.passo:disabled { cursor: default; }
.passo.feito { background: var(--ok-fundo); border-color: var(--ok); color: var(--ok); }
.passo.atual { background: var(--btn); border-color: var(--btn); color: #fff; box-shadow: 0 0 0 3px var(--marca-suave); }
.passo.fim.feito { background: var(--ok-forte); border-color: var(--ok-forte); color: #fff; }
.proc-fase { border: 1px solid var(--borda); border-left: 4px solid var(--marca); border-radius: 10px; padding: 14px 16px; background: var(--superficie-2); }
.proc-fase h3 { margin: 0; font-size: 16px; }
.orientacao p { margin: 0 0 6px; }
.orientacao a { overflow-wrap: anywhere; }
.falta { color: var(--alerta); font-weight: 600; }
.checklist { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-direction: column; gap: 4px; }
.checklist li { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 6px 8px; border-radius: 8px; background: var(--superficie); border: 1px solid var(--borda); }
.checklist li .muted { margin-left: auto; }
.proc-colunas { margin-top: 16px; }
.proc-colunas h3 { font-size: 14px; margin: 0 0 8px; }
.nova-nota { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; margin-bottom: 10px; }
.notas { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; max-height: 360px; overflow-y: auto; }
.notas li { border: 1px solid var(--borda); border-radius: 8px; padding: 8px 10px; background: var(--superficie); }
.nota-cab { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.notas p { margin: 6px 0 0; font-size: 14px; }
.todas-fases { margin-top: 16px; border-top: 1px solid var(--borda); padding-top: 10px; }
.todas-fases summary { cursor: pointer; font-weight: 600; color: var(--marca); }
.fase-resumo { border-bottom: 1px dashed var(--borda); padding: 10px 0; }
.fase-resumo h4 { margin: 0 0 6px; font-size: 14px; }
.fase-resumo ul { margin: 4px 0 0; padding-left: 20px; font-size: 13px; color: var(--texto-2); }
.form-impressao { border: 1px solid var(--borda); border-radius: 10px; padding: 18px; background: #fff; color: #111; }
.form-impressao h2 { margin-top: 0; }
.fi-perg { margin: 12px 0; }
.fi-linha { border-bottom: 1px solid #999; height: 26px; }
[data-aba-painel] textarea { font: 13px/1.5 ui-monospace, Consolas, monospace; }

.grade-uf { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-top: 10px; }
.uf-cartao { display: flex; flex-direction: column; gap: 2px; padding: 10px; border-radius: 10px; border: 1px solid var(--borda); background: var(--superficie); text-decoration: none; color: var(--texto); border-top: 3px solid var(--texto-3); }
.uf-cartao strong { font: 700 18px var(--fonte-titulo, inherit); }
.uf-cartao span { font-size: 11px; color: var(--texto-2); line-height: 1.25; }
.uf-cartao.dif-baixa { border-top-color: var(--ok-forte); }
.uf-cartao.dif-media { border-top-color: var(--alerta); }
.uf-cartao.dif-alta { border-top-color: var(--critico); }
.uf-cartao.ativo, .uf-cartao:hover { border-color: var(--marca); box-shadow: 0 0 0 2px var(--marca-suave); }

@media print {
  body.imprimir-modal .alternar-visao, body.imprimir-modal [data-aba-painel]:not(:has(.form-impressao)) { display: none !important; }
  body.imprimir-modal .form-impressao { border: 0; padding: 0; }
}

/* =====================================================================
   Honorários, financeiro, licenças, propostas
   ===================================================================== */
.alerta-grande { display: flex; gap: 14px; align-items: center; padding: 14px 18px; border-radius: var(--raio); background: var(--critico-fundo); border: 1px solid color-mix(in srgb, var(--critico) 40%, transparent); color: var(--critico); text-decoration: none; }
.alerta-grande .ico { width: 28px; height: 28px; flex: none; }
.alerta-grande span { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.alerta-grande strong { display: block; font: 700 24px var(--fonte-titulo, inherit); }
.alerta-grande small { color: var(--texto-2); }
.faixas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 760px) { .faixas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.faixa { border: 1px solid var(--borda); border-radius: 8px; padding: 10px; background: var(--superficie-2); text-decoration: none; color: var(--texto); display: flex; flex-direction: column; gap: 2px; }
.faixa span { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--texto-3); }
.faixa strong { font-variant-numeric: tabular-nums; }
.faixa small { color: var(--texto-3); font-size: 12px; }
.faixa.nivel-0, .faixa.nivel-1 { border-color: var(--serio); background: var(--serio-fundo); }
.faixa.nivel-2, .faixa.nivel-3, .faixa.nivel-4 { border-color: var(--critico); background: var(--critico-fundo); }
.legenda { display: flex; gap: 14px; font-size: 12px; color: var(--texto-2); margin-bottom: 6px; }
.legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.colunas.duplas .col { justify-content: flex-end; }
.pilar-par { display: flex; gap: 3px; align-items: flex-end; height: 100%; width: 100%; justify-content: center; }
.pilar-par .pilar { width: min(20px, 40%); border-radius: 4px 4px 0 0; min-height: 2px; height: 0; }
.top-inad { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.top-inad li { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 10px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie-2); flex-wrap: wrap; }
.top-inad .l2 { display: block; font-size: 12px; color: var(--texto-3); }
.top-inad .num { text-align: right; }
td.saida { color: var(--critico); } td.entrada { color: var(--ok); }
.sugestao { display: inline-flex; margin: 4px 4px 0 0; font-size: 12px; border-style: dashed; }
.cat-lanc { max-width: 240px; }
.item-prop { display: grid; grid-template-columns: minmax(0, 1fr) 110px 130px 34px; gap: 8px; margin-bottom: 6px; }
@media (max-width: 640px) { .item-prop { grid-template-columns: 1fr 1fr; } }
.proposta { font-family: var(--fonte-texto, inherit); }
.prop-cab { display: flex; justify-content: space-between; gap: 16px; border-bottom: 3px solid #162D59; padding-bottom: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.prop-cab h2 { margin: 0 0 4px; color: #162D59; }
.prop-cab p { margin: 0; font-size: 12px; color: #444; }
.prop-num { text-align: right; display: flex; flex-direction: column; font-size: 12px; color: #444; }
.prop-num strong { color: #162D59; font-size: 14px; }
.tab-prop { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
.tab-prop td { border-bottom: 1px solid #ddd; padding: 7px 4px; color: #111; }
.tab-prop tr.total td { font-weight: 700; border-top: 2px solid #162D59; }
.proposta h3 { color: #162D59; margin: 16px 0 6px; font-size: 14px; }
.assinaturas { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 48px; font-size: 12px; color: #444; text-align: center; }
.assinaturas span { display: block; border-top: 1px solid #555; margin-bottom: 4px; }

/* ---------- Simuladores ---------- */
.grid-sim { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; margin-top: 12px; align-items: start; }
@media (max-width: 1100px) { .grid-sim { grid-template-columns: 1fr; } }
.form-sim h2, #res-sim h2 { margin-top: 0; }
.recomendacao { padding: 10px 14px; border-radius: 8px; margin: 10px 0; border: 1px solid var(--borda); }
.recomendacao.ok { background: var(--ok-fundo); color: var(--ok); border-color: color-mix(in srgb, var(--ok) 35%, transparent); }
.recomendacao.alerta { background: var(--alerta-fundo); color: var(--alerta); }
.recomendacao.serio { background: var(--serio-fundo); color: var(--serio); }
.recomendacao.critico { background: var(--critico-fundo); color: var(--critico); }
tr.linha-total td { font-weight: 700; border-top: 2px solid var(--borda); }
.regime-linha .fl-rot { min-width: 150px; }
.funil-linha.regime-linha { grid-template-columns: 190px 1fr auto; }
@media print {
  body.imprimir-pagina .lateral, body.imprimir-pagina .cab .botoes, body.imprimir-pagina .abas-setor, body.imprimir-pagina #avisos { display: none !important; }
  body.imprimir-pagina .layout { display: block; }
  body.imprimir-pagina .grid-sim { grid-template-columns: 1fr; }
  body.imprimir-pagina .card { box-shadow: none; break-inside: avoid; }
}

/* ---------- Contas contábeis (hierarquia do plano de contas) ---------- */
.prof-0 { padding-left: 0; }
.prof-1 { padding-left: 16px; }
.prof-2 { padding-left: 32px; }
.prof-3 { padding-left: 48px; }
.prof-4 { padding-left: 64px; }

/* ---------- Ferramentas de PDF ---------- */
.fila-pdf { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.fila-pdf li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 6px 8px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie-2); flex-wrap: wrap; }
.fila-pdf li.com-erro { border-color: var(--critico); }
.fila-pdf .btn-ico:disabled { opacity: .35; cursor: default; }

/* ---------- Emissão de notas ---------- */
.form-emissao .form-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.form-emissao .form-grid .largo { grid-column: span 2; }
.form-emissao h3 { margin: 18px 0 8px; font-size: 15px; color: var(--texto-2); border-bottom: 1px solid var(--borda); padding-bottom: 4px; }
.tabela-itens td { vertical-align: top; }
.tabela-itens input, .tabela-itens select { width: 100%; min-width: 70px; font: inherit; padding: 5px 7px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); margin-bottom: 4px; }
.tabela-itens td:first-child { min-width: 220px; }
.resumo-nfe { margin: 14px 0; padding: 12px 14px; border: 1px dashed var(--borda); border-radius: 10px; background: var(--superficie-2); }
.resumo-nfe:empty { display: none; }
.linha-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.linha-kpis > div { display: flex; flex-direction: column; gap: 2px; }
.rodape-form { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
@media (max-width: 640px) { .form-emissao .form-grid .largo { grid-column: auto; } }

/* ---------- Comentários e pessoas (tarefas e processos) ---------- */
.lista-pessoas { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.lista-pessoas li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.l2.iniciada { color: var(--texto-2); font-weight: 600; }
textarea.edita-nota { width: 100%; font: inherit; padding: 6px 8px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); color: var(--texto); margin: 4px 0; }
.pessoa-tag { display: inline-flex; align-items: center; gap: 4px; margin: 0 4px 4px 0; }
.pessoa-tag .link { padding: 0 2px; line-height: 1; }


/* ==========================================================================
   CENTRAL DE ATENDIMENTO - WHATSAPP WEB EM TELA CHEIA (100% FIEL AO WHATSAPP)
   ========================================================================== */
.inbox {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  height: calc(100vh - 70px) !important;
  min-height: 560px !important;
  margin: -6px 0 0 0 !important;
  border: 1px solid #d1d7db !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06) !important;
  box-sizing: border-box !important;
}

/* Coluna Esquerda: Lista de Conversas */
.inbox-lista {
  width: 360px !important;
  min-width: 320px !important;
  max-width: 380px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  border-right: 1px solid #e9edef !important;
  background: #ffffff !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
}

/* Abas de Filtros como Pílulas (Pills) do WhatsApp */
.abas-conv {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 8px 12px !important;
  background: #f0f2f5 !important;
  border-bottom: 1px solid #e9edef !important;
  flex-shrink: 0 !important;
}
.abas-conv a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 4px 10px !important;
  border-radius: 16px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #54656f !important;
  text-decoration: none !important;
  background: #ffffff !important;
  border: 1px solid #e9edef !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}
.abas-conv a:hover {
  background: #e9edef !important;
}
.abas-conv a.ativo {
  background: #d9fdd3 !important;
  border-color: #25d366 !important;
  color: #008069 !important;
  font-weight: 700 !important;
}
.abas-conv a.alerta {
  color: #b91c1c !important;
}
.abas-conv .badge {
  font-size: 10.5px !important;
  padding: 1px 6px !important;
  min-width: 16px !important;
  line-height: 15px !important;
  border-radius: 10px !important;
  background: #25d366 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}
.abas-conv .badge.vermelho {
  background: #ef4444 !important;
}

/* Campo de Busca WhatsApp */
.filtros-inbox {
  padding: 8px 12px !important;
  background: #ffffff !important;
  border-bottom: 1px solid #f0f2f5 !important;
  flex-shrink: 0 !important;
}
.filtros-inbox input {
  width: 100% !important;
  box-sizing: border-box !important;
  font: inherit !important;
  font-size: 13.5px !important;
  padding: 8px 12px !important;
  border: 1px solid #e9edef !important;
  border-radius: 8px !important;
  background: #f0f2f5 !important;
  color: #111b21 !important;
  outline: none !important;
}
.filtros-inbox input:focus {
  background: #ffffff !important;
  border-color: #00a884 !important;
  box-shadow: 0 0 0 2px rgba(0,168,132,0.15) !important;
}

/* Ações em Massa */
.conv-acoes-massa {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 6px 12px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid #e9edef !important;
  font-size: 12px !important;
  flex-shrink: 0 !important;
}

/* Lista de Conversas com Scroll */
.conv-lista {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  background: #ffffff !important;
}
.conv-linha {
  display: flex !important;
  align-items: center !important;
  border-bottom: 1px solid #f0f2f5 !important;
  transition: background 0.15s ease !important;
}
.conv-linha:hover {
  background: #f5f6f6 !important;
}
.conv-item {
  flex: 1 !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) auto !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  color: inherit !important;
  text-decoration: none !important;
  align-items: center !important;
  cursor: pointer !important;
}
.conv-item.ativo {
  background: #f0f2f5 !important;
}
.conv-item .avatar {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: #00a884 !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
}
.conv-txt {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.conv-txt strong {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #111b21 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.conv-txt .l2, .conv-ultima {
  font-size: 13px !important;
  color: #667781 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.conv-meta {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 4px !important;
  font-size: 11.5px !important;
  color: #667781 !important;
  flex-shrink: 0 !important;
}

/* Coluna Direita: O CHAT (Área da Conversa - Estilo WhatsApp Web) */
.inbox-chat {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  background: #efeae2 !important;
  position: relative !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
[data-tema="escuro"] .inbox-chat {
  background: #0b141a !important;
}

/* Cabeçalho do Chat */
.chat-cab {
  height: 60px !important;
  min-height: 60px !important;
  padding: 8px 18px !important;
  background: #f0f2f5 !important;
  border-bottom: 1px solid #d1d7db !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  z-index: 5 !important;
}
.chat-cab strong {
  font-size: 16px !important;
  color: #111b21 !important;
}
.chat-cab .l2 {
  font-size: 12px !important;
  color: #667781 !important;
}

/* Área de Mensagens (Fundo amplo de conversa) */
.chat-msgs {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 20px 32px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  background: transparent !important;
}

/* Balões de Conversa WhatsApp */
.msg {
  max-width: 65% !important;
  padding: 8px 13px !important;
  border-radius: 8px !important;
  font-size: 14.5px !important;
  line-height: 1.45 !important;
  box-shadow: 0 1px 0.5px rgba(11,20,26,.13) !important;
  border: none !important;
  position: relative !important;
  word-break: break-word !important;
  display: flex !important;
  flex-direction: column !important;
}
.msg.in {
  align-self: flex-start !important;
  background: #ffffff !important;
  color: #111b21 !important;
  border-top-left-radius: 0 !important;
}
.msg.out {
  align-self: flex-end !important;
  background: #d9fdd3 !important;
  color: #111b21 !important;
  border-top-right-radius: 0 !important;
}
[data-tema="escuro"] .msg.in {
  background: #202c33 !important;
  color: #e9edef !important;
}
[data-tema="escuro"] .msg.out {
  background: #005c4b !important;
  color: #e9edef !important;
}
.msg-quem {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #166534 !important;
  margin-bottom: 2px !important;
}
.msg-meta {
  font-size: 11px !important;
  color: #667781 !important;
  align-self: flex-end !important;
  margin-top: 3px !important;
  display: flex !important;
  align-items: center !important;
  gap: 3px !important;
}

/* Barra de Digitação Estilo WhatsApp Web */
.chat-escrever {
  background: #f0f2f5 !important;
  border-top: 1px solid #d1d7db !important;
  padding: 8px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}
[data-tema="escuro"] .chat-escrever {
  background: #202c33 !important;
}
.chat-ferramentas {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
.chat-input-row {
  display: flex !important;
  align-items: flex-end !important;
  gap: 10px !important;
}
#chat-texto {
  flex: 1 1 0 !important;
  min-height: 42px !important;
  max-height: 120px !important;
  padding: 10px 14px !important;
  font: inherit !important;
  font-size: 15px !important;
  border-radius: 8px !important;
  border: none !important;
  background: #ffffff !important;
  color: #111b21 !important;
  resize: none !important;
  box-sizing: border-box !important;
  line-height: 1.4 !important;
  outline: none !important;
}
[data-tema="escuro"] #chat-texto {
  background: #2a3942 !important;
  color: #d1d7db !important;
}
.chat-btn-enviar {
  background: #00a884 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50% !important;
  width: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  font-size: 16px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2) !important;
}
.chat-btn-enviar:hover {
  background: #06cf9c !important;
}

/* Painel Lateral de CRM/Dados do Cliente (Retrátil) */
.inbox-info {
  display: none !important;
  width: 320px !important;
  min-width: 300px !important;
  height: 100% !important;
  border-left: 1px solid #d1d7db !important;
  overflow-y: auto !important;
  background: #ffffff !important;
  padding: 14px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}
.inbox.com-info .inbox-info {
  display: flex !important;
  flex-direction: column !important;
}

/* Tela de Boas-Vindas quando Nenhuma Conversa está Aberta */
.chat-vazio-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 32px !important;
  text-align: center !important;
  background: #f0f2f5 !important;
  color: #41525d !important;
  box-sizing: border-box !important;
}
[data-tema="escuro"] .chat-vazio-container {
  background: #111b21 !important;
  color: #8696a0 !important;
}
.chat-vazio-icone {
  font-size: 64px !important;
  margin-bottom: 16px !important;
  opacity: 0.85 !important;
}
.chat-vazio-titulo {
  font-size: 24px !important;
  font-weight: 400 !important;
  color: #41525d !important;
  margin: 0 0 8px 0 !important;
}
[data-tema="escuro"] .chat-vazio-titulo {
  color: #e9edef !important;
}
.chat-vazio-sub {
  font-size: 14px !important;
  color: #667781 !important;
  max-width: 460px !important;
  line-height: 1.5 !important;
  margin: 0 0 24px 0 !important;
}

.inbox-info { padding: 12px !important; overflow-y: auto !important; }
.inbox-info h3 { font-size: 14px; margin: 0 0 8px; }
.form-contato { display: flex; flex-direction: column; gap: 8px; }
.grade-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin: 12px 0; }
.kpi.alerta .val { color: #b26a00; }
.grade-conexoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.conexao { border: 1px solid var(--borda); border-radius: 10px; padding: 12px; }
.qrcode { width: 220px; height: 220px; image-rendering: pixelated; background: #fff; padding: 6px; border-radius: 8px; display: block; margin: 8px 0; }
.grade-expediente { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.grade-expediente .dia { display: flex; align-items: center; gap: 6px; border: 1px solid var(--borda); border-radius: 8px; padding: 6px 8px; }
.grade-expediente input[type=time] { font: inherit; border: 1px solid var(--borda); border-radius: 6px; padding: 3px 5px; background: var(--superficie); color: var(--texto); }
.tabela-menu input, .tabela-menu select { width: 100%; font: inherit; padding: 5px 7px; border: 1px solid var(--borda); border-radius: 6px; background: var(--superficie); color: var(--texto); }
.tabela-menu .m-tecla { width: 56px; }
fieldset.rodizio { border: 1px solid var(--borda); border-radius: 8px; display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 8px 10px; }
@media (max-width: 1100px) { .inbox { grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); height: auto; } .inbox-info { grid-column: 1 / -1; } }
@media (max-width: 700px) { .inbox { grid-template-columns: 1fr; } .inbox-lista { max-height: 320px; } .chat-msgs { min-height: 360px; } .msg { max-width: 90%; } }

/* ---------- Criador de fluxos ---------- */
.fx { display: flex; flex-direction: column; height: calc(100vh - 110px); min-height: 560px; border: 1px solid var(--borda); border-radius: var(--raio); overflow: hidden; background: var(--superficie); }
.fx-topo { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--borda); flex-wrap: wrap; }
.fx-topo .espaco { flex: 1; }
.fx-nome { font: inherit; font-weight: 700; font-size: 16px; border: 1px solid transparent; border-radius: 6px; padding: 4px 8px; background: transparent; color: var(--texto); min-width: 160px; }
.fx-nome:hover, .fx-nome:focus { border-color: var(--borda); }
.fx-corpo { flex: 1; display: grid; grid-template-columns: 200px minmax(0, 1fr) 300px; min-height: 0; }
.fx-paleta { border-right: 1px solid var(--borda); padding: 10px; overflow-y: auto; }
.fx-paleta h4 { margin: 10px 0 6px; font-size: 12px; text-transform: uppercase; color: var(--texto-2); letter-spacing: .04em; }
.fx-blocos { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.fx-bloco { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 8px 4px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie-2); font: inherit; font-size: 11.5px; color: var(--texto); cursor: grab; text-align: center; }
.fx-bloco span { font-size: 18px; }
.fx-bloco:hover { border-color: var(--marca); }
.fx-quadro { overflow: auto; position: relative; background-color: var(--superficie-2); background-image: radial-gradient(var(--borda) 1.2px, transparent 1.2px); background-size: 22px 22px; }
.fx-plano { position: relative; width: 4000px; height: 3000px; transform-origin: 0 0; }
.fx-linhas { position: absolute; inset: 0; overflow: visible; }
.fx-lig { fill: none; stroke: #8795b5; stroke-width: 2.5; cursor: pointer; }
.fx-lig:hover, .fx-lig.sel { stroke: #1f8c3a; stroke-width: 3.5; }
.fx-lig.temp { stroke-dasharray: 6 4; pointer-events: none; }
.fx-no { position: absolute; width: 230px; background: var(--superficie); border: 1px solid var(--borda); border-left: 5px solid #8795b5; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,.08); cursor: grab; user-select: none; touch-action: none; }
.fx-no.sel { outline: 2px solid var(--marca); }
.fx-no.sim-atual { box-shadow: 0 0 0 4px rgba(31,140,58,.35); }
.fx-no.b-inicio { border-left-color: #31427A; } .fx-no.b-msg { border-left-color: #2f7de1; } .fx-no.b-int { border-left-color: #b45fd6; }
.fx-no.b-log { border-left-color: #e08a00; } .fx-no.b-acao { border-left-color: #1f8c3a; } .fx-no.b-fim { border-left-color: #c0392b; }
.fx-no-cab { display: flex; gap: 6px; align-items: center; padding: 7px 10px 4px; font-size: 13px; }
.fx-no-corpo { padding: 0 10px 8px; font-size: 12px; color: var(--texto-2); overflow-wrap: anywhere; }
.fx-entrada { position: absolute; left: -9px; top: 12px; width: 14px; height: 14px; border-radius: 50%; background: var(--superficie); border: 2px solid #8795b5; }
.fx-saidas { border-top: 1px solid var(--borda); padding: 4px 0; }
.fx-saida { display: flex; justify-content: flex-end; align-items: center; gap: 6px; padding: 3px 0 3px 10px; font-size: 11.5px; color: var(--texto-2); position: relative; min-height: 18px; }
.fx-porta { width: 14px; height: 14px; border-radius: 50%; background: #2f7de1; border: 2px solid #fff; box-shadow: 0 0 0 1px #2f7de1; margin-right: -8px; cursor: crosshair; flex: none; }
.fx-fim { padding: 4px 10px 8px; color: var(--texto-2); }
.fx-props { border-left: 1px solid var(--borda); padding: 12px; overflow-y: auto; }
.fx-props h3 { margin: 0 0 10px; font-size: 15px; }
.fx-form { display: flex; flex-direction: column; gap: 10px; }
.fx-sim { margin-top: 14px; border-top: 1px solid var(--borda); padding-top: 10px; }
.fx-sim-msgs { display: flex; flex-direction: column; gap: 6px; max-height: 340px; overflow-y: auto; background: var(--superficie-2); border-radius: 8px; padding: 8px; margin: 8px 0; }
.fx-sim-enviar { display: flex; gap: 6px; flex-wrap: wrap; }
.fx-sim-enviar input { flex: 1; min-width: 120px; font: inherit; padding: 6px 8px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); color: var(--texto); }
.cartao-fluxo h3 { margin: 0; font-size: 15px; }
.etiquetas-chat { display: flex; flex-wrap: wrap; gap: 6px; }
.etq { border: 1px solid var(--borda); border-radius: 12px; padding: 2px 9px; font-size: 12px; background: var(--superficie); color: var(--texto); cursor: pointer; font: inherit; font-size: 12px; }
.etq.on { color: #fff; border-color: transparent; }
.etq.c-azul.on { background: #2f7de1; } .etq.c-verde.on { background: #1f8c3a; } .etq.c-amarelo.on { background: #c79a00; } .etq.c-laranja.on { background: #e07000; }
.etq.c-vermelho.on { background: #c0392b; } .etq.c-roxo.on { background: #8e44ad; } .etq.c-cinza.on { background: #6b7280; }
.etq-mini { display: inline-block; border-radius: 8px; padding: 0 6px; font-size: 10.5px; color: #fff; background: #6b7280; margin: 1px 2px 0 0; }
.etq-mini.c-azul { background: #2f7de1; } .etq-mini.c-verde { background: #1f8c3a; } .etq-mini.c-amarelo { background: #c79a00; } .etq-mini.c-laranja { background: #e07000; } .etq-mini.c-vermelho { background: #c0392b; } .etq-mini.c-roxo { background: #8e44ad; }
@media (max-width: 1100px) { .fx-corpo { grid-template-columns: 170px minmax(0, 1fr); } .fx-props { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--borda); max-height: 45vh; } }

.badge.vermelho { background: #c0392b; }
.abas-conv a.alerta { color: #c0392b; }
.ativar-notif { margin: 4px 8px 0; align-self: flex-start; }

/* ---------- Metas & sonhos ---------- */
.ms { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 14px; align-items: start; }
.ms-lateral { display: flex; flex-direction: column; gap: 6px; }
.ms-lateral h4 { margin: 12px 0 2px; font-size: 12px; text-transform: uppercase; color: var(--texto-2); letter-spacing: .04em; }
.ms-item-lat { display: flex; gap: 8px; align-items: flex-start; padding: 7px 8px; border-radius: 8px; color: var(--texto); text-decoration: none; }
.ms-item-lat:hover { background: var(--superficie-2); } .ms-item-lat.ativo { background: var(--marca-suave); }
.ms-bolinha { width: 12px; height: 12px; border-radius: 50%; margin-top: 4px; flex: none; background: #6b7280; }
.c-azul.ms-bolinha { background: #2f7de1; } .c-verde.ms-bolinha { background: #1f8c3a; } .c-amarelo.ms-bolinha { background: #c79a00; } .c-laranja.ms-bolinha { background: #e07000; }
.c-vermelho.ms-bolinha { background: #c0392b; } .c-roxo.ms-bolinha { background: #8e44ad; }
.ms-cab { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 5px solid #6b7280; }
.ms-cab h2 { margin: 0 0 4px; }
.ms-cab.c-azul { border-top-color: #2f7de1; } .ms-cab.c-verde { border-top-color: #1f8c3a; } .ms-cab.c-amarelo { border-top-color: #c79a00; } .ms-cab.c-laranja { border-top-color: #e07000; }
.ms-cab.c-vermelho { border-top-color: #c0392b; } .ms-cab.c-roxo { border-top-color: #8e44ad; }
.ms-kpis { margin: 12px 0; }
.ms-filtro { margin-bottom: 10px; }
.ms-colunas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ms-coluna { background: var(--superficie-2); border: 1px solid var(--borda); border-radius: 12px; padding: 10px; min-height: 240px; }
.ms-coluna.alvo { outline: 2px dashed var(--marca); }
.ms-coluna-cab { display: flex; justify-content: space-between; align-items: center; }
.ms-dica { margin: 2px 0 8px; }
.ms-cartoes { display: flex; flex-direction: column; gap: 8px; }
.ms-cartao { background: var(--superficie); border: 1px solid var(--borda); border-radius: 10px; padding: 10px; cursor: pointer; display: flex; flex-direction: column; gap: 6px; box-shadow: var(--sombra); }
.ms-cartao:hover { border-color: var(--marca); } .ms-cartao.arrastando { opacity: .5; } .ms-cartao.pausado { opacity: .65; }
.ms-cartao-cab { display: flex; gap: 8px; align-items: flex-start; }
.ms-icone { font-size: 20px; line-height: 1; }
.ms-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.ms-icones { display: flex; flex-wrap: wrap; gap: 4px; }
.ms-icones label { cursor: pointer; } .ms-icones input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ms-icones span { display: inline-block; font-size: 20px; padding: 4px 6px; border: 1px solid var(--borda); border-radius: 8px; }
.ms-icones input:checked + span { border-color: var(--marca); background: var(--marca-suave); }
.ms-icones input:focus-visible + span { outline: 2px solid var(--marca); }
.ms-range { width: 100%; }
.ms-vazio { text-align: center; padding: 40px 20px; }
.btn.ok { background: #1f8c3a; border-color: #1f8c3a; }
.ms-confete { position: fixed; inset: 0; pointer-events: none; z-index: 9999; overflow: hidden; }
.ms-confete span { position: absolute; top: -40px; font-size: 26px; animation: ms-cair 2.6s ease-in forwards; }
@keyframes ms-cair { to { transform: translateY(110vh) rotate(540deg); opacity: .2; } }
@media (prefers-reduced-motion: reduce) { .ms-confete { display: none; } }
@media (max-width: 1000px) { .ms { grid-template-columns: 1fr; } .ms-colunas { grid-template-columns: 1fr; } }
.ms-item-lat > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.mei-frame { width: 100%; height: calc(100vh - 200px); min-height: 640px; border: 1px solid var(--borda); border-radius: var(--raio); background: #fff; }

/* Lembretes (cor pela prioridade: baixa verde, média amarela, alta vermelha) */
.grade-lembretes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.lembrete { --cor: var(--alerta); --fundo: var(--alerta-fundo); background: var(--fundo); border: 1px solid var(--cor); border-left: 6px solid var(--cor); border-radius: var(--raio); padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; box-shadow: var(--sombra); min-width: 0; }
.lembrete.prio-baixa { --cor: var(--ok); --fundo: var(--ok-fundo); }
.lembrete.prio-alta { --cor: var(--critico); --fundo: var(--critico-fundo); }
.lembrete header { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.lembrete .tag.prio { background: var(--cor); color: var(--superficie); text-transform: uppercase; letter-spacing: .03em; }
.lembrete h3 { margin: 0; font-size: 16px; overflow-wrap: anywhere; }
.lembrete .empresa { margin: 0; font-size: 13px; color: var(--texto-2); display: flex; gap: 6px; align-items: center; }
.lembrete .empresa svg { width: 14px; height: 14px; }
.lembrete .desc { margin: 0; font-size: 13px; color: var(--texto-2); white-space: pre-wrap; overflow-wrap: anywhere; }
.lembrete dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 13px; }
.lembrete dt { color: var(--texto-3); font-size: 11px; text-transform: uppercase; letter-spacing: .03em; }
.lembrete dd { margin: 0; font-weight: 600; }
.lembrete footer { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; padding-top: 4px; }
.lembrete.concluido { opacity: .6; }
.lembrete.concluido h3 { text-decoration: line-through; }

/* ---- Emissão: painel de documentos (visão por modelo, evolução mensal, certificados, últimas capturas) ---- */
.grade-modelos { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.modelo-card { margin: 0; display: flex; flex-direction: column; gap: 2px; border-top: 4px solid var(--serie-1); }
.modelo-card.m2 { border-top-color: var(--serie-2); } .modelo-card.m3 { border-top-color: var(--serie-3); } .modelo-card.m4 { border-top-color: var(--serie-4); }
.modelo-card .val { font-size: 26px; font-weight: 700; color: var(--texto); }
.grade-painel { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.grade-painel > .card { margin: 0; }
@media (max-width: 1100px) { .grade-painel { grid-template-columns: 1fr; } }
.evo-legenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--texto-2); margin-bottom: 8px; }
.evo-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.evo-legenda i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.evo-grafico { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; height: 180px; align-items: end; border-bottom: 1px solid var(--borda); padding-top: 8px; }
.evo-col { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; outline: none; }
.evo-pilha { display: flex; flex-direction: column-reverse; gap: 2px; min-height: 0; max-width: 28px; width: 100%; margin: 0 auto; }
.evo-seg { background: var(--serie-1); min-height: 2px; }
.evo-pilha .evo-seg:last-child { border-radius: 4px 4px 0 0; }
.evo-seg.s2 { background: var(--serie-2); } .evo-seg.s3 { background: var(--serie-3); } .evo-seg.s4 { background: var(--serie-4); }
.evo-rot { position: absolute; bottom: -20px; left: 0; right: 0; text-align: center; font-size: 11px; color: var(--texto-3); }
.evo-rot.atual { color: var(--texto); font-weight: 700; }
.evo-grafico { margin-bottom: 24px; }
.evo-dica { display: none; position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); z-index: 5; background: var(--superficie); color: var(--texto);
  border: 1px solid var(--borda); border-radius: 8px; padding: 6px 10px; font-size: 12px; white-space: nowrap; box-shadow: var(--sombra); }
.evo-col:hover .evo-dica, .evo-col:focus .evo-dica { display: block; }
.evo-col:hover .evo-pilha, .evo-col:focus .evo-pilha { filter: brightness(1.08); }
.cert-cont { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cert-cont div { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: var(--superficie-2); border-radius: 8px; padding: 8px 10px; }
.cert-cont strong { font-size: 20px; }
.lista-ultimas { list-style: none; margin: 0; padding: 0; }
.lista-ultimas li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--borda); }
.lista-ultimas li:last-child { border-bottom: 0; }
.alerta-competencia { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ---------- Relatório de retenções (Emissão) ---------- */
/* compacta: cabe na tela sem arrastar — números numa linha só; nomes, códigos e descrições quebram */
.tabela-ret, .relatorio-ret .tabela-resumo { font-size: 13px; }
.tabela-ret th, .tabela-ret td, .relatorio-ret .tabela-resumo th, .relatorio-ret .tabela-resumo td { padding: 7px 4px; }
.tabela-ret th, .relatorio-ret .tabela-resumo th { font-size: 11px; white-space: normal; letter-spacing: .02em; }
.tabela-ret td.n, .relatorio-ret .tabela-resumo td.n { white-space: nowrap; }
.tabela-ret td:not(.n), .relatorio-ret .tabela-resumo td:not(.n) { white-space: normal; overflow-wrap: anywhere; }
.tabela-ret td:nth-child(1), .tabela-ret td:nth-child(3), .tabela-ret td:nth-child(5) { min-width: 110px; }
.tabela-prod td:nth-child(5) { min-width: 0; }
.tabela-ret td .pilula.peq { font-size: 10px; padding: 0 6px; margin-top: 3px; display: inline-block; }
.tabela-ret td .l2, .relatorio-ret .tabela-resumo td .l2 { font-size: 11px; }
.tabela-ret tfoot th { border-top: 2px solid var(--borda); }
@media print {
  body.imprimir-pagina .nao-imprimir, body.imprimir-pagina:has(.relatorio-ret) .cab { display: none !important; }
  body.imprimir-pagina .relatorio-ret .tabela-wrap { overflow: visible; margin: 0; padding: 0; }
  body.imprimir-pagina .tabela-ret { font-size: 9px; }
  body.imprimir-pagina .relatorio-ret details { display: block; }
}
.relatorio-ret .nav-comp { align-items: center; gap: 6px; }
.relatorio-ret .nav-comp a.btn-ico { text-decoration: none; font-size: 1.2rem; line-height: 1; }
.relatorio-ret .nav-comp input[type=month] { margin-left: 4px; }

/* ---------- Alíquota efetiva do Simples (Emissão) ---------- */
.calc-simples .sn-receitas select { min-width: 260px; }
.calc-simples .sn-receitas input { max-width: 180px; }
.calc-simples .nav-comp-sn { display: flex; gap: 6px; align-items: center; }
.calc-simples .nav-comp-sn a.btn-ico { text-decoration: none; font-size: 1.2rem; line-height: 1; }
.calc-simples .sn-folha input { max-width: 170px; }
.calc-simples .sn-folha tr.fora-base td { opacity: .55; }
.alerta-txt { color: var(--alerta, #b45309); font-weight: 600; }

/* ---------- Menu lateral recolhido (só ícones) ---------- */
.menu-recolher { margin-left: auto; background: rgb(255 255 255 / .08); border: 0; color: var(--lateral-texto); width: 26px; height: 26px; border-radius: 6px; cursor: pointer; font-size: 15px; line-height: 1; flex: none; }
.menu-recolher:hover { background: rgb(255 255 255 / .16); color: #fff; }
@media (min-width: 861px) {
  body.menu-recolhido .layout { grid-template-columns: 64px 1fr; }
  body.menu-recolhido .lateral { padding: 18px 8px; }
  body.menu-recolhido .logo { flex-direction: column; padding: 4px 0 14px; gap: 8px; }
  body.menu-recolhido .logo span, body.menu-recolhido .lateral .grupo, body.menu-recolhido .menu-rot,
  body.menu-recolhido .lateral .rodape strong, body.menu-recolhido .lateral .rodape .perfil { display: none; }
  body.menu-recolhido .menu-recolher { margin-left: 0; }
  body.menu-recolhido .lateral nav a { justify-content: center; padding: 10px 0; position: relative; }
  body.menu-recolhido .lateral nav a .menu-badge { position: absolute; top: 2px; right: 4px; }
  body.menu-recolhido .lateral .rodape { padding: 8px 0; text-align: center; }
  body.menu-recolhido .lateral .rodape .acoes { display: flex; flex-direction: column; gap: 6px; font-size: 11px; }
}
@media (max-width: 860px) { .menu-recolher { display: none; } }
.tabela-ret td:nth-child(2) { white-space: nowrap; overflow-wrap: normal; }
/* relatório de retenções / notas de produtos: valores grandes cabem no cartão; colunas curtas sem quebra */
.relatorio-ret .kpi .val { font-size: clamp(18px, 1.6vw, 26px); white-space: nowrap; }
.relatorio-ret .tabela-resumo td.nw { white-space: nowrap; overflow-wrap: normal; }
/* faturamento: o total em destaque */
.relatorio-fat .kpi-destaque { border-color: var(--marca); border-width: 2px; }
/* quadros do início dos relatórios: vermelho (retenções e tributação especial) e amarelo (faturamento) */
.quadros-topo { display: grid; gap: 12px; margin-bottom: 16px; }
.quadro-cor { border-radius: var(--raio); border: 2px solid; padding: 12px 14px; margin: 0; }
.quadro-vermelho { background: var(--critico-fundo); border-color: var(--critico); }
.quadro-amarelo { background: var(--alerta-fundo); border-color: var(--alerta); }
.quadro-ok { background: var(--ok-fundo); border-color: var(--ok); border-width: 1px; color: var(--texto); }
.qc-titulo { font-weight: 650; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.quadro-vermelho .qc-titulo { color: var(--critico); }
.quadro-amarelo .qc-titulo { color: var(--alerta); }
.qc-titulo a { margin-left: auto; font-weight: 500; }
.qc-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.qc-fat { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.qc-item { display: flex; flex-direction: column; gap: 3px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; padding: 10px 12px; color: var(--texto); text-decoration: none; }
a.qc-item:hover { border-color: var(--critico); }
.qc-rot { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--texto-2); }
.qc-val { font-family: var(--fonte-titulo); font-size: 22px; font-variant-numeric: tabular-nums; }
.qc-det { display: flex; flex-wrap: wrap; gap: 2px 10px; font-size: 13px; }
.qc-det b { font-variant-numeric: tabular-nums; }
.qc-pe { font-size: 12px; color: var(--texto-3); }
.qc-total { border: 2px solid var(--alerta); }
@media (max-width: 720px) { .qc-fat { grid-template-columns: 1fr; } }
@media print { .quadro-cor { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
.qc-titulo svg { width: 18px; height: 18px; flex: none; }
/* quadro pequeno da alíquota efetiva do Simples */
.quadro-simples { background: var(--marca-suave); border-color: var(--marca); }
.quadro-simples .qc-titulo { color: var(--marca-forte, var(--marca)); }
.snm-grade { display: grid; grid-template-columns: 190px minmax(0, 1fr) 190px; gap: 12px; align-items: start; }
.snm-rbt, .snm-res { background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.snm-rbt label { display: flex; flex-direction: column; gap: 4px; }
.snm-rbt input { font-size: 17px; font-variant-numeric: tabular-nums; width: 100%; }
.snm-receitas { background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; padding: 6px 10px 10px; min-width: 0; }
.snm-tab { font-size: 13px; }
.snm-tab td, .snm-tab th { padding: 5px 6px; }
.snm-tab { width: 100%; }
.snm-tab select { width: 100%; min-width: 150px; }
.snm-tab input { width: 110px; }
.snm-tab td.n { white-space: nowrap; }
.snm-res > div { display: flex; flex-direction: column; }
.snm-res .qc-val { font-size: 19px; }
#snm-avisos { margin-top: 8px; }
@media (max-width: 1100px) { .snm-grade { grid-template-columns: 1fr; } }
/* aviso pequeno de notas canceladas/faltantes (depois dos cartões do relatório) */
.quadro-controle { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0 0; padding: 6px 10px; border: 1px solid var(--serio); border-left-width: 4px; border-radius: 6px; background: var(--serio-fundo); color: var(--texto); line-height: 1.45; }
.quadro-controle svg { width: 15px; height: 15px; flex: none; color: var(--serio); margin-top: 2px; }
.quadro-controle > div > div + div { margin-top: 2px; }
/* botões de apagar: discretos, sempre os últimos da fileira */
.btn-apagar-mini { display: inline-flex; align-items: center; gap: 3px; height: 22px; min-width: 22px; padding: 0 4px; margin-left: 4px; border: 1px solid transparent; border-radius: 5px;
  background: transparent; color: var(--texto-3); font-size: 11px; cursor: pointer; opacity: .75; }
.btn-apagar-mini .ico { width: 13px; height: 13px; }
.btn-apagar-mini:hover, .btn-apagar-mini:focus-visible { color: var(--critico); border-color: var(--critico); background: var(--critico-fundo); opacity: 1; }
/* ===== Checklist — caderno de lembranças ===== */
.caderno { background: repeating-linear-gradient(var(--superficie) 0 33px, var(--borda) 33px 34px); border-left: 3px solid var(--critico); padding-left: 22px; }
.ck-novo { display: flex; gap: 8px; align-items: flex-end; }
.ck-novo textarea { flex: 1; resize: none; min-height: 40px; font-size: 15px; line-height: 1.4; padding: 9px 10px; border-radius: 8px; }
.ck-resumo { margin: 10px 0 4px; }
.ck-lista { list-style: none; margin: 0; padding: 0; }
.ck-item { display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 3px 2px; transition: opacity .25s; }
.ck-item .ck-texto { flex: 1; font-size: 15px; white-space: pre-wrap; overflow-wrap: anywhere; cursor: text; }
.ck-item .ck-meta, .ck-hist .ck-meta { font-size: 11px; color: var(--texto-3); white-space: nowrap; }
.ck-item.feito { opacity: .35; }
.ck-item.feito .ck-texto { text-decoration: line-through; }
.ck-item.feito:hover { opacity: .7; }
.ck-check { position: relative; display: inline-grid; place-items: center; width: 20px; height: 20px; flex: none; cursor: pointer; }
.ck-check input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.ck-check span { width: 18px; height: 18px; border: 2px solid var(--texto-2); border-radius: 4px; display: grid; place-items: center; background: var(--superficie); }
.ck-check input:checked + span { background: var(--ok); border-color: var(--ok); }
.ck-check input:checked + span::after { content: ''; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.ck-check input:focus-visible + span { outline: 2px solid var(--marca); outline-offset: 2px; }
.ck-dia h3 { font-size: 13px; margin: 14px 0 4px; color: var(--texto-2); }
.ck-hist { list-style: none; margin: 0; padding: 0; }
.ck-hist li { padding: 5px 0; border-bottom: 1px dashed var(--borda); font-size: 14px; }
.ck-hist li .ck-meta { margin-left: 6px; }
.ck-periodo { margin-bottom: 8px; }
kbd { font: 11px/1 monospace; padding: 2px 5px; border: 1px solid var(--borda); border-bottom-width: 2px; border-radius: 4px; background: var(--superficie); }
/* botão flutuante, painel rápido e balão das 15h */
#ck-flutuante { position: fixed; right: 18px; bottom: 18px; z-index: 900; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.ck-botao { position: relative; width: 52px; height: 52px; border-radius: 50%; border: 0; font-size: 24px; cursor: pointer; background: var(--marca); color: #fff; box-shadow: 0 4px 14px rgb(0 0 0 / .25); }
.ck-botao:hover { filter: brightness(1.08); }
.ck-qtd { position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--critico); color: #fff; font-size: 11px; font-weight: 700; line-height: 20px; }
.ck-painel { width: min(360px, calc(100vw - 36px)); max-height: min(70vh, 520px); overflow: auto; padding: 12px; border-radius: 12px; background: var(--superficie); border: 1px solid var(--borda); box-shadow: 0 10px 30px rgb(0 0 0 / .25); }
.ck-painel .ck-novo textarea { font-size: 14px; }
.ck-lista.compacta { margin: 8px 0; }
.ck-lista.compacta .ck-item { min-height: 28px; }
.ck-lista.compacta .ck-texto { font-size: 13.5px; cursor: default; }
.ck-balao { position: relative; display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 22px; border: 2px solid var(--alerta); background: var(--alerta-fundo); color: var(--texto); font-size: 20px; cursor: pointer;
  box-shadow: 0 6px 18px rgb(0 0 0 / .2); animation: ck-flutuar 2.4s ease-in-out infinite; }
.ck-balao-txt { font-size: 13px; font-weight: 600; }
.ck-bolhas i { position: absolute; border-radius: 50%; background: var(--alerta-fundo); border: 2px solid var(--alerta); }
.ck-bolhas i:first-child { width: 12px; height: 12px; right: 18px; bottom: -14px; }
.ck-bolhas i:last-child { width: 7px; height: 7px; right: 12px; bottom: -24px; }
@keyframes ck-flutuar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@media (prefers-reduced-motion: reduce) { .ck-balao { animation: none; } }
@media print { #ck-flutuante { display: none; } }

/* Checklist: cada anotação é um post-it de cor bem clara */
.ck-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; margin-top: 12px; align-items: start; }
.ck-lista.compacta { grid-template-columns: 1fr; gap: 8px; }
.ck-lista > li:not(.ck-item) { grid-column: 1 / -1; }
.ck-item { --pi: #fff7b8; display: grid; grid-template-columns: 22px 1fr auto; column-gap: 8px; row-gap: 6px; align-items: start; min-height: 96px; padding: 12px 12px 8px;
  background: var(--pi); color: #3a372b; border-radius: 3px 3px 12px 3px; box-shadow: 0 2px 6px rgb(0 0 0 / .14), 0 1px 0 rgb(255 255 255 / .6) inset; }
.ck-lista.compacta .ck-item { min-height: 0; padding: 8px 10px 6px; }
.ck-item .ck-check { grid-column: 1; grid-row: 1; margin-top: 2px; }
.ck-item .ck-texto { grid-column: 2 / 4; grid-row: 1; font-size: 14.5px; line-height: 1.4; color: inherit; }
.ck-item .ck-meta { grid-column: 2; grid-row: 2; align-self: end; color: #7a7664; }
.ck-item .btn-apagar-mini { grid-column: 3; grid-row: 2; align-self: end; opacity: .55; }
.ck-item:hover .btn-apagar-mini { opacity: 1; }
.ck-check span { background: #fff; border-color: #6d6a58; }
.ck-cor-amarelo { --pi: #fff7b8; } .ck-cor-rosa { --pi: #ffdfe8; } .ck-cor-verde { --pi: #dff5d2; } .ck-cor-azul { --pi: #d9ecff; }
.ck-cor-lilas { --pi: #ebe0ff; } .ck-cor-laranja { --pi: #ffe6c9; } .ck-cor-menta { --pi: #d3f5ec; }

/* Aviso vermelho de retenção/tributação especial: mais compacto e fino */
.quadro-vermelho { border-width: 1px; padding: 6px 10px; }
.quadro-vermelho .qc-titulo { font-size: 13px; font-weight: 600; gap: 6px; margin-bottom: 6px; }
.quadro-vermelho .qc-titulo svg { width: 15px; height: 15px; }
.quadro-vermelho .qc-grade { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px; }
.quadro-vermelho .qc-item { padding: 5px 9px; gap: 1px; border-radius: 6px; }
.quadro-vermelho .qc-rot { font-size: 10.5px; }
.quadro-vermelho .qc-val { font-size: 16px; }
.quadro-vermelho .qc-det { font-size: 11.5px; }
.quadro-vermelho .qc-pe { font-size: 10.5px; }

/* Linha do relatório de retenções que precisa de conferência no PDF da nota */
tr.linha-conferir > td { background: #fff6c7; }

/* Bate-papo interno */
.chat { display: grid; grid-template-columns: 280px 1fr; padding: 0; overflow: hidden; height: min(72vh, 640px); min-height: 380px; }
.chat-lista { border-right: 1px solid var(--borda); overflow: auto; background: var(--superficie-2); }
.chat-conv { display: flex; align-items: center; gap: 10px; padding: 10px 12px; text-decoration: none; color: var(--texto); border-bottom: 1px solid var(--borda); }
.chat-conv:hover { background: color-mix(in srgb, var(--marca) 8%, transparent); }
.chat-conv.ativo { background: color-mix(in srgb, var(--marca) 16%, transparent); }
.chat-av { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--marca); color: #fff; font-size: 12px; font-weight: 700; }
.chat-conv-txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.chat-conv-txt strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-conv-txt small { font-size: 12px; color: var(--texto-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-conv-meta { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.chat-conv-data { font-size: 11px; color: var(--texto-3); white-space: nowrap; }
.chat-qtd { flex: none; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--critico); color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.chat-painel { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.chat-topo { padding: 10px 14px; border-bottom: 1px solid var(--borda); }
.chat-mensagens { flex: 1; overflow: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; background: var(--superficie); }
.chat-msg { align-self: flex-start; max-width: min(70%, 520px); background: var(--superficie-2); border: 1px solid var(--borda); border-radius: 12px 12px 12px 3px; padding: 6px 10px 4px; }
.chat-msg.minha { align-self: flex-end; background: color-mix(in srgb, var(--marca) 16%, var(--superficie)); border-radius: 12px 12px 3px 12px; }
.chat-autor { display: block; font-size: 11.5px; font-weight: 700; color: var(--marca-forte, var(--marca)); }
.chat-texto { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14.5px; line-height: 1.4; }
.chat-hora { display: block; text-align: right; font-size: 10.5px; color: var(--texto-3); }
.chat-dia { align-self: center; margin: 6px 0; }
.chat-dia span { font-size: 11.5px; color: var(--texto-3); background: var(--superficie-2); border: 1px solid var(--borda); border-radius: 10px; padding: 1px 10px; }
.chat-envio { display: flex; gap: 8px; align-items: flex-end; padding: 10px 12px; border-top: 1px solid var(--borda); }
.chat-envio textarea { flex: 1; resize: none; min-height: 40px; max-height: 140px; font-size: 14.5px; line-height: 1.4; padding: 9px 10px; border-radius: 8px; }
@media (max-width: 760px) { .chat { grid-template-columns: 1fr; height: auto; } .chat-lista { max-height: 180px; border-right: 0; border-bottom: 1px solid var(--borda); } .chat-mensagens { height: 50vh; } }

/* Balão do bate-papo: aparece com mensagem não lida e some ao ler (ao lado do botão do checklist) */
.chat-balao { position: fixed; right: 84px; bottom: 22px; z-index: 900; display: flex; align-items: center; gap: 8px; max-width: min(340px, calc(100vw - 110px)); padding: 8px 14px; border-radius: 22px;
  border: 2px solid var(--marca); background: color-mix(in srgb, var(--marca) 12%, var(--superficie)); color: var(--texto); text-decoration: none; cursor: pointer;
  box-shadow: 0 6px 18px rgb(0 0 0 / .2); animation: ck-flutuar 2.4s ease-in-out infinite; }
.chat-balao[hidden] { display: none; }
.chat-balao-ico { font-size: 20px; flex: none; }
.chat-balao-txt { display: flex; flex-direction: column; min-width: 0; font-size: 13px; }
.chat-balao-txt small { font-size: 11.5px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-bolhas i { position: absolute; border-radius: 50%; background: color-mix(in srgb, var(--marca) 12%, var(--superficie)); border: 2px solid var(--marca); }
.chat-bolhas i:first-child { width: 12px; height: 12px; right: 18px; bottom: -14px; }
.chat-bolhas i:last-child { width: 7px; height: 7px; right: 12px; bottom: -24px; }
@media (prefers-reduced-motion: reduce) { .chat-balao { animation: none; } }
@media print { .chat-balao { display: none; } }

/* Área de soltar arquivos (importação de extratos) */
.soltar { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-top: 12px; padding: 22px 14px; border: 2px dashed var(--borda); border-radius: 12px; background: var(--superficie-2); cursor: pointer; text-align: center; }
.soltar span { font-size: 13px; color: var(--texto-3); }
.soltar:hover, .soltar:focus-visible, .soltar.sobre { border-color: var(--marca); background: color-mix(in srgb, var(--marca) 8%, var(--superficie-2)); outline: 0; }
.soltar-lista { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; }
.soltar-lista li { display: flex; align-items: center; gap: 10px; padding: 4px 8px; border: 1px solid var(--borda); border-radius: 8px; font-size: 14px; }
.soltar-lista li span:first-child { flex: 1; overflow-wrap: anywhere; }

.grade-cbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin-top: 8px; }
.cbs-tipo { padding: 12px; }

.bloco { display: block; }

.fr-ok { color: var(--ok); }
.fr-baixo { color: var(--critico); }

.snm-fator { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--borda); }
.snm-fator .kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; }

.snm-ativ { max-width: 100%; width: 100%; min-width: 260px; font-size: 13px; }
.snm-anexo-txt { display: block; }
.snm-trib { margin-top: 10px; display: grid; gap: 10px; }
.snm-trib-bloco table { font-size: 12.5px; }

.fm-principal { max-width: 360px; }
.fm-principal input { font-size: 18px; font-weight: 600; }
.snm-resumo-bloco { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); }
.snm-cliente { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--borda); }
.lateral .competencia-global { display: flex; align-items: center; gap: 6px; margin: 8px 0 4px; font-size: 12px; }
.lateral .competencia-global span { opacity: .7; flex: 1; }
.lateral .competencia-global strong { display: inline; min-width: 58px; text-align: center; }
.lateral .competencia-global button { background: rgb(255 255 255 / .12); color: #fff; border: 0; border-radius: 4px; padding: 2px 8px; cursor: pointer; }
.lateral .competencia-global button[hidden] { display: none; }

/* Ocultar dados: borra valores e documentos para mostrar a tela em reunião ou gravação */
body.ocultar-dados :is(.dado-sens, td.n, td.num, .ind-valor, .valor, .nowrap.num) { filter: blur(7px); user-select: none; }
.btn-ocultar-dados { position: fixed; right: 14px; bottom: 14px; z-index: 40; box-shadow: 0 2px 8px rgba(0,0,0,.2); }
@media print { .btn-ocultar-dados { display: none; } }
.lateral .competencia-global .comp-botao { padding: 3px 10px; }
.comp-pop { position: fixed; z-index: 1000; width: 230px; background: var(--card, #fff); color: var(--texto, #222); border: 1px solid var(--borda, #ccc); border-radius: 8px; padding: 10px; box-shadow: 0 8px 28px rgb(0 0 0 / .3); }
.comp-pop .comp-ano { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.comp-pop button { cursor: pointer; border: 1px solid var(--borda, #ccc); background: transparent; color: inherit; border-radius: 6px; padding: 6px 4px; }
.comp-pop .comp-meses { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.comp-pop .comp-meses button.sel { background: var(--primaria, #1d4ed8); color: #fff; border-color: transparent; }
.comp-pop .comp-meses button.auto:not(.sel) { outline: 2px dashed var(--primaria, #1d4ed8); }
.comp-pop .comp-rodape { margin-top: 8px; text-align: center; }
.comp-pop .comp-rodape button { font-size: 12px; width: 100%; }
/* pró-labore e guia da DCTFWeb (quadro pequeno do Simples, atividade fora do fator r) */
.snm-prolabore { margin-top: 12px; padding: 10px 12px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 8px; }
.pl-tab input[name=pl_nome] { width: 100%; min-width: 140px; }
.pl-tab input[name=pl_valor] { width: 120px; }
.pl-tab input.pl-dep { width: 56px; }
.pl-tab td.n, .pl-tab th.n { white-space: nowrap; }

/* Favoritos por usuário: estrela no menu lateral e nas abas dos módulos */
.menu-fav { margin-left: auto; padding: 0 4px; font-size: 15px; line-height: 1; opacity: 0; cursor: pointer; color: inherit; transition: opacity .15s; }
.lateral nav a:hover .menu-fav, .lateral nav a:focus-within .menu-fav, .menu-fav:focus-visible, .menu-fav.marcado { opacity: .9; }
.menu-fav.marcado { color: #f5c542; }
.lateral nav a .menu-badge + .menu-fav { margin-left: 4px; }
.lateral nav a .menu-badge { margin-left: auto; }
.abas-setor a .menu-fav { margin-left: 6px; font-size: 13px; }
.abas-setor a:hover .menu-fav, .abas-setor a .menu-fav.marcado { opacity: .9; }
.lateral .grupo-fav { display: flex; align-items: center; justify-content: space-between; }
.fav-organizar { background: none; border: 0; color: inherit; cursor: pointer; font-size: 16px; padding: 0 6px; opacity: .7; }
.fav-organizar:hover { opacity: 1; }
.lista-fav { list-style: none; padding: 0; margin: 0; }
.lista-fav li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 4px; border-bottom: 1px solid var(--borda, #e5e7eb); }
body.menu-recolhido .menu-fav, body.menu-recolhido .fav-organizar { display: none; }

/* Calendário fiscal e trabalhista */
.cal-nav { display: flex; align-items: center; gap: 8px; align-self: end; }
.cal-nav strong { min-width: 150px; text-align: center; font-size: 16px; }
.cal-legenda { display: flex; flex-wrap: wrap; gap: 14px; margin: 4px 0 10px; color: var(--texto-2, #555); align-items: center; }
.cal-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.cal-grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; padding: 10px; }
.cal-semana { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--texto-2, #666); padding: 4px 6px; }
.cal-dia { min-height: 104px; border: 1px solid var(--borda, #e5e7eb); border-radius: 8px; padding: 4px 5px; display: flex; flex-direction: column; gap: 3px; overflow: hidden; }
.cal-dia.vazio { border: 0; }
.cal-dia.fechado { background: rgb(127 127 127 / .07); }
.cal-dia.hoje { outline: 2px solid var(--primaria, #1f3a68); }
.cal-num { display: flex; justify-content: space-between; align-items: center; font-weight: 700; font-size: 13px; }
.cal-tarefas { background: #d03b3b; color: #fff; border: 0; border-radius: 999px; font-size: 11px; font-weight: 700; padding: 0 7px; cursor: pointer; line-height: 18px; }
.cal-tarefas.exemplo { cursor: default; display: inline-block; }
.cal-obr, .cal-feriado { font-size: 11px; line-height: 1.25; padding: 2px 5px; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-feriado { background: #fde2e2; color: #8a1c1c; font-weight: 600; }
.cal-feriado.bh { background: #ffe9c7; color: #7a4a00; }
.cal-feriado.facult { background: #ececec; color: #555; }
.cal-obr { background: #e3ecfb; color: #173a7a; }
.cal-obr.cal-pessoal { background: #e2f5e9; color: #145a32; }
.cal-obr.cal-contabil { background: #f0e6fb; color: #4b2378; }
.cal-obr.cal-societario { background: #fff4d6; color: #6b4e00; }
.cal-mais { font-size: 11px; color: var(--texto-2, #666); }
.cal-bolinha { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #9db7e8; margin-right: 4px; vertical-align: middle; }
.cal-bolinha.cal-fiscal { background: #4a78d0; } .cal-bolinha.cal-pessoal { background: #2f9e5b; } .cal-bolinha.cal-contabil { background: #8a55c9; } .cal-bolinha.cal-societario { background: #c9a227; }
.cal-bolinha.cal-feriado-cor { background: #d05a5a; } .cal-bolinha.cal-bh { background: #e59a2f; } .cal-bolinha.cal-facult { background: #aaa; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cal-obr { background: #22345a; color: #cfe0ff; } :root:not([data-theme="light"]) .cal-obr.cal-pessoal { background: #1d3d2a; color: #c9f0d6; } :root:not([data-theme="light"]) .cal-obr.cal-contabil { background: #34254a; color: #e6d6fb; } :root:not([data-theme="light"]) .cal-feriado { background: #4a2323; color: #ffd6d6; } :root:not([data-theme="light"]) .cal-feriado.bh { background: #4a3517; color: #ffe2b8; } :root:not([data-theme="light"]) .cal-feriado.facult { background: #333; color: #ccc; } }
:root[data-theme="dark"] .cal-obr { background: #22345a; color: #cfe0ff; }
:root[data-theme="dark"] .cal-obr.cal-pessoal { background: #1d3d2a; color: #c9f0d6; }
:root[data-theme="dark"] .cal-obr.cal-contabil { background: #34254a; color: #e6d6fb; }
:root[data-theme="dark"] .cal-feriado { background: #4a2323; color: #ffd6d6; }
:root[data-theme="dark"] .cal-feriado.bh { background: #4a3517; color: #ffe2b8; }
:root[data-theme="dark"] .cal-feriado.facult { background: #333; color: #ccc; }
@media (max-width: 760px) { .cal-grade { gap: 2px; padding: 4px; } .cal-dia { min-height: 64px; padding: 2px; } .cal-obr, .cal-feriado { font-size: 9px; padding: 1px 2px; } .cal-semana { font-size: 10px; padding: 2px; } }

/* Títulos de coluna ordenáveis (lista de empresas) */
.th-ordenar { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.th-ordenar:hover { text-decoration: underline; }
.th-ordenar .seta { font-size: 10px; opacity: .45; }
.th-ordenar.ativo .seta { opacity: 1; }

/* Finanças pessoais — visão de planilha (meses lado a lado) */
.pl-wrap { overflow-x: auto; }
.pl-tabela { border-collapse: separate; border-spacing: 0; font-size: 13px; min-width: 100%; }
.pl-tabela th, .pl-tabela td { padding: 6px 10px; border-bottom: 1px solid var(--borda, #e5e7eb); white-space: nowrap; }
.pl-tabela thead th { position: sticky; top: 0; background: var(--superficie, #fff); z-index: 2; }
.pl-fixa { position: sticky; background: var(--superficie, #fff); z-index: 1; }
.pl-c1 { left: 0; min-width: 42px; text-align: center; }
.pl-c2 { left: 42px; min-width: 230px; max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
.pl-c3 { left: 272px; min-width: 150px; box-shadow: 2px 0 0 var(--borda, #e5e7eb); }
.pl-secao th, .pl-secao td { font-weight: 700; text-transform: uppercase; font-size: 12px; letter-spacing: .03em; }
.pl-secao.ent > * { background: #e3f4ea; color: #145a32; }
.pl-secao.sai > * { background: #fde8e8; color: #8a1c1c; }
.pl-secao.res > * { background: #e8eefc; color: #1f3a7a; }
.pl-total th, .pl-total td { font-weight: 700; }
.pl-total.ent td.n { color: #1f8a4c; }
.pl-total.sai td.n { color: #c0392b; }
.pl-total.saldo > *, .pl-total.acum > * { background: #f4f6fa; }
.pl-total td.neg { color: #c0392b; }
.pl-aberto { font-style: italic; color: #b7791f; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pl-secao.ent > * { background: #1d3d2a; color: #c9f0d6; } :root:not([data-theme="light"]) .pl-secao.sai > * { background: #4a2323; color: #ffd6d6; }
  :root:not([data-theme="light"]) .pl-secao.res > * { background: #22345a; color: #cfe0ff; } :root:not([data-theme="light"]) .pl-total.saldo > *, :root:not([data-theme="light"]) .pl-total.acum > * { background: #262b35; } }
:root[data-theme="dark"] .pl-secao.ent > * { background: #1d3d2a; color: #c9f0d6; }
:root[data-theme="dark"] .pl-secao.sai > * { background: #4a2323; color: #ffd6d6; }
:root[data-theme="dark"] .pl-secao.res > * { background: #22345a; color: #cfe0ff; }
:root[data-theme="dark"] .pl-total.saldo > *, :root[data-theme="dark"] .pl-total.acum > * { background: #262b35; }
@media (max-width: 760px) { .pl-c2 { min-width: 150px; } .pl-c3 { position: static; box-shadow: none; } }

/* Financeiro corporativo — painel e lançamentos no formato da planilha */
.chip-classif { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .02em; padding: 3px 8px; border-radius: 6px; white-space: nowrap; }
.chip-classif.rec { background: #2b9eb3; color: #fff; }
.chip-classif.desp { background: #f4e3d7; color: #8a3d12; }
.tabela-lanc select.cat-lanc { max-width: 240px; }
.kpis-fin .det { font-size: 12px; color: var(--texto-2); margin-top: 4px; }
.kpis-fin .det.pos { color: var(--ok); } .kpis-fin .det.neg { color: var(--critico); }
.saude-fin { display: flex; gap: 8px; align-items: center; padding: 8px 14px; border-radius: 10px; align-self: end; font-size: 14px; }
.saude-fin.ok { background: var(--ok-fundo); color: var(--ok); } .saude-fin.alerta { background: var(--alerta-fundo); color: var(--alerta); } .saude-fin.critico { background: var(--critico-fundo); color: var(--critico); }
.saude-fin span { color: var(--texto-2); }
.graf { width: 100%; height: auto; max-height: 300px; display: block; }
.graf-grade { stroke: var(--borda); stroke-width: 1; }
.graf-eixo { fill: var(--texto-3, #888); font-size: 11px; }
.graf-rec { fill: #2f9e5b; } .graf-desp { fill: #e4572e; }
.graf-linha { fill: none; stroke: #1f3a68; stroke-width: 2.5; }
.graf-ponto { fill: #1f3a68; } .graf-ponto.neg { fill: #e4572e; }
.legenda .leg-rec, .legenda .leg-desp, .legenda .leg-res { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: middle; }
.leg-rec { background: #2f9e5b; } .leg-desp { background: #e4572e; } .leg-res { background: #1f3a68; height: 3px !important; }
.rosca-wrap { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.rosca { width: 180px; height: 180px; flex: none; }
.rosca-rot { fill: var(--texto-2); font-size: 11px; } .rosca-val { fill: var(--texto); font-size: 18px; font-weight: 700; }
.legenda-lista { list-style: none; padding: 0; margin: 0; flex: 1; min-width: 220px; }
.legenda-lista li { display: grid; grid-template-columns: 12px 1fr auto 42px; gap: 8px; align-items: center; padding: 4px 0; font-size: 13px; border-bottom: 1px solid var(--borda); }
.legenda-lista i { width: 12px; height: 12px; border-radius: 3px; }
.legenda-lista em { font-style: normal; color: var(--texto-2); text-align: right; }
.banco-linha { display: grid; grid-template-columns: 110px 1fr 120px 100px; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--borda); font-size: 14px; }
.bl-trilho { background: var(--barra-trilho, #eef1f6); border-radius: 6px; height: 12px; overflow: hidden; }
.bl-barra { height: 12px; background: #4a78d0; border-radius: 6px; width: 0; transition: width .5s; }
.bl-barra.neg { background: #e4572e; }
.bl-val { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.bl-mes { text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .graf-linha { stroke: #8fb3ff; } :root[data-theme="dark"] .graf-ponto { fill: #8fb3ff; } :root[data-theme="dark"] .leg-res { background: #8fb3ff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .graf-linha { stroke: #8fb3ff; } :root:not([data-theme="light"]) .graf-ponto { fill: #8fb3ff; } :root:not([data-theme="light"]) .leg-res { background: #8fb3ff; }
  :root:not([data-theme="light"]) .chip-classif.desp { background: #4a3226; color: #ffd9c2; } }
:root[data-theme="dark"] .chip-classif.desp { background: #4a3226; color: #ffd9c2; }
@media (max-width: 760px) { .banco-linha { grid-template-columns: 80px 1fr 96px; } .bl-mes { display: none; } }

/* Exclusão em lote de tarefas */
.sep-lote { color: var(--texto-3); }
.btn.perigo-texto { color: var(--critico); }
.btn.perigo-texto:hover { background: var(--critico-fundo); }

/* Matriz → Responsáveis: carteira por analista */
.carteira { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.cart-analista { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border: 1px solid var(--borda); border-radius: var(--raio); background: var(--superficie); color: var(--texto); text-decoration: none; box-shadow: var(--sombra); }
.cart-analista:hover { border-color: var(--marca); }
.cart-analista.sem { border-style: dashed; }
.cart-num { font-size: 13px; }
.cart-tar { font-size: 13px; font-weight: 700; color: var(--marca); }
.check-inline { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; }
.resp-inline { max-width: 260px; }

/* Cadastro de empresas — painel e lista enxuta */
.painel-emp { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.pe-card { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra); padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.pe-rot { font-size: 13px; color: var(--texto-2); font-weight: 600; }
.pe-num { font-size: 34px; line-height: 1; font-variant-numeric: tabular-nums; }
.pe-barra { display: flex; height: 10px; border-radius: 6px; overflow: hidden; background: var(--barra-trilho, #eef1f6); }
.pe-barra span { display: block; height: 100%; }
.pe-barra .r-1, .pe-chip i.r-1 { background: var(--serie-1); } .pe-barra .r-2, .pe-chip i.r-2 { background: var(--serie-2); } .pe-barra .r-3, .pe-chip i.r-3 { background: var(--serie-3); }
.pe-barra .r-4, .pe-chip i.r-4 { background: var(--serie-4); } .pe-barra .r-5, .pe-chip i.r-5 { background: var(--serie-5); } .pe-barra .r-6, .pe-chip i.r-6 { background: var(--serie-6); }
.pe-barra .r-7, .pe-chip i.r-7, .pe-barra .r-8, .pe-chip i.r-8 { background: var(--serie-7, #999); }
.pe-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pe-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--borda); font-size: 12px; color: var(--texto); text-decoration: none; }
.pe-chip i { width: 9px; height: 9px; border-radius: 50%; }
.pe-chip:hover, .pe-chip.ativo { border-color: var(--marca); background: var(--marca-suave); }
.pe-cert { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.pe-cert-item { display: flex; flex-direction: column; align-items: center; padding: 8px 4px; border-radius: 10px; text-decoration: none; text-align: center; border: 1px solid transparent; }
.pe-cert-item b { font-size: 24px; font-variant-numeric: tabular-nums; }
.pe-cert-item span { font-size: 11px; color: var(--texto-2); line-height: 1.2; }
.pe-cert-item.vencido { background: var(--critico-fundo); color: var(--critico); } .pe-cert-item.aviso { background: var(--alerta-fundo); color: var(--alerta); }
.pe-cert-item.ok { background: var(--ok-fundo); color: var(--ok); } .pe-cert-item.sem { background: var(--neutro-fundo, #f1f3f6); color: var(--texto-2); }
.pe-cert-item.ativo, .pe-cert-item:hover { border-color: currentColor; }
.pe-analistas { display: flex; flex-direction: column; gap: 4px; }
.pe-analista { display: flex; justify-content: space-between; align-items: center; padding: 4px 6px; border-radius: 8px; color: var(--texto); text-decoration: none; font-size: 13px; }
.pe-analista:hover, .pe-analista.ativo { background: var(--marca-suave); }
.cert-pill { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.cert-pill.ok { background: var(--ok-fundo); color: var(--ok); } .cert-pill.aviso { background: var(--alerta-fundo); color: var(--alerta); }
.cert-pill.vencido { background: var(--critico-fundo); color: var(--critico); } .cert-pill.sem { background: var(--neutro-fundo, #f1f3f6); color: var(--texto-2); }
.tabela-empresas td { padding-top: 12px; padding-bottom: 12px; }
.tabela-empresas tbody tr:hover { background: var(--superficie-2); }
.btn-ico { position: relative; }
.ponto-alerta { position: absolute; top: 3px; right: 3px; width: 7px; height: 7px; border-radius: 50%; background: var(--critico); }
@media (max-width: 1000px) { .painel-emp { grid-template-columns: 1fr; } }

/* Importação de empresas: mapa de colunas e campos personalizados */
.mapa-colunas { max-height: 280px; overflow: auto; margin-top: 8px; }
.mapa-colunas td, .mapa-colunas th { padding: 5px 10px; font-size: 13px; }
.secao-extras { border-top: 1px solid var(--borda); padding-top: 12px; margin-top: 4px; }
.cod-cliente { font-variant-numeric: tabular-nums; }

/* Calendário: lançamentos próprios */
.cal-dia[data-acao="cal-novo-dia"] { cursor: pointer; }
.cal-dia[data-acao="cal-novo-dia"]:hover { border-color: var(--marca); }
.cal-evento { display: block; width: 100%; text-align: left; font-size: 11px; line-height: 1.25; padding: 2px 5px; border-radius: 4px; border: 0; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.cal-evento.ev-lembrete, .cal-bolinha.ev-lembrete { background: #fff1c2; color: #6b4e00; }
.cal-evento.ev-reuniao, .cal-bolinha.ev-reuniao { background: #dff3f7; color: #0d5c6b; }
.cal-evento.ev-prazo, .cal-bolinha.ev-prazo { background: #fde2e2; color: #8a1c1c; }
.cal-evento.ev-pagamento, .cal-bolinha.ev-pagamento { background: #e2f5e9; color: #145a32; }
.cal-evento.ev-outro, .cal-bolinha.ev-outro { background: #ececec; color: #444; }
.cal-bolinha.ev-lembrete { background: #e0b100; } .cal-bolinha.ev-reuniao { background: #17a2b8; } .cal-bolinha.ev-prazo { background: #d05a5a; } .cal-bolinha.ev-pagamento { background: #2f9e5b; } .cal-bolinha.ev-outro { background: #999; }
.botoes-ev { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }

/* Cadastro de empresas: abas e serviços pontuais */
.abas-empresas { margin-bottom: 12px; }
.tabela-empresas .acoes-linha { flex-wrap: nowrap; }
.sp-painel { grid-template-columns: repeat(4, 1fr); }
.sp-kpi { text-decoration: none; color: var(--texto); }
.sp-kpi:hover, .sp-kpi.ativo { border-color: var(--marca); }
.sp-painel .pe-num { font-size: 26px; }
.tabela-sp td { vertical-align: top; }
.sp-obs { max-width: 360px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.sp-fechado td { opacity: .65; }
.sp-andamento { font-size: 13px; padding: 4px 8px; border-radius: 999px; font-weight: 600; }
.sp-andamento.sp-neutro { background: var(--neutro-fundo, #f1f3f6); }
.sp-andamento.sp-info { background: var(--marca-suave); }
.sp-andamento.sp-alerta { background: var(--alerta-fundo); }
.sp-andamento.sp-ok { background: var(--ok-fundo); }
.sp-andamento.sp-critico { background: var(--critico-fundo); }
@media (max-width: 1000px) { .sp-painel { grid-template-columns: repeat(2, 1fr); } }

/* Personalizar menu: abas e tópicos */
.mm-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; margin-top: 12px; }
.mm-cab { display: flex; gap: 6px; align-items: center; }
.mm-nome { font-weight: 700; border: 1px dashed transparent; background: transparent; font-size: 1.05em; flex: 1; min-width: 0; padding: 4px 6px; border-radius: 6px; color: var(--texto); }
.mm-nome:hover, .mm-nome:focus { border-color: var(--borda); background: var(--superficie-2); }
.mm-lista { list-style: none; margin: 0; padding: 0; }
.mm-lista li { display: flex; gap: 6px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--borda); }
.mm-lista .mm-t { flex: 1; min-width: 0; }
input.mm-t { border: 1px solid transparent; background: transparent; padding: 4px 6px; border-radius: 6px; color: var(--texto); font: inherit; }
input.mm-t:hover, input.mm-t:focus { border-color: var(--borda); background: var(--superficie-2); }
.mm-lista select { max-width: 120px; font-size: 12px; }
.mm-vis input { width: 16px; height: 16px; }
.mm-oculto .mm-t { text-decoration: line-through; opacity: .55; }

/* Matriz por tipo e campos personalizados */
.obr-tipos { margin: 2px 0 4px; display: flex; gap: 4px; flex-wrap: wrap; }
.tag.tipo-medico { background: #fde4ec; color: #8a1c3f; } .tag.tipo-imobiliario { background: #efe6fb; color: #4b2a8a; }
.tag.tipo-comercio { background: #e3ecfb; color: #173a7a; } .tag.tipo-servico { background: #e2f5e9; color: #145a32; }
.tag.tipo-industria { background: #f0e6fb; color: #4b2378; } .tag.tipo-todos { background: var(--neutro-fundo, #f1f3f6); color: var(--texto-2); }
.extras-cab { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; }
.campo-extra { position: relative; }
.campo-extra .remover-campo { position: absolute; top: 0; right: 0; width: 22px; height: 22px; font-size: 11px; }

/* ---------- Busca de atalhos (public/busca-atalhos.js) ---------- */
.busca-atalho-botao { display: flex; align-items: center; gap: 10px; width: 100%; margin: 0 0 8px; padding: 8px 12px; border-radius: 8px; border: 1px solid rgb(255 255 255 / .14);
  background: rgb(255 255 255 / .06); color: var(--lateral-texto); font: inherit; font-size: 13px; cursor: pointer; flex: none; text-align: left; }
.busca-atalho-botao:hover, .busca-atalho-botao:focus-visible { background: rgb(255 255 255 / .12); color: #fff; }
.busca-atalho-botao kbd { margin-left: auto; font-family: inherit; font-size: 11px; line-height: 1; background: transparent; color: inherit; box-shadow: none; opacity: .6; border: 1px solid rgb(255 255 255 / .25); border-radius: 4px; padding: 3px 5px; }
.busca-atalho-botao svg { width: 18px; height: 18px; flex: none; }
.busca-atalho-botao span, .busca-atalho-botao kbd { white-space: nowrap; }
body.menu-recolhido .busca-atalho-botao { justify-content: center; padding: 10px 0; }
body.menu-recolhido .busca-atalho-botao kbd { display: none; }
.busca-atalho-fundo { position: fixed; inset: 0; background: rgb(10 14 20 / .45); z-index: 60; display: flex; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; }
.busca-atalho-caixa { background: var(--superficie); color: var(--texto); width: 100%; max-width: 600px; border-radius: 12px; border: 1px solid var(--borda); box-shadow: 0 20px 50px rgb(0 0 0 / .3); overflow: hidden; }
.busca-atalho-topo { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--borda); }
.busca-atalho-topo svg { width: 20px; height: 20px; color: var(--texto-3); flex: none; }
.busca-atalho-topo input { flex: 1; border: 0; outline: 0; background: transparent; color: var(--texto); font: inherit; font-size: 16px; min-width: 0; }
.busca-atalho-topo kbd { background: transparent; box-shadow: none; font-family: inherit; font-size: 11px; color: var(--texto-3); border: 1px solid var(--borda); border-radius: 4px; padding: 2px 6px; }
#busca-atalho-lista { list-style: none; margin: 0; padding: 6px; max-height: 52vh; overflow-y: auto; }
#busca-atalho-lista li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px; cursor: pointer; }
#busca-atalho-lista li svg { width: 18px; height: 18px; color: var(--texto-3); flex: none; }
#busca-atalho-lista li.sel { background: var(--marca-suave); }
#busca-atalho-lista li.sel svg { color: var(--marca); }
#busca-atalho-lista .ba-rot { font-weight: 600; }
#busca-atalho-lista .ba-cam { margin-left: auto; font-size: 12px; color: var(--texto-3); text-align: right; }
#busca-atalho-lista .ba-vazio { color: var(--texto-3); cursor: default; }
.busca-atalho-dica { margin: 0; padding: 8px 14px; font-size: 12px; color: var(--texto-3); border-top: 1px solid var(--borda); }
@media (max-width: 600px) { .busca-atalho-fundo { padding-top: 8px; } #busca-atalho-lista .ba-cam { display: none; } }

/* ---------- Atualizações contábeis (public/atualizacoes.js) ---------- */
.atu-item { display: block; padding: 9px 0; border-bottom: 1px solid var(--borda); text-decoration: none; color: inherit; }
.atu-item:last-of-type { border-bottom: 0; }
.atu-item:hover strong { color: var(--marca); text-decoration: underline; }
.atu-item strong { display: block; margin-top: 3px; font-size: 14px; }
.atu-meta { font-size: 12px; color: var(--texto-3); }
.atu-reforma { border-left: 4px solid #a8863f; }
.atu-aviso { cursor: pointer; display: flex; flex-direction: column; gap: 2px; max-width: 360px; }
.atu-aviso span { font-weight: 400; }

/* busca nas listas de empresa (nº, nome ou CNPJ) — public/app.js melhorarListasEmpresa */
.busca-empresa { display: block; width: 100%; margin: 0 0 4px; padding: 4px 8px; font-size: .85em; min-height: 0; }
.filtros .busca-empresa { min-width: 180px; }

/* nome do cliente / obrigação clicáveis no Gerenciador de tarefas */
.link-linha { color: inherit; text-decoration: none; cursor: pointer; }
.link-linha:hover, .link-linha:focus-visible { text-decoration: underline; color: var(--primaria, #1c2c5b); }

/* ---- Entrada de clientes e repasses entre setores (public/entrada-clientes.js) ---- */
.ent-lista { list-style: none; margin: 12px 0; padding: 0; display: grid; gap: 8px; }
.ent-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--borda); border-radius: var(--raio); background: var(--superficie); }
.ent-item.feito { background: var(--ok-fundo); border-color: transparent; }
.ent-item.feito strong { text-decoration: line-through; text-decoration-color: var(--texto-3); }
.ent-check input { width: 20px; height: 20px; cursor: pointer; margin-top: 2px; }
.ent-corpo { flex: 1; min-width: 0; display: grid; gap: 4px; }
.ent-feito { color: var(--ok); }
.ent-obs { width: 100%; font: inherit; font-size: 13px; padding: 5px 8px; border: 1px solid var(--borda); border-radius: 6px; background: transparent; color: inherit; }
.ent-novo { display: flex; gap: 8px; margin-bottom: 12px; }
.ent-novo input { flex: 1; font: inherit; padding: 7px 10px; border: 1px solid var(--borda); border-radius: 6px; background: transparent; color: inherit; }
.ent-repassar { border: 1px dashed var(--borda); border-radius: var(--raio); padding: 10px 14px; margin: 12px 0; }
.ent-repassar summary { cursor: pointer; }
.ent-setores { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 10px 0; }
.repasse { border-left: 4px solid var(--borda); }
.repasse.pendente { border-left-color: var(--alerta); }
.repasse.ciente { border-left-color: var(--marca); }
.repasse.concluido { border-left-color: var(--ok); opacity: .85; }
.repasse.prio-alta.pendente { border-left-color: var(--critico); }
.repasse-msg { white-space: normal; margin: 8px 0; }
.repasse-respostas { list-style: none; margin: 8px 0; padding: 8px 12px; background: var(--neutro-fundo); border-radius: 8px; display: grid; gap: 8px; font-size: 13px; }
.repasses-grade { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.ent-corpo .tag { justify-self: start; }

/* Impressão em todo o sistema (public/imprimir.js escolhe entre a página e a janela aberta, também no Ctrl+P) */
@media print {
  body.imprimir-pagina, body.imprimir-modal { background: #fff !important; color: #000 !important; }
  body.imprimir-pagina .lateral, body.imprimir-pagina .nao-imprimir, body.imprimir-pagina #avisos, body.imprimir-modal .nao-imprimir,
  body.imprimir-pagina .conteudo .abas, body.imprimir-pagina .conteudo .filtros button, body.imprimir-pagina .conteudo .btn { display: none !important; }
  body.imprimir-pagina .layout { display: block !important; }
  body.imprimir-pagina .conteudo { padding: 0 !important; }
  body.imprimir-pagina .conteudo::before { content: attr(data-impressao); display: block; margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid #999; font-size: 11px; color: #555; }
  body.imprimir-pagina .tabela-wrap, body.imprimir-modal .tabela-wrap { overflow: visible !important; max-height: none !important; }
  body.imprimir-pagina .card, body.imprimir-modal .card { box-shadow: none !important; break-inside: avoid; }
  body.imprimir-pagina table, body.imprimir-modal table { page-break-inside: auto; }
  body.imprimir-pagina tr, body.imprimir-modal tr { break-inside: avoid; }
  body.imprimir-pagina thead, body.imprimir-modal thead { display: table-header-group; }
  body.imprimir-modal .modal header .icone { display: none !important; }
}

/* ---------- Atendimentos: lista de conversas e cabeçalho do chat (restaurado, estilo WhatsApp Web) ---------- */
.inbox-lista { background: var(--superficie); min-width: 0; }
.abas-conv { display: flex; flex-wrap: wrap; gap: 3px; padding: 6px 8px; border-bottom: 1px solid var(--borda); background: var(--superficie-2); }
.abas-conv a { padding: 3px 8px; border-radius: 12px; font-size: 11.5px; color: var(--texto-2); text-decoration: none; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.abas-conv a:hover { background: var(--superficie); }
.abas-conv a.ativo { background: var(--marca-suave); color: var(--marca-forte); }
.abas-conv .badge { font-size: 10px; padding: 0 5px; min-width: 16px; line-height: 16px; }
.badge { display: inline-block; min-width: 18px; padding: 1px 6px; border-radius: 10px; background: #00a884; color: #fff; font-size: 11px; font-weight: 700; text-align: center; }
.filtros-inbox { padding: 8px; border-bottom: 1px solid var(--borda); }
.filtros-inbox input { width: 100%; box-sizing: border-box; font: inherit; font-size: 13px; padding: 7px 12px; border: 1px solid var(--borda); border-radius: 18px; background: var(--superficie-2); color: var(--texto); }
.conv-lista { overflow-y: auto; flex: 1 1 0; min-height: 0; }
.conv-linha { display: flex; align-items: stretch; border-bottom: 1px solid var(--borda); }
.conv-linha .conv-item { flex: 1; min-width: 0; }
.conv-item { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; color: var(--texto); text-decoration: none; align-items: start; }
.conv-item:hover { background: var(--superficie-2); }
.conv-item.ativo { background: var(--marca-suave); }
.conv-item .avatar { width: 40px; height: 40px; font-size: 13px; }
.conv-sel { flex: none; margin: 0 0 0 10px; align-self: center; }
.conv-acoes-massa { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border-bottom: 1px solid var(--borda); }
.conv-acoes-massa .perigo { color: #c0392b; border-color: #c0392b; }
.conv-txt { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.conv-txt strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conv-txt .l2, .conv-ultima { font-size: 12.5px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conv-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-size: 11px; }
.chat-cab { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 16px; border-bottom: 1px solid var(--borda); background: #f0f2f5; flex-wrap: wrap; flex: none; }
[data-tema="escuro"] .chat-cab { background: #202c33; }
.chat-barra { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.chat-barra .espaco { flex: 1; }
.chat-fim { padding: 10px 14px; margin: 0; }
.msg { display: flex; flex-direction: column; gap: 3px; overflow-wrap: anywhere; }
.msg-quem { font-size: 12px; font-weight: 700; color: #027d62; }
.msg-img { max-width: 280px; max-height: 280px; border-radius: 6px; display: block; }
.msg-doc { font-weight: 600; }
.msg.out.bot { background: #e7ecf7; }
.msg.erro { outline: 1px solid #c0392b; }
.msg.sistema { align-self: center; background: rgba(255,255,255,.75); box-shadow: none; font-size: 12.5px; color: #54656f; max-width: 90%; text-align: center; border-radius: 8px; }
.msg-acoes { position: absolute; top: 2px; right: 4px; display: none; gap: 2px; background: var(--superficie); border: 1px solid var(--borda); border-radius: 6px; padding: 0 3px; }
.msg:hover .msg-acoes, .msg:focus-within .msg-acoes { display: flex; }
.msg.apagada .msg-txt { text-decoration: line-through; opacity: .6; }
.chat-escrever textarea { font: inherit; }
.inbox-chat > .vazio, .inbox-chat > .carregando { margin: auto; color: #667781; }
/* conversa maior: a lista fica estreita e o chat ocupa todo o resto */
.inbox { grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); height: calc(100vh - 150px) !important; margin: 0; }
.inbox.com-info { grid-template-columns: minmax(300px, 360px) minmax(0, 1fr) minmax(260px, 300px); }
.inbox.sem-lista { grid-template-columns: minmax(0, 1fr); }
.inbox.sem-lista.com-info { grid-template-columns: minmax(0, 1fr) minmax(260px, 300px); }


/* ==========================================================================
   ATENDIMENTO: GARANTIA DE OCULTAR LISTA COM .sem-lista
   ========================================================================== */
.inbox.sem-lista .inbox-lista {
  display: none !important;
}

/* ==========================================================================
   QUADRO KANBAN ESTILO NOTION - VENCIMENTO DE CERTIFICADOS DIGITAIS
   ========================================================================== */
.notion-quadro-wrap {
  padding: 10px 0 30px;
  width: 100%;
}
.notion-crm-cab {
  margin-bottom: 12px;
}
.notion-crm-title {
  font-size: 32px;
  font-weight: 800;
  color: #111827;
  letter-spacing: -0.5px;
  margin-bottom: 12px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.notion-crm-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e5e7eb;
  padding-bottom: 10px;
  gap: 12px;
  flex-wrap: wrap;
}
.notion-tabs-left {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
}
.notion-tab-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 13.5px;
  color: #4b5563;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.15s;
}
.notion-tab-pill:hover {
  background: #f3f4f6;
  color: #111827;
}
.notion-tab-pill.ativa {
  background: #f3f4f6;
  color: #111827;
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.notion-tabs-right {
  display: flex;
  align-items: center;
  gap: 6px;
}
.btn-notion-icon {
  background: transparent;
  border: none;
  font-size: 14px;
  padding: 5px 8px;
  color: #6b7280;
  cursor: pointer;
  border-radius: 6px;
  transition: background 0.15s;
}
.btn-notion-icon:hover {
  background: #f3f4f6;
}
.btn-notion-blue {
  background: #0081f2;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0, 129, 242, 0.3);
  transition: background 0.15s;
}
.btn-notion-blue:hover {
  background: #0070d2;
}

/* Tabuleiro Kanban Horizontal */
.notion-kanban-board {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  padding: 12px 4px 28px 4px;
  min-height: 520px;
  align-items: flex-start;
}
.notion-col {
  width: 255px;
  min-width: 245px;
  max-width: 275px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
.notion-col-header {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  font-weight: 600;
  color: #374151;
  padding: 4px 4px 10px 4px;
}
.notion-col-count {
  font-size: 13px;
  font-weight: 400;
  color: #9ca3af;
}
.notion-col-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.notion-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  cursor: pointer;
  transition: transform 0.12s, box-shadow 0.12s, border-color 0.12s;
}
.notion-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08) !important;
  border-color: #cbd5e1 !important;
}
.notion-card-title {
  font-size: 12.5px;
  font-weight: 700;
  color: #111827;
  line-height: 1.35;
  margin-bottom: 6px;
  word-break: break-word;
}
.notion-card-date {
  font-size: 12px;
  color: #4b5563;
  line-height: 1.3;
}
.notion-card-meta {
  font-size: 11px;
  color: #9ca3af;
  margin-top: 5px;
  padding-top: 4px;
  border-top: 1px dashed #f1f5f9;
}
.notion-col-footer {
  margin-top: 8px;
}
.notion-add-card {
  background: transparent;
  border: none;
  font-size: 13px;
  color: #9ca3af;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
  width: 100%;
  text-align: left;
  transition: background 0.15s, color 0.15s;
}
.notion-add-card:hover {
  background: #f1f5f9;
  color: #334155;
}

/* ---------- Hub: painel, clientes, indicações e projetos (public/hub.js) ---------- */
.hub-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; }
.hub-un h3 { font-size: 15px; } .hub-un p { margin: 4px 0; }
.hub-mes-atual { min-width: 70px; text-align: center; align-self: center; }
.hub-barras { display: flex; gap: 14px; align-items: flex-end; height: 160px; padding: 8px 0; overflow-x: auto; }
.hub-mes { display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; min-width: 44px; }
.hub-par { flex: 1; display: flex; gap: 3px; align-items: flex-end; width: 100%; justify-content: center; }
.hub-par span { width: 14px; border-radius: 3px 3px 0 0; min-height: 2px; }
.hub-par .e, .hub-leg.e { background: var(--marca); } .hub-par .s, .hub-leg.s { background: var(--critico); opacity: .75; }
.hub-leg { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin: 0 4px 0 10px; vertical-align: middle; }
.hub-atencao { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
tr.linha-atraso td:first-child { box-shadow: inset 3px 0 0 var(--critico); }

/* ================= BI da hub (public/hub-bi.js, public/graficos.js) =================
   Visual executivo: superfícies neutras, uma cor de destaque (--marca), cor semântica só para bom/ruim, números tabulares,
   bordas de 1px e sombra mínima. Tudo pelas variáveis do tema, então claro e escuro funcionam igual. */
.bi { display: grid; gap: 16px; font-variant-numeric: tabular-nums; }
.bi-cab { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: flex-end; justify-content: space-between; padding-bottom: 4px; border-bottom: 1px solid var(--borda); }
.bi-cab-txt { min-width: 0; flex: 1 1 340px; }
.bi-cab h1 { margin: 2px 0 4px; font-size: 26px; letter-spacing: -.01em; font-weight: 650; }
.bi-cab .sub { margin: 0 0 10px; color: var(--texto-2); max-width: 72ch; }
.bi-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--texto-3); font-weight: 600; }
.bi-filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding-bottom: 10px; }
.bi-filtros select { min-height: 32px; }
.bi-periodo { display: inline-flex; align-items: center; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); overflow: hidden; }
.bi-periodo strong { padding: 0 12px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.bi-seta { display: grid; place-items: center; width: 30px; height: 32px; text-decoration: none; color: var(--texto-2); font-size: 18px; }
.bi-seta:hover, .bi-seta:focus-visible { background: var(--superficie-2); color: var(--texto); }
.bi-chips { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.bi-chip { font-size: 12px; padding: 3px 8px; border-radius: 999px; background: var(--marca-suave); color: var(--marca-forte); }
.bi-limpar { font-size: 12px; }

/* cartões de indicador */
.bi-hero { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.bi-secundarios { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
@media (min-width: 1280px) { .bi-secundarios { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.bi-k { position: relative; display: grid; gap: 4px; align-content: start; padding: 14px 16px; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio);
  color: var(--texto); text-decoration: none; min-width: 0; transition: border-color .15s ease, box-shadow .15s ease; }
a.bi-k:hover, a.bi-k:focus-visible { border-color: var(--marca); box-shadow: 0 0 0 3px var(--marca-suave); outline: none; }
.bi-k.hero { padding: 16px 18px 18px; box-shadow: var(--sombra); }
.bi-k-rot { font-size: 12.5px; color: var(--texto-2); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-weight: 500; }
.bi-k-val { font-size: 22px; font-weight: 650; letter-spacing: -.01em; line-height: 1.15; overflow-wrap: anywhere; }
.bi-k.hero .bi-k-val { font-size: 28px; }
.bi-k-pe { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 12px; min-height: 18px; }
.bi-k-ref { color: var(--texto-3); font-size: 12px; }
.bi-k-spark { position: absolute; right: 12px; bottom: 12px; opacity: .9; }
.bi-k.hero .bi-k-pe { padding-right: 120px; }
.bi-sem { font-size: 13px; font-weight: 500; color: var(--texto-3); background: var(--neutro-fundo); padding: 2px 8px; border-radius: 6px; }
.bi-selo { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; padding: 1px 6px; border-radius: 4px; background: var(--neutro-fundo); color: var(--texto-3); }
.bi-selo.est { background: var(--alerta-fundo); color: var(--alerta); }
.bi-selo.meta { background: var(--marca-suave); color: var(--marca-forte); }
.bi-delta { font-weight: 600; font-size: 12px; padding: 1px 6px; border-radius: 4px; white-space: nowrap; }
.bi-delta.bom { color: var(--ok); background: var(--ok-fundo); }
.bi-delta.ruim { color: var(--critico); background: var(--critico-fundo); }
.bi-delta.neutro { color: var(--texto-3); background: var(--neutro-fundo); }

/* blocos */
.bi-grade-2 { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.bi-grade-2.igual { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.bi-col { display: grid; gap: 16px; min-width: 0; }
@media (max-width: 1100px) { .bi-grade-2 { grid-template-columns: minmax(0, 1fr); } }
.bi-card { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); padding: 16px 18px; min-width: 0; }
.bi-card-cab { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.bi-card h2 { font-size: 15px; margin: 0; font-weight: 650; letter-spacing: -.005em; }
.bi-card-sub { margin: 2px 0 0; font-size: 12px; color: var(--texto-3); }
.bi-vazio { color: var(--texto-3); font-size: 13px; padding: 18px 0; text-align: center; border: 1px dashed var(--borda); border-radius: 8px; margin: 0; }
.bi-abas { margin-top: -4px; }
.bi-metas { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; align-items: end; }

/* alertas */
.bi-alertas { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bi-al { border: 1px solid var(--borda); border-left: 3px solid var(--texto-3); border-radius: 8px; padding: 10px 12px; font-size: 13px; }
.bi-al.alta { border-left-color: var(--critico); } .bi-al.media { border-left-color: var(--alerta); }
.bi-al p { margin: 4px 0 0; color: var(--texto-2); }
.bi-al-cab { display: grid; gap: 2px; }
.bi-al-nivel { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; color: var(--texto-3); }
.bi-al.alta .bi-al-nivel { color: var(--critico); } .bi-al.media .bi-al-nivel { color: var(--alerta); }

/* gráficos SVG */
.bi-svg { width: 100%; height: auto; max-height: 300px; display: block; overflow: visible; }
.bi-grade { stroke: var(--borda); stroke-width: 1; }
.bi-zero { stroke: var(--texto-3); stroke-width: 1; }
.bi-conector { stroke: var(--texto-3); stroke-dasharray: 3 3; }
.bi-eixo { fill: var(--texto-3); font-size: 11px; }
.bi-valtxt { fill: var(--texto-2); font-size: 11px; font-weight: 600; }
.bi-l-marca { stroke: var(--marca); stroke-width: 2.25; } .bi-c-marca { fill: var(--marca); }
.bi-l-critico { stroke: var(--critico); stroke-width: 2; opacity: .85; } .bi-c-critico { fill: var(--critico); }
.bi-l-ok { stroke: var(--ok); stroke-width: 2; stroke-dasharray: 5 3; } .bi-c-ok { fill: var(--ok); }
.bi-f-marca { fill: var(--marca); } .bi-f-critico { fill: var(--critico); opacity: .85; } .bi-f-ok { fill: var(--ok); }
.bi-bg-marca { background: var(--marca); } .bi-bg-critico { background: var(--critico); } .bi-bg-ok { background: var(--ok); }
.bi-legenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--texto-2); margin-top: 6px; }
.bi-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.bi-spark { width: 110px; height: 30px; }
.bi-spark path { stroke-width: 1.75; }
.bi-barras, .bi-funil { display: grid; gap: 8px; }
.bi-b-linha, .bi-funil-linha { display: grid; grid-template-columns: minmax(110px, 30%) minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: 13px; color: var(--texto); text-decoration: none; padding: 2px 4px; border-radius: 6px; }
a.bi-b-linha:hover, a.bi-b-linha:focus-visible { background: var(--superficie-2); outline: none; }
.bi-b-rot { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bi-b-rot small { display: block; color: var(--texto-3); font-size: 11px; }
.bi-b-trilho, .bi-funil-trilho { position: relative; height: 10px; background: var(--barra-trilho); border-radius: 5px; }
.bi-b-barra { position: absolute; inset: 0 auto 0 0; border-radius: 5px; }
.bi-b-meta { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--texto); border-radius: 1px; }
.bi-b-val { font-weight: 600; white-space: nowrap; text-align: right; min-width: 80px; }
.bi-funil-barra { position: absolute; inset: 0 auto 0 0; border-radius: 5px; background: var(--marca); opacity: .85; }
.bi-bullet { display: grid; gap: 8px; }
.bi-bullet-trilho { position: relative; height: 18px; background: var(--barra-trilho); border-radius: 4px; }
.bi-bullet-faixa { position: absolute; inset: 0 auto 0 0; background: var(--neutro-fundo); border-radius: 4px; }
.bi-bullet-val { position: absolute; top: 5px; bottom: 5px; left: 0; border-radius: 3px; }
.bi-bullet-meta { position: absolute; top: -4px; bottom: -4px; width: 3px; background: var(--texto); border-radius: 2px; }
.bi-bullet-proj { position: absolute; top: -2px; bottom: -2px; width: 0; border-left: 2px dashed var(--alerta); }
.bi-bullet-leg { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--texto-2); }
th[data-ord] { cursor: pointer; user-select: none; }
th[data-ord]::after { content: ' ↕'; color: var(--texto-3); font-size: 11px; }
th[data-dir="asc"]::after { content: ' ↑'; color: var(--marca); } th[data-dir="desc"]::after { content: ' ↓'; color: var(--marca); }
@media (max-width: 640px) {
  .bi-cab h1 { font-size: 22px; }
  .bi-k.hero .bi-k-val { font-size: 24px; }
  .bi-k.hero .bi-k-pe { padding-right: 0; }
  .bi-k-spark { position: static; }
  .bi-b-linha, .bi-funil-linha { grid-template-columns: minmax(0, 1fr) auto; }
  .bi-b-linha .bi-b-trilho, .bi-funil-linha .bi-funil-trilho { grid-column: 1 / -1; grid-row: 2; }
}
@media (prefers-reduced-motion: reduce) { .bi-k { transition: none; } }

/* ---------- Menu lateral em sanfona: grupos que abrem e fecham ---------- */
.lateral .grupo-toggle { display: flex; align-items: center; gap: 6px; width: 100%; background: none; border: 0; color: var(--lateral-texto); cursor: pointer; text-align: left; font-family: inherit; opacity: .75; }
.lateral .grupo-toggle:hover { opacity: 1; background: rgb(255 255 255 / .05); border-radius: 6px; }
.lateral .grupo-toggle .grupo-nome { flex: 1 1 auto; }
.lateral .grupo-toggle .n { font-size: 10px; opacity: .7; letter-spacing: 0; }
.lateral .grupo-toggle .seta { width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); transition: transform .15s; flex: none; }
.lateral .grupo-toggle[aria-expanded="true"] .seta { transform: rotate(45deg); }
.lateral .grupo-itens { display: flex; flex-direction: column; gap: 2px; }
.lateral .grupo-itens[hidden] { display: none; }
.lateral .menu-tudo { display: flex; gap: 6px; padding: 2px 6px 0; }
.lateral .menu-tudo button { flex: 1; background: rgb(255 255 255 / .06); border: 0; border-radius: 6px; color: var(--lateral-texto); font-size: 11px; padding: 4px 6px; cursor: pointer; }
.lateral .menu-tudo button:hover { background: rgb(255 255 255 / .13); color: #fff; }
body.menu-recolhido .lateral .grupo-toggle, body.menu-recolhido .lateral .menu-tudo { display: none; }
body.menu-recolhido .lateral .grupo-itens[hidden] { display: flex; }
@media (max-width: 860px) {
  .lateral .grupo-toggle, .lateral .menu-tudo { display: none; }
  .lateral .grupo-itens, .lateral .grupo-itens[hidden] { display: contents; }
}

.lateral .fav-recolher { background: none; border: 0; color: inherit; cursor: pointer; padding: 0 4px; opacity: .8; }
.lateral .fav-recolher:hover { opacity: 1; }
.lateral .grupo-itens[data-g="Favoritos"] { display: flex; flex-direction: column; gap: 2px; }
.lateral .grupo-itens[data-g="Favoritos"][hidden] { display: none; }

/* ---------- Funcionários: contrato gerado, formulário por vínculo e aniversariantes ---------- */
[data-fn-sec][hidden], [data-sug-modelo][hidden], [data-fn-adt][hidden], [data-fn-seg][hidden] { display: none !important; }
.contrato-doc { font-family: Georgia, 'Times New Roman', serif; font-size: 14px; line-height: 1.55; color: #111; background: #fff; padding: 28px 34px; border: 1px solid var(--borda, #e5e7eb); border-radius: 8px; max-height: 62vh; overflow: auto; }
.contrato-doc .contrato-titulo { font-size: 17px; text-align: center; margin: 0 0 18px; }
.contrato-doc .contrato-h { font-size: 14px; margin: 18px 0 6px; }
.contrato-doc .contrato-p { margin: 0 0 8px; text-align: justify; }
.contrato-doc .contrato-li { margin-left: 18px; }
.contrato-doc .contrato-ul { margin: 6px 0 10px 22px; padding: 0; text-align: justify; }
.contrato-doc .contrato-local { margin: 26px 0 30px; }
.contrato-doc .contrato-ass { display: flex; flex-wrap: wrap; gap: 28px; margin: 34px 0 12px; }
.contrato-doc .contrato-ass > div { flex: 1 1 200px; text-align: center; font-size: 12px; }
.contrato-doc .linha-ass { display: block; border-top: 1px solid #111; margin-bottom: 6px; }
.contrato-doc .campo-vazio { color: #b45309; }
@media print {
  body.imprimir-modal .contrato-doc { border: 0; padding: 0; max-height: none; overflow: visible; font-size: 12pt; }
  body.imprimir-modal .contrato-doc .contrato-h { break-after: avoid; }
  body.imprimir-modal .contrato-doc .contrato-ass { break-inside: avoid; }
}
.lista-aniv { list-style: none; margin: 0; padding: 0; }
.lista-aniv li { display: flex; gap: 12px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--borda, #e5e7eb); }
.lista-aniv .aniv-dia { min-width: 28px; font-variant-numeric: tabular-nums; }
.lista-aniv .aniv-hoje { background: rgba(245, 158, 11, .12); border-radius: 6px; padding-left: 6px; }

/* ações em massa do atendimento: quebram em várias linhas na coluna estreita */
.conv-acoes-massa { flex-wrap: wrap; }
.conv-massa-btns { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.conv-massa-btns[hidden] { display: none; }

/* Cabeçalho da conversa: identificação em duas linhas (nome + etiquetas / detalhes) e ações logo abaixo */
.chat-cab { height: auto !important; min-height: 60px !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 10px !important; padding: 12px 18px !important; }
.chat-cab .chat-id { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.chat-cab .chat-id-topo { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.chat-cab .chat-id-topo strong { font-size: 17px !important; line-height: 1.2; margin-right: 2px; }
.chat-cab .chat-id-info { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; }
.chat-cab .chat-id-info span { background: #fff; border: 1px solid #d1d7db; border-radius: 999px; padding: 2px 10px; font-size: 12px; color: #54656f; white-space: nowrap; }
.chat-cab .acoes-linha { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 10px; border-top: 1px solid #d1d7db; }
[data-tema="escuro"] .chat-cab .chat-id-info span { background: #111b21; border-color: #2a3942; color: #aebac1; }
[data-tema="escuro"] .chat-cab .acoes-linha { border-top-color: #2a3942; }

/* Ferramentas da conversa (acima do campo de mensagem): em linhas organizadas e com ocultar/mostrar */
.chat-escrever .chat-ferr-toggle { align-self: flex-start; background: transparent; border: 0; padding: 2px 4px; font: inherit; font-size: 12px; font-weight: 600; color: #54656f; cursor: pointer; border-radius: 6px; }
.chat-escrever .chat-ferr-toggle:hover { background: rgba(0, 0, 0, .06); }
.chat-ferramentas { flex-direction: column !important; align-items: stretch !important; gap: 8px !important; padding: 8px 10px; background: #fff; border: 1px solid #d1d7db; border-radius: 10px; }
.chat-ferramentas[hidden] { display: none !important; }
.chat-ferramentas .ferr-linha { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.chat-ferramentas .ferr-linha label { flex-direction: row !important; white-space: nowrap; }
.chat-ferramentas #chat-rapidas { flex: 1 1 200px; max-width: 360px; }
.chat-ferramentas .ferr-botoes { padding-top: 8px; border-top: 1px dashed #d1d7db; }
[data-tema="escuro"] .chat-ferramentas { background: #111b21; border-color: #2a3942; }
[data-tema="escuro"] .chat-escrever .chat-ferr-toggle { color: #aebac1; }

/* Botões de ação da conversa: uma linha só (rola de lado se faltar espaço) e modo reduzido só com ícones */
.chat-cab .acoes-linha { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: thin; padding-bottom: 6px; }
.chat-cab .acoes-linha .btn { flex: none; white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
.chat-cab .chat-acoes-toggle { margin-left: auto; font-size: 12px; }
.chat-cab.acoes-compactas .acoes-linha .tx { display: none; }
.chat-cab.acoes-compactas .acoes-linha .btn { padding: 4px 9px; }

/* Todos os botões sempre visíveis na linha: menores e, se faltar espaço, só ícones (nome no passar do mouse) */
.chat-cab .acoes-linha { overflow-x: scroll; overflow-y: hidden; padding-bottom: 8px; gap: 5px; scrollbar-width: thin; scrollbar-color: #8696a0 #dfe3e6; }
.chat-cab .acoes-linha::-webkit-scrollbar { height: 8px; }
.chat-cab .acoes-linha::-webkit-scrollbar-track { background: #dfe3e6; border-radius: 8px; }
.chat-cab .acoes-linha::-webkit-scrollbar-thumb { background: #8696a0; border-radius: 8px; }
.chat-cab .acoes-linha .btn { padding: 4px 9px; font-size: 12.5px; gap: 4px; }

/* Cabeçalho da conversa: a coluna não pode crescer com os botões (o wrap antigo fazia isso); a linha de botões é que rola de lado */
.chat-cab { flex-wrap: nowrap !important; min-width: 0; }
.chat-cab > * { min-width: 0; max-width: 100%; }
.chat-cab .acoes-linha { width: 100%; }

/* Linha de botões da conversa: FIXA (sem rolagem), em uma linha só e com todos os botões. Os botões se ajustam à largura da coluna:
   com espaço mostram o nome; apertando, ficam menores; sem espaço, só o ícone (o nome aparece ao passar o mouse). */
.chat-cab .acoes-linha { container-type: inline-size; overflow: hidden !important; flex-wrap: nowrap !important; gap: 4px; padding-bottom: 0; scrollbar-width: none; }
.chat-cab .acoes-linha::-webkit-scrollbar { display: none; }
.chat-cab .acoes-linha .btn { flex: 1 1 auto; min-width: 0; justify-content: center; padding: 4px 7px; font-size: 12px; gap: 3px; }
.chat-cab .acoes-linha .btn .tx { overflow: hidden; text-overflow: ellipsis; }
/* medido com os 11 botões: nomes cabem a partir de ~1010px (12px), ~900px (11px) e ~800px (10px); abaixo disso, só ícones */
@container (max-width: 1010px) { .chat-cab .acoes-linha .btn { padding: 4px 5px; font-size: 11px; } }
@container (max-width: 900px) { .chat-cab .acoes-linha .btn { padding: 4px 4px; font-size: 10px; gap: 2px; } }
@container (max-width: 800px) { .chat-cab .acoes-linha .tx { display: none; } .chat-cab .acoes-linha .btn { padding: 4px 6px; font-size: 14px; } }
@container (max-width: 340px) { .chat-cab .acoes-linha .btn { padding: 4px 2px; font-size: 12px; } }

/* Atendimentos: a tela rola mais (área de conversa com o dobro da altura) e os cabeçalhos ficam fixos; só a lista de conversas e o corpo das mensagens rolam por dentro */
.inbox { height: calc((100vh - 150px) * 2) !important; min-height: 900px !important; }
.inbox-lista > * { flex: none; }
.inbox-lista > .conv-lista { flex: 1 1 0 !important; min-height: 0 !important; overflow-y: auto !important; }
.chat-cab, .chat-escrever { flex: none !important; }
.chat-msgs { flex: 1 1 0 !important; min-height: 0 !important; overflow-y: auto !important; }

/* Imagens da conversa: clique para ampliar (como no WhatsApp) */
.msg-img { cursor: zoom-in; }
.lightbox { position: fixed; inset: 0; z-index: 10000; background: rgba(11, 20, 26, .94); display: flex; align-items: center; justify-content: center; }
.lightbox .lb-palco { max-width: 94vw; max-height: 88vh; overflow: auto; display: flex; }
.lightbox .lb-img { max-width: 94vw; max-height: 88vh; margin: auto; object-fit: contain; cursor: zoom-in; border-radius: 4px; }
.lightbox.zoom .lb-img { max-width: none; max-height: none; cursor: zoom-out; }
.lightbox button, .lightbox .lb-baixar { position: absolute; background: rgba(255, 255, 255, .12); color: #fff; border: 0; border-radius: 50%; width: 42px; height: 42px; font-size: 20px; line-height: 42px; text-align: center; text-decoration: none; cursor: pointer; }
.lightbox button:hover, .lightbox .lb-baixar:hover { background: rgba(255, 255, 255, .28); }
.lightbox .lb-fechar { top: 16px; right: 16px; }
.lightbox .lb-baixar { top: 16px; right: 68px; }
.lightbox .lb-ant { left: 16px; top: 50%; transform: translateY(-50%); font-size: 28px; }
.lightbox .lb-prox { right: 16px; top: 50%; transform: translateY(-50%); font-size: 28px; }
.lightbox .lb-info { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; color: #d1d7db; font-size: 13px; }

/* Galeria de mídias e arquivos da conversa */
.chat-cab .chat-galeria-btn { margin-left: auto; font-size: 12px; }
.chat-cab .chat-galeria-btn + .chat-acoes-toggle { margin-left: 0; }
.galeria-abas { display: flex; gap: 6px; flex-wrap: wrap; border-bottom: 1px solid var(--borda, #d1d7db); padding-bottom: 8px; margin-bottom: 12px; }
.galeria-abas button { border: 0; background: transparent; padding: 6px 12px; border-radius: 999px; font: inherit; font-size: 13px; font-weight: 600; color: #54656f; cursor: pointer; }
.galeria-abas button.ativo { background: #d9fdd3; color: #0b6e4f; }
.galeria-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; max-height: 60vh; overflow-y: auto; }
.galeria .gal-item { display: block; aspect-ratio: 1; overflow: hidden; border-radius: 8px; background: #e9edef; }
.galeria .gal-item img, .galeria .gal-item video { width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in; border-radius: 0; max-width: none; max-height: none; }
.galeria .gal-video video { cursor: default; }
.galeria-lista { list-style: none; margin: 0; padding: 0; max-height: 60vh; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.galeria-lista li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid #e9edef; border-radius: 10px; background: #fff; }
.galeria-lista .gal-ico { font-size: 22px; }
.galeria-lista .gal-nome { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.galeria-lista .gal-nome strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.galeria-lista .gal-nome small { color: #667781; }
.galeria-lista audio { width: 100%; max-width: 360px; }