:root {
  /* Identidade Resolut (extraída do logo) */
  --azul: #0C1C8C;
  --azul-escuro: #081569;
  --azul-claro: #EEF0FB;
  --bordo: #A61C41;
  --bordo-escuro: #841532;
  --bordo-claro: #FBEAEF;

  /* Cores funcionais */
  --verde: #15803D;
  --verde-claro: #E8F5EC;
  --vermelho: #DC2626;
  --vermelho-claro: #FDEAEA;
  --amarelo: #B45309;
  --amarelo-claro: #FCF1DF;
  /* Laranja fecha a gradação de severidade do aging de inadimplência:
     âmbar (até 30d) → laranja (31–60d) → vermelho (61–90d) → bordo (90+). */
  --laranja: #EA580C;
  --laranja-claro: #FDEDE3;

  /* Neutros */
  --branco: #FFFFFF;
  --cinza-50: #F7F8FB;
  --cinza-100: #F0F1F6;
  --cinza-200: #E4E6EE;
  --cinza-300: #D4D7E1;
  --cinza-500: #8A8FA3;
  --cinza-600: #686D80;
  --cinza-800: #262A38;

  --raio: 10px;
  --raio-lg: 14px;
  --sombra-sm: 0 1px 2px rgba(20,24,48,.05);
  --sombra-md: 0 4px 16px rgba(20,24,48,.07);
  --sombra-lg: 0 16px 40px rgba(20,24,48,.14);
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--cinza-50);
  color: var(--cinza-800);
  -webkit-font-smoothing: antialiased;
}
.oculto { display: none !important; }
button { font-family: inherit; }

/* ---------- Login ---------- */
.tela-login {
  height: 100vh;
  display: flex;
}
.login-painel-marca {
  flex: 1.1;
  background: linear-gradient(155deg, var(--azul-claro) 0%, #FFFFFF 55%, var(--bordo-claro) 100%);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0 64px;
  position: relative;
  overflow: hidden;
}
.login-painel-marca::before {
  content: '';
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(166,28,65,0.08), transparent 70%);
  top: -120px;
  right: -140px;
}
.login-painel-marca::after {
  content: '';
  position: absolute;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(12,28,140,0.07), transparent 70%);
  bottom: -160px;
  left: -120px;
}
.login-logo { height: 52px; margin-bottom: 28px; position: relative; z-index: 1; }
.login-frase {
  max-width: 360px; color: var(--cinza-600); font-size: 15px; line-height: 1.6;
  position: relative; z-index: 1;
}
.login-painel-form {
  flex: 1;
  background: var(--branco);
  display: flex;
  align-items: center;
  justify-content: center;
}
.login-card { width: 340px; }
.login-card h2 { margin: 0 0 4px; font-size: 22px; color: var(--cinza-800); }
.login-card .subtitulo { margin: 0 0 24px; color: var(--cinza-500); font-size: 13.5px; }
.login-card label { display: block; font-size: 13px; margin-bottom: 6px; color: var(--cinza-600); font-weight: 500; }
.login-card input {
  width: 100%; padding: 11px 12px; margin-bottom: 16px;
  border: 1px solid var(--cinza-300); border-radius: 8px; font-size: 14px; background: var(--cinza-50);
}
.login-card input:focus { outline: none; border-color: var(--azul); background: var(--branco); }
.login-card button {
  width: 100%; padding: 11px; background: var(--azul); color: white;
  border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer;
  transition: background .15s;
}
.login-card button:hover { background: var(--azul-escuro); }
.erro { color: var(--vermelho); font-size: 13px; min-height: 18px; margin: 10px 0 0; }

/* ---------- App shell ---------- */
.app { min-height: 100vh; display: flex; }

.sidebar {
  width: 232px;
  flex-shrink: 0;
  background: var(--branco);
  border-right: 1px solid var(--cinza-200);
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: sticky;
  top: 0;
  transition: width .15s ease;
}
.marca { padding: 22px 20px 18px; border-bottom: 1px solid var(--cinza-100); overflow: hidden; }
.marca-logo { height: 28px; }

/* Botão que recolhe a sidebar principal pra uma barra só de ícones (64px). Fica
   "grudado" na borda direita da sidebar, meio dentro meio fora, padrão comum de
   apps com navegação lateral (VS Code, Notion). Some/reaparece automaticamente
   conforme a regra em `_aplicarEstadoSidebar` (app.js) — ver comentário lá pra
   quando é automático vs. quando é preferência manual do usuário. */
.sidebar-toggle {
  position: absolute; top: 68px; right: -12px; z-index: 5;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--branco); border: 1px solid var(--cinza-300); color: var(--cinza-500);
  display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
  box-shadow: var(--sombra-sm); transition: color .12s, border-color .12s, transform .15s;
}
.sidebar-toggle:hover { color: var(--azul); border-color: var(--azul); }
.sidebar-toggle svg { width: 13px; height: 13px; }
.sidebar.recolhida .sidebar-toggle svg { transform: rotate(180deg); }

.nav-sidebar { flex: 1; padding: 14px 12px; display: flex; flex-direction: column; gap: 3px; overflow-y: auto; }
.nav-sidebar button {
  display: flex; align-items: center; gap: 11px;
  background: none; border: none; text-align: left;
  padding: 10px 12px; border-radius: 8px; cursor: pointer;
  font-size: 14px; color: var(--cinza-600); font-weight: 500;
  transition: background .12s, color .12s;
}
.nav-sidebar button:hover { background: var(--cinza-50); color: var(--cinza-800); }
.nav-sidebar button.ativa { background: var(--azul-claro); color: var(--azul); font-weight: 600; }
.icone-nav { display: flex; width: 19px; height: 19px; flex-shrink: 0; }
.icone-nav svg { width: 100%; height: 100%; }

/* Grupo em acordeão no menu lateral — hoje só "Configurações" (Financeiro tem sidebar
   secundária própria, ver .sidebar-secundaria abaixo). */
.nav-grupo { display: flex; flex-direction: column; margin-top: 6px; padding-top: 9px; border-top: 1px solid var(--cinza-100); }
.nav-grupo-toggle { justify-content: flex-start; }
.seta-grupo { margin-left: auto; font-size: 12px; color: var(--cinza-400); transition: transform .15s; }
.nav-grupo.aberto .seta-grupo { transform: rotate(180deg); }
.nav-subgrupo { display: flex; flex-direction: column; gap: 2px; max-height: 0; overflow: hidden; transition: max-height .2s ease; }
.nav-grupo.aberto .nav-subgrupo { max-height: 260px; }
.nav-subgrupo button { padding-left: 30px; font-size: 13.5px; }
.nav-subgrupo .icone-nav { width: 16px; height: 16px; }

/* Sidebar secundária do módulo Financeiro — coluna própria ao lado do menu principal,
   visível só quando uma página fin_* está aberta (toggle .oculto em marcarAbaAtiva).
   Existe para o módulo poder crescer (mais cadastros, depois Faturamento e Contas a
   Receber/Pagar) sem empurrar ou se misturar com a lista de módulos do menu principal. */
.sidebar-secundaria {
  width: 220px;
  flex-shrink: 0;
  background: var(--cinza-50);
  border-right: 1px solid var(--cinza-200);
  height: 100vh;
  position: sticky;
  top: 0;
  overflow-y: auto;
  padding: 20px 12px;
}
.sidebar-sec-cabecalho {
  display: flex; align-items: center; gap: 10px;
  padding: 0 8px 16px; margin-bottom: 10px; border-bottom: 1px solid var(--cinza-200);
  font-size: 15px; font-weight: 700; color: var(--cinza-800);
}
.sidebar-sec-cabecalho .icone-nav { width: 20px; height: 20px; color: var(--azul); }
.nav-sidebar-sec { display: flex; flex-direction: column; gap: 2px; }
.nav-sidebar-sec button {
  display: flex; align-items: center; gap: 10px;
  background: none; border: none; text-align: left;
  padding: 9px 10px; border-radius: 8px; cursor: pointer;
  font-size: 13.5px; color: var(--cinza-600); font-weight: 500;
  transition: background .12s, color .12s;
}
.nav-sidebar-sec button:hover { background: var(--branco); color: var(--cinza-800); }
.nav-sidebar-sec button.ativa { background: var(--azul-claro); color: var(--azul); font-weight: 600; }
.nav-sidebar-sec .icone-nav { width: 16px; height: 16px; }
.nav-sec-titulo {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--cinza-400); padding: 14px 10px 4px;
}
.nav-sec-titulo:first-child { padding-top: 2px; }

/* Sidebar principal RECOLHIDA — vira uma barra de 64px só com ícones. Ícone
   continua centralizado (o botão inteiro é clicável, mesma área de antes), e o
   rótulo de texto de cada item vira tooltip nativo (title="", setado em
   montarAbas/criarGrupoNav) em vez de sumir sem explicação. */
.sidebar.recolhida { width: 64px; }
.sidebar.recolhida .marca { padding: 22px 0 18px; display: flex; justify-content: center; }
.sidebar.recolhida .marca-logo { height: 22px; width: 22px; object-fit: cover; object-position: left; }
.sidebar.recolhida .nav-sidebar button { justify-content: center; padding: 10px 8px; }
.sidebar.recolhida .nav-sidebar button span:not(.icone-nav) { display: none; }
.sidebar.recolhida .seta-grupo { display: none; }
.sidebar.recolhida .nav-subgrupo { display: none; }
.sidebar.recolhida .usuario-card { justify-content: center; }
.sidebar.recolhida .usuario-info { display: none; }
.sidebar.recolhida .sidebar-rodape { padding: 14px 8px 18px; }
.sidebar.recolhida .btn-sair { padding: 8px 4px; font-size: 11.5px; }

.sidebar-rodape { padding: 14px 16px 18px; border-top: 1px solid var(--cinza-100); }
.usuario-card { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.avatar {
  width: 34px; height: 34px; border-radius: 50%; background: var(--azul); color: white;
  display: flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 700;
  flex-shrink: 0;
}
.usuario-info { display: flex; flex-direction: column; overflow: hidden; }
.usuario-info span { font-size: 13.5px; font-weight: 600; color: var(--cinza-800); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.usuario-info small { font-size: 11.5px; color: var(--cinza-500); }
.btn-sair {
  width: 100%; background: var(--cinza-50); border: 1px solid var(--cinza-200); color: var(--cinza-600);
  padding: 8px; border-radius: 7px; font-size: 13px; cursor: pointer; font-weight: 500;
}
.btn-sair:hover { background: var(--vermelho-claro); color: var(--vermelho); border-color: var(--vermelho-claro); }

.area-principal { flex: 1; min-width: 0; }
.conteudo { padding: 32px 40px; max-width: 1400px; margin: 0 auto; }

/* ---------- Cabeçalho de página ---------- */
.cabecalho-pagina { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 26px; gap: 16px; flex-wrap: wrap; }
h2.titulo-secao { margin: 0; font-size: 22px; font-weight: 700; color: var(--cinza-800); }
.subtitulo-pagina { margin: 4px 0 0; color: var(--cinza-500); font-size: 13.5px; }
.linha-topo-secao { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.contagem-resumo { color: var(--cinza-500); font-size: 13.5px; margin: -14px 0 16px; }
.estado-vazio { color: var(--cinza-500); font-size: 14px; background: var(--branco); border: 1px dashed var(--cinza-300); border-radius: var(--raio-lg); padding: 28px; text-align: center; }

/* ---------- Botões ---------- */
.btn-primario {
  background: var(--azul); color: white; border: none; padding: 10px 18px;
  border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600;
  transition: background .15s;
}
.btn-primario:hover { background: var(--azul-escuro); }
.btn-secundario {
  background: white; color: var(--azul); border: 1px solid var(--cinza-300); padding: 7px 14px;
  border-radius: 7px; cursor: pointer; font-size: 13px; font-weight: 500; transition: border-color .12s, color .12s;
}
.btn-secundario:hover { border-color: var(--azul); }
.btn-secundario:disabled, .nota-tarefa-input:disabled, input:disabled { opacity: .55; cursor: not-allowed; }

/* ---------- Campos de formulário padrão (.form-group / .input-padrao) ----------
   Usadas em praticamente todo formulário/modal do sistema. Nunca tinham estilo próprio:
   o label (elemento inline, sem display:block) ficava colado ao input na mesma linha, e o
   input dependia só da aparência nativa do navegador/SO — inconsistente entre Mac/Windows
   e sem espaçamento vertical quando vários .form-group ficavam empilhados fora de um
   .form-2col. Corrigido aqui, na base, para consertar automaticamente todos os formulários
   que já usam essas classes, não só um formulário específico. */
.form-group { margin-bottom: 12px; }
.form-group:last-child { margin-bottom: 0; }
.form-group label { display: block; font-size: 13px; font-weight: 500; color: var(--cinza-600); margin-bottom: 5px; }
.input-padrao {
  display: block; width: 100%; padding: 9px 12px; border: 1px solid var(--cinza-300); border-radius: 8px;
  font-size: 14px; font-family: inherit; background: var(--branco); color: var(--cinza-800);
  transition: border-color .12s, box-shadow .12s;
}
.input-padrao:focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro); }
.input-padrao::placeholder { color: var(--cinza-400); }
select.input-padrao { cursor: pointer; }
textarea.input-padrao { resize: vertical; min-height: 60px; }

/* ---------- Avatares ---------- */
.avatar-cliente, .avatar-mini {
  border-radius: 9px; background: var(--azul-claro); color: var(--azul); font-weight: 700;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.avatar-cliente { width: 42px; height: 42px; font-size: 14px; }
.avatar-mini { width: 30px; height: 30px; font-size: 11.5px; border-radius: 50%; }

/* ---------- Cards de cliente ---------- */
.grade-clientes { display: grid; gap: 10px; }
.card-cliente {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 16px 18px; cursor: pointer; display: flex; align-items: center; gap: 14px;
  box-shadow: var(--sombra-sm); transition: box-shadow .15s, border-color .15s;
}
.card-cliente:hover { box-shadow: var(--sombra-md); border-color: var(--cinza-300); }
.card-cliente .info { flex: 1; min-width: 0; }
.card-cliente .nome { font-weight: 600; font-size: 14.5px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card-cliente .meta { color: var(--cinza-500); font-size: 12.5px; margin-top: 4px; }
.card-cliente-status { text-align: right; flex-shrink: 0; }
.barra-progresso {
  height: 7px; background: var(--cinza-100); border-radius: 4px; overflow: hidden; margin-top: 8px; width: 100%; max-width: 240px;
}
.barra-progresso .preenchido { height: 100%; background: linear-gradient(90deg, var(--azul), #60a5fa); border-radius: 4px; }
.selo {
  font-size: 11px; padding: 3px 9px; border-radius: 20px; font-weight: 600; white-space: nowrap; display: inline-block;
}
.selo.atrasada { background: var(--vermelho-claro); color: var(--vermelho); }
.selo.concluido { background: var(--verde-claro); color: var(--verde); }
.selo.andamento { background: var(--azul-claro); color: var(--azul); }
.selo.novo { background: var(--amarelo-claro); color: var(--amarelo); }
.selo.transicao { background: var(--bordo-claro); color: var(--bordo); }
.selo.arquivado { background: var(--cinza-200); color: var(--cinza-600); }
.selo.recusado { background: var(--laranja-claro); color: var(--laranja); }

/* ---------- Seção colapsável de clientes finalizados no Onboarding ---------- */
.ob-secao-finalizados { margin-top: 24px; }
.ob-toggle-finalizados {
  background: none; border: none; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--cinza-500);
  padding: 6px 0; display: flex; align-items: center; gap: 6px;
  transition: color .15s;
}
.ob-toggle-finalizados:hover { color: var(--cinza-700); }
.ob-grade-finalizados { margin-top: 10px; opacity: .85; }

/* ---------- Ações sobre o cliente (arquivar/excluir) ---------- */
.card-cliente-acoes { display: none; gap: 6px; margin-top: 8px; justify-content: flex-end; flex-wrap: wrap; }
.card-cliente:hover .card-cliente-acoes { display: flex; }
.card-cliente-acoes button { font-size: 11.5px; padding: 5px 10px; }
.card-cliente-acoes .btn-excluir-cliente:hover { border-color: var(--vermelho); color: var(--vermelho); }
.acoes-cliente-modal { display: flex; gap: 8px; margin: 10px 0 18px; flex-wrap: wrap; }
.acoes-cliente-modal #btn-excluir-cliente-modal:hover { border-color: var(--vermelho); color: var(--vermelho); }

/* ---------- Filtro de empresa em Minhas Tarefas ---------- */
.filtro-minhas-tarefas {
  display: flex; align-items: center; gap: 10px; margin: 0 0 18px;
  background: var(--azul-claro); border: 1px solid var(--cinza-200); border-radius: var(--raio);
  padding: 12px 16px;
}
.filtro-minhas-tarefas label {
  font-size: 13px; color: var(--azul); font-weight: 700; white-space: nowrap;
}
.filtro-minhas-tarefas select {
  padding: 9px 12px; border: 1.5px solid var(--azul); border-radius: 7px; font-size: 13.5px;
  font-family: inherit; font-weight: 600; background: white; color: var(--cinza-800);
  max-width: 320px; flex: 1; cursor: pointer;
}
.filtro-minhas-tarefas select:focus { outline: none; border-color: var(--azul-escuro); box-shadow: 0 0 0 3px rgba(12,28,140,.12); }

/* ---------- Tarefas / etapas ---------- */
.etapa-bloco { margin-bottom: 20px; }
.etapa-titulo {
  font-weight: 700; font-size: 13px; margin-bottom: 8px; display: flex; justify-content: space-between;
  color: var(--cinza-500); text-transform: uppercase; letter-spacing: .04em;
}
.lista-tarefas { display: flex; flex-direction: column; gap: 6px; }
.item-tarefa {
  display: flex; align-items: flex-start; gap: 10px; background: white; border: 1px solid var(--cinza-200);
  border-radius: 9px; padding: 11px 13px;
}
.item-tarefa.concluida { opacity: .6; }
.item-tarefa input[type="checkbox"] { margin-top: 3px; width: 18px; height: 18px; cursor: pointer; accent-color: var(--azul); }
.item-tarefa .desc { flex: 1; }
.item-tarefa .desc .titulo-tarefa { font-size: 14px; font-weight: 500; }
.item-tarefa .desc .titulo-tarefa.riscado { text-decoration: line-through; color: var(--cinza-500); }
.item-tarefa .desc .detalhe { font-size: 12px; color: var(--cinza-500); margin-top: 3px; }
.tag-setor {
  font-size: 11px; background: var(--cinza-100); padding: 2px 8px; border-radius: 10px; color: var(--cinza-600); font-weight: 500;
}

/* ---------- Observação/pendência por tarefa ---------- */
.bloco-nota-tarefa { display: flex; gap: 8px; align-items: flex-start; margin-top: 9px; }
.nota-tarefa-input {
  flex: 1; font-size: 12.5px; padding: 7px 9px; border: 1px solid var(--cinza-200); border-radius: 7px;
  resize: vertical; font-family: inherit; min-height: 32px; background: var(--cinza-50);
}
.nota-tarefa-input:focus { outline: none; border-color: var(--azul); background: white; }
.bloco-nota-tarefa .btn-salvar-nota { font-size: 12px; padding: 7px 12px; white-space: nowrap; }

/* ---------- Introdução/briefing do cliente ---------- */
.bloco-introducao {
  background: var(--azul-claro); border-radius: var(--raio-lg); padding: 16px 18px; margin: 16px 0 22px;
}
.bloco-introducao h3 { font-size: 13.5px; color: var(--azul); margin-bottom: 9px; text-transform: uppercase; letter-spacing: .03em; }
.bloco-introducao textarea {
  width: 100%; padding: 10px; border: 1px solid var(--cinza-300); border-radius: 7px; font-size: 13.5px;
  font-family: inherit; margin-bottom: 9px; background: white;
}

/* ---------- Usuários e Acessos ---------- */
.lista-usuarios { display: flex; flex-direction: column; gap: 8px; }
.item-usuario {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio); padding: 13px 16px;
  display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  box-shadow: var(--sombra-sm);
}
.item-usuario.inativo { opacity: .55; }
.info-usuario { display: flex; align-items: center; gap: 12px; }
.item-usuario .nome-usuario { font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 8px; }
.item-usuario .email-usuario { font-size: 12px; color: var(--cinza-500); margin-top: 2px; }
.item-usuario .acoes-usuario { display: flex; gap: 8px; flex-wrap: wrap; }
.tags-acessos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }

/* ---------- Notificações ---------- */
.lista-notificacoes { display: flex; flex-direction: column; gap: 8px; }
.notificacao {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio); padding: 13px 15px; font-size: 14px;
  cursor: default;
}
.notificacao.nao-lida { border-left: 3px solid var(--azul); cursor: pointer; }
.notificacao .quando { font-size: 12px; color: var(--cinza-500); margin-top: 5px; }

/* ---------- Stat cards ---------- */
.grade-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 28px; }
.com-mes-titulo { font-size: 12.5px; color: var(--cinza-500); margin: 4px 0 10px; }
.com-mes-titulo strong { color: var(--cinza-700); text-transform: capitalize; }
.stat-card {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg); padding: 18px;
  display: flex; align-items: center; gap: 14px; box-shadow: var(--sombra-sm);
}
.stat-icone { width: 42px; height: 42px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.stat-icone svg { width: 21px; height: 21px; }
.stat-icone-azul { background: var(--azul-claro); color: var(--azul); }
.stat-icone-bordo { background: var(--bordo-claro); color: var(--bordo); }
.stat-icone-verde { background: var(--verde-claro); color: var(--verde); }
.stat-icone-alerta { background: var(--amarelo-claro); color: var(--amarelo); }
.stat-icone-cinza { background: var(--cinza-100); color: var(--cinza-600); }
.stat-icone-vermelho { background: var(--vermelho-claro); color: var(--vermelho); }
.stat-card .num { font-size: 24px; font-weight: 700; color: var(--cinza-800); line-height: 1.2; }
.stat-card .label { color: var(--cinza-500); font-size: 12.5px; }

/* ---------- Painéis de processos (dashboard) ---------- */
.painel {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  margin-bottom: 20px; box-shadow: var(--sombra-sm); overflow: hidden;
}
.painel-cabecalho { padding: 16px 20px; border-bottom: 1px solid var(--cinza-100); display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.painel-cabecalho h3 { margin: 0; font-size: 15px; font-weight: 700; color: var(--cinza-800); display: flex; align-items: center; gap: 8px; }
.contador-painel { background: var(--cinza-100); color: var(--cinza-600); font-size: 12px; font-weight: 700; padding: 2px 9px; border-radius: 20px; }
.painel .estado-vazio { border: none; border-radius: 0; margin: 0; }
.painel-destaque { border-color: var(--azul); border-left: 4px solid var(--azul); }
/* ---------- Dashboard Financeiro (Financeiro > Dashboard) ---------- */
.fdash-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}
.fdash-card {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  box-shadow: var(--sombra-sm); padding: 18px 20px; display: flex; flex-direction: column; gap: 10px;
  transition: box-shadow .15s;
  flex: 1 1 215px;
  min-width: 0;
}
.fdash-card:hover { box-shadow: var(--sombra-md); }
.fdash-card-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fdash-card-titulo { font-size: 13px; font-weight: 700; color: var(--cinza-600); margin: 0; }
.fdash-icone { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.fdash-icone svg { width: 19px; height: 19px; }
.fdash-icone-azul     { background: var(--azul-claro);     color: var(--azul); }
.fdash-icone-verde    { background: var(--verde-claro);    color: var(--verde); }
.fdash-icone-vermelho { background: var(--vermelho-claro); color: var(--vermelho); }
.fdash-icone-amarelo  { background: var(--amarelo-claro);  color: var(--amarelo); }
.fdash-icone-bordo    { background: var(--bordo-claro);    color: var(--bordo); }
.fdash-icone-cinza    { background: var(--cinza-100);      color: var(--cinza-600); }

/* Card "hero" — 1 número grande (MRR, Contratos Ativos, Growth Rate...) */
.fdash-hero-num { font-size: 25px; font-weight: 800; color: var(--cinza-800); line-height: 1.15; letter-spacing: -.3px; }
.fdash-hero-periodo { font-size: 11.5px; color: var(--cinza-500); font-weight: 600; text-transform: capitalize; }
.fdash-hero-sub { font-size: 12.5px; color: var(--cinza-500); }

/* Selo de tendência ao lado do número principal (Growth Rate junto do MRR) */
.fdash-trend-pill {
  display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 700;
  padding: 3px 10px; border-radius: 20px; width: fit-content;
}
.fdash-trend-pill.pos { background: var(--verde-claro); color: var(--verde); }
.fdash-trend-pill.neg { background: var(--vermelho-claro); color: var(--vermelho); }
.fdash-trend-pill.neutro { background: var(--cinza-100); color: var(--cinza-600); }

/* Risco (Inadimplência) ganha uma borda de aviso — única exceção à borda neutra
   dos outros cards, pra chamar atenção sem precisar de mais um card só de alerta. */
.fdash-card-risco { border-left: 3px solid var(--vermelho); }

/* Card "lista" — vários valores rotulados dentro do mesmo card (Contas a Receber, Saldo...) */
.fdash-lista { display: flex; flex-direction: column; gap: 9px; margin-top: 2px; }
.fdash-lista-linha { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-size: 13px; }
.fdash-lista-linha .rotulo { color: var(--cinza-600); }
.fdash-lista-linha .valor { font-weight: 700; color: var(--cinza-800); white-space: nowrap; }
.fdash-lista-linha.risco .valor { color: var(--vermelho); }
.fdash-lista-linha.aviso .valor { color: var(--amarelo); }
.fdash-lista-linha.total { border-top: 1px solid var(--cinza-100); padding-top: 9px; margin-top: 1px; }
.fdash-lista-linha.total .rotulo { font-weight: 700; color: var(--cinza-800); }
.fdash-lista-linha.total .valor { color: var(--azul); font-size: 15.5px; }
.fdash-conta-principal { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-bottom: 9px; border-bottom: 1px solid var(--cinza-100); }
.fdash-conta-principal .rotulo { font-size: 13px; font-weight: 700; color: var(--cinza-800); }
.fdash-conta-principal .valor { font-size: 20px; font-weight: 800; color: var(--azul); white-space: nowrap; }
.fdash-lista-vazio { font-size: 12.5px; color: var(--cinza-500); }

.fdash-card-span2 { flex: 2 1 460px; }
.fdash-card-span3 { flex: 3 1 700px; }

/* Card clicável do Dashboard — abre a tela de detalhamento (fin_detalhe) ou navega
   pra uma página já existente do módulo. Borda azul + leve elevação no hover, pra
   diferenciar de um card comum (que só reage com sombra, sem indicar ação). */
.fdash-card-clicavel { cursor: pointer; transition: box-shadow .15s, border-color .15s, transform .1s; }
.fdash-card-clicavel:hover { border-color: var(--azul); transform: translateY(-1px); }

/* ══════ Dashboard revisado para escritório contábil (20/09) ══════
   Sistema de cor com 4 sentidos fixos, usado em TODO o dashboard — é o que permite
   identificar a informação relevante sem ler rótulo:
     verde    = dinheiro entrando / resultado positivo / saúde
     vermelho = saída, risco alto, resultado negativo
     amarelo  = atenção que ainda não é urgente
     azul     = informação neutra (saldo, MRR, contratos)
   Nenhuma cor aparece fora desse significado. */

/* Título de seção — cada bloco do dashboard responde uma pergunta de negócio
   ("quanto sobrou", "quem está devendo"), e o rótulo é o que deixa isso explícito. */
.fdash-secao { display: flex; align-items: baseline; gap: 10px; margin: 30px 0 12px; flex-wrap: wrap; }
.fdash-secao:first-child { margin-top: 0; }
.fdash-secao-titulo {
  font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--cinza-800); margin: 0;
}
.fdash-secao-sub { font-size: 12.5px; color: var(--cinza-500); }

/* Card "hero" do Resultado — único card com peso visual maior, porque é a pergunta
   principal do dono do escritório. A borda superior colorida dá o veredito (sobrou /
   faltou) antes mesmo de ler o número. */
.fdash-card-hero { flex: 2 1 380px; border-top: 3px solid var(--cinza-300); }
.fdash-card-hero .fdash-hero-num { font-size: 34px; }
.fdash-hero-pos { border-top-color: var(--verde); }
.fdash-hero-neg { border-top-color: var(--vermelho); }
.fdash-num-pos { color: var(--verde); }
.fdash-num-neg { color: var(--vermelho); }
.fdash-num-aviso { color: var(--amarelo); }
.fdash-tag-regime {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  background: var(--cinza-100); color: var(--cinza-600); padding: 2px 7px; border-radius: 20px; margin-left: 6px;
}
.fdash-card-aviso { border-left: 3px solid var(--amarelo); }

/* Cores semânticas nas linhas de lista (entrada/saída/risco/aviso) */
.fdash-lista-linha.entrada .valor { color: var(--verde); }
.fdash-lista-linha.saida .valor { color: var(--vermelho); }

/* Barra proporcional horizontal — comparar tamanho é mais rápido que comparar número.
   Usada no aging, na taxa de recebimento, na concentração e nas despesas. */
.fdash-barra-h { height: 6px; background: var(--cinza-100); border-radius: 4px; overflow: hidden; margin-top: 6px; }
.fdash-barra-h span { display: block; height: 100%; border-radius: 4px; transition: width .3s ease; }

/* Aging da inadimplência — cada faixa traz valor, barra proporcional e o
   encaminhamento de cobrança já escrito ("Cobrança formal", "Avaliar suspensão"). */
.fdash-inad-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 4px; }
.fdash-aging { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px 22px; margin-top: 12px; }
.fdash-aging-linha { min-width: 0; }
.fdash-aging-topo { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.fdash-aging-rotulo { font-size: 12.5px; color: var(--cinza-600); display: inline-flex; align-items: center; gap: 6px; }
.fdash-aging-valor { font-size: 13.5px; font-weight: 700; color: var(--cinza-800); white-space: nowrap; }
.fdash-aging-acao { font-size: 11.5px; color: var(--cinza-500); margin-top: 5px; }
.fdash-ponto-faixa { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }

.fdash-devedores { min-width: 200px; }
.fdash-devedores-titulo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--cinza-500); margin: 0 0 6px; }
.fdash-devedor { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; padding: 3px 0; }
.fdash-devedor span { color: var(--cinza-600); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fdash-devedor strong { color: var(--cinza-800); white-space: nowrap; }
.fdash-devedor small { color: var(--vermelho); font-weight: 600; white-space: nowrap; }

/* Movimentação da carteira — cada linha é um botão que abre o detalhe daquela
   categoria (substitui os 6 cards soltos que existiam antes). */
.fdash-mov-linhas { display: flex; flex-direction: column; gap: 2px; margin-top: 10px; }
.fdash-mov-linha {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  background: none; border: none; width: 100%; text-align: left; cursor: pointer;
  padding: 6px 8px; margin: 0 -8px; border-radius: 7px; font-size: 12.5px; font-family: inherit;
  transition: background .12s;
}
.fdash-mov-linha:hover { background: var(--cinza-50); }
.fdash-mov-linha .rotulo { color: var(--cinza-600); }
.fdash-mov-linha .valor { font-weight: 700; color: var(--cinza-800); white-space: nowrap; }
.fdash-mov-linha .valor.pos { color: var(--verde); }
.fdash-mov-linha .valor.neg { color: var(--vermelho); }

.fdash-categorias { display: flex; flex-direction: column; gap: 11px; margin-top: 14px; }
.fdash-cat-linha { min-width: 0; }

/* Resultado por mês, escrito abaixo de cada par de barras do gráfico Receita × Despesa —
   a cor da barra mostra o tamanho, mas só o número diz se sobrou ou faltou. */
.fdash-barras-com-saldo { height: 156px; }
.fdash-barra-saldo { font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.fdash-barra-saldo.pos { color: var(--verde); }
.fdash-barra-saldo.neg { color: var(--vermelho); }

.fdash-acoes-rodape { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; }

/* DRE do detalhamento de Resultado */
.fdet-dre { display: flex; flex-direction: column; gap: 2px; }
.fdet-dre-linha {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  font-size: 14px; padding: 9px 0; border-bottom: 1px solid var(--cinza-100);
}
.fdet-dre-linha:last-child { border-bottom: none; }
.fdet-dre-linha span { color: var(--cinza-600); }
.fdet-dre-linha strong { color: var(--cinza-800); }
.fdet-dre-linha.pos strong { color: var(--verde); }
.fdet-dre-linha.neg strong { color: var(--vermelho); }
.fdet-total-neg { color: var(--vermelho) !important; }
.fdet-linha-destaque { background: var(--azul-claro); }

/* ══════ Relatórios do Financeiro (séries históricas, 20/09) ══════ */
/* Variação percentual nas tabelas — verde/vermelho seguem o mesmo significado do
   resto do módulo (verde = melhorou), com seta porque cor sozinha não é dado. */
.rel-var { font-weight: 700; white-space: nowrap; font-size: 12.5px; }
.rel-var.pos { color: var(--verde); }
.rel-var.neg { color: var(--vermelho); }
.rel-var.neutro { color: var(--cinza-500); font-weight: 600; }

.rel-num-verde { color: var(--verde); }
.rel-num-amarelo { color: var(--amarelo); }
.rel-num-vermelho { color: var(--vermelho); }

/* Selo do índice — a cor traduz a régua de saúde (até 3% saudável, até 8% tolerável,
   acima disso a cobrança não está funcionando) sem precisar do rodapé explicando. */
.rel-badge-indice {
  display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 9px;
  border-radius: 20px; white-space: nowrap;
}
.rel-badge-verde { background: var(--verde-claro); color: var(--verde); }
.rel-badge-amarelo { background: var(--amarelo-claro); color: var(--amarelo); }
.rel-badge-laranja { background: var(--laranja-claro); color: var(--laranja); }
.rel-badge-vermelho { background: var(--vermelho-claro); color: var(--vermelho); }
.rel-badge-cinza { background: var(--cinza-100); color: var(--cinza-600); }

/* Mês sem cobrança vencida: fica visível (a ausência é informação) mas esmaecido,
   pra não competir com os meses que têm número. */
.rel-linha-vazia td { opacity: .5; }

/* Mês em andamento — regra permanente do projeto: período em curso nunca pode ser lido
   como fechado. Fundo levemente destacado + selo, no mesmo espírito da coluna tracejada
   já usada no Dashboard de Comunicação. */
.rel-linha-corrente td { background: var(--azul-claro); }

/* Nota de rodapé de tabela. Classe própria porque `.fdash-hero-periodo` carrega
   `text-transform: capitalize` (pensado para o rótulo de competência) e transformava
   frases inteiras em "Cada Palavra Maiúscula" — mesmo tropeço já corrigido no Dashboard. */
.rel-nota-rodape { font-size: 11.5px; color: var(--cinza-500); font-weight: 500; line-height: 1.5; }
.rel-selo-corrente {
  display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .3px;
  text-transform: uppercase; padding: 1px 7px; border-radius: 20px; margin-left: 7px;
  background: #fff; color: var(--azul); border: 1px dashed var(--azul);
  vertical-align: middle;
}
.rel-linha-total td { border-top: 2px solid var(--cinza-300); background: var(--cinza-50); }

/* Bloco que explica a diferença entre os dois índices — a tela do sistema anterior
   mostrava os dois lado a lado sem dizer o que cada um significa, e é exatamente aí
   que o número vira ruído. */
.rel-explica { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.rel-explica > div { background: var(--cinza-50); border-radius: var(--raio); padding: 14px 16px; }
.rel-explica strong { display: block; font-size: 13.5px; color: var(--cinza-800); margin-bottom: 5px; }
.rel-explica span { font-size: 12.5px; color: var(--cinza-600); line-height: 1.55; }

@media (max-width: 720px) { .rel-explica { grid-template-columns: 1fr; } }

/* Gráfico de linha (Fluxo de Caixa Projetado) — SVG puro, sem biblioteca externa */
.fdash-chart-wrap { width: 100%; overflow: visible; }
.fdash-chart-legenda { display: flex; gap: 16px; flex-wrap: wrap; font-size: 11.5px; color: var(--cinza-600); margin-top: 2px; }
.fdash-chart-legenda span { display: inline-flex; align-items: center; gap: 5px; }
.fdash-chart-legenda .ponto { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }

/* Gráfico de barras (Novos x Encerrados) */
.fdash-barras { display: flex; align-items: flex-end; gap: 12px; height: 120px; padding-top: 8px; }
.fdash-barra-grupo { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; justify-content: flex-end; min-width: 0; }
.fdash-barra-par { display: flex; align-items: flex-end; gap: 3px; height: 100%; width: 100%; justify-content: center; }
.fdash-barra { width: 40%; max-width: 16px; border-radius: 4px 4px 0 0; min-height: 3px; }
.fdash-barra-mes { font-size: 10.5px; color: var(--cinza-500); font-weight: 600; text-transform: capitalize; white-space: nowrap; }

.ponto-inc-tag {
  display: inline-block; font-size: 10.5px; font-weight: 700;
  padding: 0 6px; border-radius: 20px;
  background: var(--amarelo-claro, #fbefd7); color: var(--amarelo, #9a5b00);
}

/* ---------- Filtro Pendentes/Resolvidas (Acompanhamento) ---------- */
.filtro-solicitacoes { display: flex; gap: 6px; }
.btn-filtro-solicitacao {
  background: var(--cinza-100); color: var(--cinza-600); border: 1px solid transparent; border-radius: 20px;
  padding: 5px 13px; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: background .12s, color .12s;
}
.btn-filtro-solicitacao:hover { background: var(--cinza-200); }
.btn-filtro-solicitacao.ativo { background: var(--bordo); color: white; }

/* Filtro de tipo de certificado (eCNPJ / eCPF) */
.btn-filtro-tipo-cert {
  background: var(--cinza-100); color: var(--cinza-600); border: 1px solid transparent; border-radius: 20px;
  padding: 5px 13px; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: background .12s, color .12s;
}
.btn-filtro-tipo-cert:hover { background: var(--cinza-200); }
.btn-filtro-tipo-cert.ativo { background: #2563eb; color: white; }

/* ---------- Solicitações agrupadas por cliente (Acompanhamento) ---------- */
.lista-grupos-solicitacoes { display: flex; flex-direction: column; gap: 12px; padding: 16px 20px; }
.grupo-solicitacoes-cliente { border: 1px solid var(--cinza-200); border-radius: var(--raio); overflow: hidden; }
.grupo-solicitacoes-cliente .grupo-cliente-cabecalho { border: none; border-radius: 0; background: var(--cinza-50); cursor: pointer; }
.grupo-solicitacoes-cliente .lista-usuarios { padding: 10px; background: white; }

.tabela-processos { display: flex; flex-direction: column; }
.tabela-linha {
  display: grid; grid-template-columns: 2.2fr 1fr 1.6fr 1fr 1.2fr;
  align-items: center; gap: 12px; padding: 13px 20px; font-size: 13.5px;
  border-bottom: 1px solid var(--cinza-100);
}
.tabela-linha:last-child { border-bottom: none; }
.tabela-linha[data-id] { cursor: pointer; transition: background .12s; }
.tabela-linha[data-id]:hover { background: var(--cinza-50); }
.tabela-cabecalho {
  font-size: 11.5px; text-transform: uppercase; letter-spacing: .03em; color: var(--cinza-500); font-weight: 700;
  background: var(--cinza-50);
}
.celula-cliente { display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--cinza-800); }
.celula-progresso { display: flex; flex-direction: column; gap: 4px; }
.celula-progresso small { color: var(--cinza-500); font-size: 11.5px; }

/* ---------- Atrasos por setor (Visão Geral) ---------- */
.grade-atrasos-setor { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; padding: 16px 20px; }
.bloco-atraso-setor { background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: var(--raio); padding: 12px 14px; }
.bloco-atraso-cabecalho { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; gap: 8px; }
.lista-atraso-itens { display: flex; flex-direction: column; gap: 6px; }
.grupo-cliente-cabecalho {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  background: white; border: 1px solid var(--cinza-200); border-radius: 7px;
  padding: 8px 10px; font-size: 12.5px; cursor: pointer; transition: border-color .12s;
}
.grupo-cliente-cabecalho:hover { border-color: var(--bordo); }
.grupo-cliente-cabecalho:hover .cliente-atraso-nome { color: var(--bordo); }
.cliente-atraso-nome { font-weight: 700; font-size: 12.5px; color: var(--cinza-800); }

/* ---------- Checklist-modelo (editor do gestor) ---------- */
.lista-checklist-itens { display: flex; flex-direction: column; }
.linha-checklist-item {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 14px;
  padding: 13px 20px; border-bottom: 1px solid var(--cinza-100);
}
.linha-checklist-item:last-child { border-bottom: none; }
.checklist-item-desc { flex: 1; min-width: 0; }
.checklist-item-titulo { font-size: 14px; font-weight: 600; color: var(--cinza-800); }
.checklist-item-meta { font-size: 12px; color: var(--cinza-500); margin-top: 3px; }
.checklist-item-acoes { display: flex; gap: 8px; flex-shrink: 0; }

/* ---------- Modal ---------- */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(15,18,32,.45); display: flex;
  align-items: flex-start; justify-content: center; padding: 40px 16px; overflow-y: auto; z-index: 50;
}
.modal {
  background: white; border-radius: var(--raio-lg); padding: 26px; width: 100%; max-width: 720px;
  box-shadow: var(--sombra-lg);
}
.modal-largo { max-width: 980px; }
.modal h2 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 19px; }
.modal-fechar { float: right; background: none; border: none; font-size: 22px; cursor: pointer; color: var(--cinza-500); line-height: 1; }
.modal-fechar:hover { color: var(--cinza-800); }
.campo { margin-bottom: 14px; }
.campo label { display: block; font-size: 13px; color: var(--cinza-600); margin-bottom: 5px; font-weight: 500; }
.campo input, .campo select, .campo textarea {
  width: 100%; padding: 10px; border: 1px solid var(--cinza-300); border-radius: 7px; font-size: 14px; font-family: inherit;
}
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--azul); }

/* ---------- Setores em lista de checkbox (Usuários) ---------- */
.lista-checkbox-setores { display: flex; flex-wrap: wrap; gap: 8px; }
.opcao-checkbox-setor {
  display: flex; align-items: center; gap: 6px; background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 20px; padding: 6px 12px; font-size: 13px; cursor: pointer; font-weight: 500;
}
.opcao-checkbox-setor input { width: auto; padding: 0; accent-color: var(--azul); cursor: pointer; }
.lista-comentarios { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; max-height: 220px; overflow-y: auto; }
.comentario { background: var(--cinza-50); border-radius: 8px; padding: 9px 11px; font-size: 13px; }
.comentario .autor { font-weight: 600; }
.comentario .quando { color: var(--cinza-500); font-size: 11px; }

/* ---------- Trâmite (conversa dentro de uma solicitação de acompanhamento) ---------- */
.tramite-caixa {
  flex: 1 1 100%; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--cinza-200);
}
.tramite-cabecalho {
  display: flex; align-items: center; gap: 6px; margin-bottom: 6px;
}
.tramite-cabecalho-icone { width: 14px; height: 14px; color: var(--azul); display: flex; }
.tramite-cabecalho-icone svg { width: 14px; height: 14px; }
.tramite-cabecalho-titulo {
  font-size: 11.5px; font-weight: 700; color: var(--cinza-600); text-transform: uppercase; letter-spacing: .04em;
}
.tramite-contador {
  background: var(--azul-claro); color: var(--azul); font-size: 11px; font-weight: 700;
  border-radius: 20px; padding: 1px 7px; line-height: 1.5;
}

.tramites-thread {
  display: flex; flex-direction: column; gap: 8px; max-height: 230px; overflow-y: auto;
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px; padding: 10px;
}

.tramite-msg { display: flex; width: 100%; }
.tramite-msg.tramite-minha { justify-content: flex-end; }
.tramite-msg.tramite-outro { justify-content: flex-start; }

.tramite-bolha {
  max-width: 78%; padding: 7px 10px; border-radius: 12px; font-size: 12.5px; line-height: 1.4;
}
.tramite-minha .tramite-bolha { background: var(--azul); color: white; border-bottom-right-radius: 3px; }
.tramite-outro .tramite-bolha { background: white; border: 1px solid var(--cinza-200); color: var(--cinza-800); border-bottom-left-radius: 3px; }
.tramite-bolha-autor { font-weight: 700; font-size: 11px; color: var(--azul); margin-bottom: 2px; }
.tramite-bolha-texto { white-space: pre-wrap; word-break: break-word; }
.tramite-bolha-hora { font-size: 10px; margin-top: 3px; }
.tramite-minha .tramite-bolha-hora { color: rgba(255,255,255,.75); text-align: right; }
.tramite-outro .tramite-bolha-hora { color: var(--cinza-500); }

.tramite-msg.tramite-do-sistema {
  justify-content: center; align-items: center; gap: 6px; font-size: 11px; font-style: italic; color: var(--cinza-500);
  text-align: center;
}
.tramite-do-sistema span:first-child {
  background: var(--cinza-100); border: 1px dashed var(--cinza-300); border-radius: 20px; padding: 4px 10px;
}
.tramite-msg-hora { font-size: 10px; opacity: .8; flex-shrink: 0; }

.tramite-vazio {
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 10px;
  color: var(--cinza-500); font-size: 12px; text-align: center;
}
.tramite-vazio-icone svg { width: 26px; height: 26px; opacity: .45; }

.form-tramite {
  display: flex; gap: 8px; align-items: flex-end; margin-top: 8px;
}
.form-tramite .tramite-input {
  flex: 1; resize: none; padding: 9px 14px; border: 1px solid var(--cinza-300); border-radius: 18px;
  font-size: 13px; font-family: inherit; line-height: 1.4; max-height: 90px; overflow-y: auto;
}
.form-tramite .tramite-input:focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 2px var(--azul-claro); }
.tramite-btn-enviar {
  flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; border: none; background: var(--azul);
  color: white; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s;
}
.tramite-btn-enviar svg { width: 16px; height: 16px; }
.tramite-btn-enviar:hover { background: var(--azul-escuro); }
.tramite-btn-enviar:disabled { opacity: .6; cursor: not-allowed; }

.tramite-encerrado {
  display: flex; align-items: center; gap: 6px; margin-top: 8px; padding: 8px 10px;
  background: var(--cinza-50); border-radius: 8px; color: var(--cinza-500); font-size: 11.5px;
}
.tramite-encerrado svg { width: 14px; height: 14px; flex-shrink: 0; }

/* ---------- Botão "Salvar" ao lado de um select (ex.: responsável do acompanhamento) ---------- */
.campo-com-botao { display: flex; gap: 8px; align-items: center; }
.campo-com-botao select { flex: 1; width: auto; }
.campo-com-botao .btn-primario { flex-shrink: 0; padding: 9px 16px; white-space: nowrap; }

/* ---------- Licenças: filtro ---------- */
.filtro-licencas {
  display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end;
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 14px 16px; margin-bottom: 18px; box-shadow: var(--sombra-sm);
}
.campo-filtro-licencas { display: flex; flex-direction: column; gap: 5px; min-width: 160px; max-width: 220px; }
.campo-filtro-licencas label { font-size: 12px; color: var(--cinza-600); font-weight: 500; }
.campo-filtro-licencas select, .campo-filtro-licencas input {
  padding: 8px 10px; border: 1px solid var(--cinza-300); border-radius: var(--raio); font-size: 13.5px;
  width: 100%; box-sizing: border-box;
}
.campo-filtro-licencas select:focus, .campo-filtro-licencas input:focus { outline: none; border-color: var(--azul); }
/* Filtro de intervalo (ex.: faixa de vencimento) — dois campos lado a lado sob um único
   rótulo, em vez de dois chips separados que quebram linha de forma desalinhada. */
.campo-filtro-intervalo { display: flex; flex-direction: column; gap: 5px; min-width: 220px; }
.campo-filtro-intervalo label { font-size: 12px; color: var(--cinza-600); font-weight: 500; }
.campo-filtro-intervalo-campos { display: flex; align-items: center; gap: 6px; }
.campo-filtro-intervalo-campos input {
  flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid var(--cinza-300);
  border-radius: var(--raio); font-size: 13.5px; box-sizing: border-box;
}
.campo-filtro-intervalo-campos input:focus { outline: none; border-color: var(--azul); }
.campo-filtro-intervalo-campos span { color: var(--cinza-400); font-size: 12px; flex-shrink: 0; }
.campo-filtro-busca { flex: 1; min-width: 220px; max-width: none; }

/* ---------- Licenças: indicadores por cidade (tabela 6 colunas) ---------- */
.tabela-linha-licencas { grid-template-columns: 1.8fr .9fr .9fr .9fr 1.1fr 1fr; }

/* ---------- Licenças + Certificados: grade 2 colunas ---------- */
.grade-licencas-clientes,
#lista-certs-clientes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

/* ---------- Card de módulo (Licenças + Certificados) ---------- */
.card-mod {
  position: relative;
  padding: 11px 13px 11px 15px;
  border-radius: 8px;
  border: 1px solid var(--cinza-200);
  background: var(--branco);
  cursor: pointer;
  overflow: hidden;
  transition: box-shadow .12s, border-color .12s;
}
.card-mod:hover { box-shadow: var(--sombra-md); border-color: var(--azul); }
.card-mod::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  border-radius: 8px 0 0 8px;
  background: var(--cinza-300);
}
/* Cores da borda esquerda por status — Licenças */
.card-mod.status-lic-vencida::before  { background: var(--vermelho); }
.card-mod.status-lic-vencendo_30::before { background: var(--laranja); }
.card-mod.status-lic-em_andamento::before { background: var(--azul); }
.card-mod.status-lic-ativa::before   { background: var(--verde); }
.card-mod.status-lic-dispensada::before  { background: var(--cinza-400); }
.card-mod.status-lic-sem_licenca::before { background: var(--cinza-300); }
/* Cores da borda esquerda por status — Certificados */
.card-mod.status-cert-vencido::before    { background: var(--vermelho); }
.card-mod.status-cert-vencendo_7::before { background: var(--laranja); }
.card-mod.status-cert-vencendo_15::before { background: #f59e0b; }
.card-mod.status-cert-ativo::before      { background: var(--verde); }
.card-mod.status-cert-sem_data::before   { background: var(--azul); }
.card-mod.status-cert-sem_certificado::before { background: var(--cinza-300); }
.card-mod.status-cert-dispensado::before { background: var(--laranja); }

.card-mod-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.card-mod-nome { font-size: 13px; font-weight: 600; color: var(--cinza-800); line-height: 1.3; }
.card-mod-fantasia { font-size: 11px; font-weight: 400; color: var(--cinza-500); }
.card-mod-meta { font-size: 11px; color: var(--cinza-500); margin-top: 3px; }
.card-mod-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }

/* Info de data/etapa no rodapé do card */
.card-mod-data { font-size: 11px; margin-top: 7px; font-weight: 500; }
.card-mod-data.urgente  { color: var(--vermelho); }
.card-mod-data.atencao  { color: var(--laranja); }
.card-mod-data.aviso    { color: #b45309; }
.card-mod-data.ok       { color: var(--cinza-500); }
.card-mod-data.pipeline { color: var(--azul); }
.card-mod-data.recusado { color: var(--laranja); font-weight: 600; }
/* Quadro de destaque do certificado recusado pelo cliente (07/10) */
.cert-recusa-box { margin-top: 10px; padding: 12px 14px; background: var(--laranja-claro); border: 1px solid var(--laranja); border-left-width: 4px; border-radius: 8px; }
.cert-recusa-titulo { font-size: 13px; font-weight: 700; color: var(--laranja); }
.cert-recusa-secao { margin-top: 10px; font-size: 12px; color: #374151; display: flex; flex-direction: column; gap: 3px; }
.card-mod-data.dispensado { color: var(--cinza-500); font-style: italic; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Compat: remover estilo do card antigo de licença */
.card-licenca-cliente .info { display: flex; flex-direction: column; gap: 6px; }
.badges-licencas-cliente { display: flex; gap: 6px; flex-wrap: wrap; }
.chip-tipo-licenca {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 600; color: var(--cinza-600);
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 20px; padding: 3px 5px 3px 10px;
}
.chip-tipo-licenca .selo { padding: 2px 8px; }

/* ---------- Cliente: tags de grupo empresarial ---------- */
.tags-input-container {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: 6px; min-height: 26px;
}
.chip-tag {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 600; color: var(--azul);
  background: var(--azul-claro); border: 1px solid var(--azul);
  border-radius: 20px; padding: 3px 6px 3px 10px;
}
.chip-tag-remover {
  border: none; background: none; cursor: pointer; color: inherit;
  font-size: 14px; line-height: 1; padding: 0 2px; opacity: .7;
}
.chip-tag-remover:hover { opacity: 1; }
.chip-tag-vazio { font-size: 12px; color: var(--cinza-500); }
.chips-lista-cliente { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.chip-tag-mini { font-size: 11px; padding: 2px 8px; }

/* ---------- Cliente: visualização (somente leitura) do cadastro mestre ---------- */
.vcc-bloco {
  margin-bottom: 16px; padding: 12px 14px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px;
}
.vcc-linha { display: flex; gap: 10px; padding: 4px 0; font-size: 13px; }
.vcc-linha .vcc-rotulo { min-width: 150px; color: var(--cinza-500); flex-shrink: 0; }
.vcc-linha .vcc-valor { color: var(--cinza-800); font-weight: 500; }
.vcc-vazio { color: var(--cinza-500); font-weight: 400; font-style: italic; }
.vcc-responsavel { display: flex; gap: 10px; flex-wrap: wrap; font-size: 13px; padding: 4px 0; }
.vcc-responsavel + .vcc-responsavel { border-top: 1px solid var(--cinza-200); }

/* ---------- Senhas e Acessos: bloco de procuração na ficha do cliente ---------- */
.bloco-procuracao {
  margin-bottom: 20px; padding: 14px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px;
}
.bloco-procuracao h3 { margin-top: 0; }
.bloco-procuracao .campo:last-of-type { margin-bottom: 10px; }

/* ---------- Conexa: badges e barra de progresso (reusáveis) ---------- */
.conexa-badge-status {
  font-size: 11px; font-weight: 600; padding: 2px 10px;
  border-radius: 20px; background: var(--cinza-100); color: var(--cinza-600);
}
.conexa-badge-status.conexa-ok { background: #dcfce7; color: #15803d; }
.conexa-ultima-sync { font-size: 11px; color: var(--cinza-500); margin: 4px 0 10px 0; }
.conexa-mes-fechado { font-size: 10px; background: #dcfce7; color: #15803d; padding: 1px 6px; border-radius: 10px; }
.conexa-mes-parcial { font-size: 10px; background: #fef9c3; color: #854d0e; padding: 1px 6px; border-radius: 10px; }
.conexa-pct-bar { height: 5px; background: var(--cinza-100); border-radius: 4px; overflow: hidden; }
.conexa-pct-fill { height: 100%; background: var(--verde); border-radius: 4px; transition: width .3s; }

/* ---------- Visão Geral: painel Conexa compacto (4 cards macro) ---------- */
.conexa-painel .painel-cabecalho { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.conexa-painel .painel-cabecalho h3 { margin: 0; display: flex; align-items: center; gap: 8px; }
.conexa-macro-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
}
@media (max-width: 1100px) { .conexa-macro-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px)  { .conexa-macro-grid { grid-template-columns: repeat(2, 1fr); } }
.conexa-macro-card {
  background: var(--cinza-50); border: 1px solid var(--cinza-100);
  border-radius: 10px; padding: 12px 14px;
}
.conexa-macro-alerta { border-color: #fca5a5; background: #fff5f5; }
.conexa-macro-label { font-size: 11px; color: var(--cinza-500); margin-bottom: 4px; }
.conexa-macro-valor { font-size: 20px; font-weight: 700; color: var(--cinza-800); }
.conexa-macro-valor.verde { color: var(--verde); }
.conexa-macro-valor.vermelho { color: #b91c1c; }
.conexa-macro-sub { font-size: 11px; color: var(--cinza-400); margin-top: 3px; }

/* ---------- Módulo Financeiro ---------- */

/* Título e ações de modal — genéricos, usados por vários módulos (Financeiro,
   Gestão Interna/Patrimônio...) mas nunca tinham CSS próprio, só herdavam o `.modal h2`
   básico; o resto (peso, espaçamento) vinha do navegador sem estilo nenhum. */
.modal-titulo { font-size: 19px; font-weight: 700; color: var(--cinza-800); margin: 0 0 22px; }
.modal-acoes {
  display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px;
  margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--cinza-100);
}
/* Grid de 2 colunas para pares de campo (ex.: Tipo + Subcategoria) — também sem CSS
   próprio antes; os dois <label> ficavam lado a lado por fluxo inline "cru" do navegador. */
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* Campos de formulário do módulo Financeiro (.form-fin) — rótulo em bloco acima do
   campo, com respiro e foco visível. Escopado a .form-fin de propósito: outros módulos
   (toggles de Obrigações, formulários da Agenda/CRM) têm estilo de <label> próprio que
   um seletor genérico ".modal label" quebraria (ex.: os toggles viram switch, não
   podem virar bloco de largura total). */
.form-fin { display: flex; flex-direction: column; gap: 16px; }
.form-fin .form-grid-2 { gap: 16px; }
.form-fin label {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 13px; font-weight: 600; color: var(--cinza-700);
}
/* O `display:flex` acima vence o atributo `hidden` (que é só `display:none` da folha
   do navegador, menos específica): sem isto, um campo escondido por JS continua
   aparecendo — era o caso de "Número de parcelas", visível mesmo com o checkbox
   "Parcelado" desmarcado. */
.form-fin label[hidden], .form-fin [hidden] { display: none !important; }
/* Rótulo de caixa de seleção fica na MESMA linha da caixa — a coluna do padrão acima
   empilha o texto embaixo do quadradinho e parece campo quebrado. */
.form-fin label.form-fin-check {
  flex-direction: row; align-items: center; gap: 8px; font-weight: 500;
}
.form-fin label.form-fin-check input { width: auto; }
.form-fin input,
.form-fin select,
.form-fin textarea {
  font-family: inherit; font-size: 14px; font-weight: 400; color: var(--cinza-800);
  padding: 10px 12px; border: 1px solid var(--cinza-300); border-radius: 8px;
  background: var(--branco); transition: border-color .12s, box-shadow .12s;
}
.form-fin input:focus,
.form-fin select:focus,
.form-fin textarea:focus {
  outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro);
}
.form-fin input::placeholder,
.form-fin textarea::placeholder { color: var(--cinza-400); }
.form-fin input:disabled,
.form-fin select:disabled { background: var(--cinza-50); color: var(--cinza-500); cursor: not-allowed; }
.form-fin textarea { resize: vertical; min-height: 64px; }
.form-fin p.fin-desp-nota { margin: -4px 0 0; }
/* Juros por atraso: percentual + unidade (% ao mês / % ao dia) lado a lado (22/09) */
.fin-juros-unidade-wrap { display: flex; gap: 6px; }
.fin-juros-unidade-wrap input { flex: 1; min-width: 0; }
.fin-juros-unidade-wrap select { flex: 0 0 108px; }

/* Prévia de geração de faturamento (.fin-preview-*) — lista de cards em vez de tabela,
   porque cada linha carrega campos editáveis demais (vencimento, valor base, desconto,
   meio) pra caber legível numa <table>. Escopado, não reaproveita .gestao-tabela. */
.fin-preview-lista { display: flex; flex-direction: column; gap: 12px; max-height: 52vh; overflow-y: auto; padding: 2px; }
.fin-preview-item {
  border: 1px solid var(--cinza-200); border-radius: var(--raio-lg); padding: 16px 18px;
  background: var(--branco); transition: opacity .12s;
}
.fin-preview-item.fin-preview-desabilitado { opacity: .55; background: var(--cinza-50); }
.fin-preview-cabecalho { display: flex; align-items: flex-start; gap: 12px; }
.fin-preview-cabecalho input[type="checkbox"] { width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; }
.fin-preview-cliente { font-size: 14.5px; font-weight: 700; color: var(--cinza-800); }
.fin-preview-sub { font-size: 12.5px; color: var(--cinza-500); margin-top: 2px; }
/* Composição da cobrança — quando um contrato e uma venda avulsa caem no mesmo
   vencimento do mesmo cliente, entram juntos numa cobrança só (pedido do usuário,
   15/09): esta lista mostra cada parte que compõe o valor total da linha. */
.fin-preview-partes { margin-top: 6px; display: flex; flex-direction: column; gap: 2px; }
.fin-preview-parte { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--cinza-600); }
.fin-preview-parte-feita { color: var(--cinza-400); text-decoration: line-through; }
.fin-preview-parte-feita small { text-decoration: none; }
.fin-preview-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; flex-shrink: 0; }
.fin-preview-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px 14px;
  margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--cinza-200);
}
.fin-preview-grid label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; font-weight: 600; color: var(--cinza-600); }
.fin-preview-grid input,
.fin-preview-grid select {
  font-family: inherit; font-size: 13.5px; color: var(--cinza-800);
  padding: 8px 10px; border: 1px solid var(--cinza-300); border-radius: 8px; background: var(--branco);
}
.fin-preview-grid input:focus,
.fin-preview-grid select:focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro); }
.fin-preview-grid input:disabled,
.fin-preview-grid select:disabled { background: var(--cinza-50); color: var(--cinza-500); cursor: not-allowed; }
.fin-preview-valor-final { display: flex; flex-direction: column; gap: 5px; }
.fin-preview-valor-final span:first-child { font-size: 12px; font-weight: 600; color: var(--cinza-600); }
.fin-preview-valor-final strong { font-size: 16px; color: var(--verde); }
.fin-preview-motivo { grid-column: 1 / -1; }
.fin-preview-rodape {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--cinza-100);
}
.fin-preview-total { font-size: 14px; color: var(--cinza-700); }
.fin-preview-total strong { color: var(--cinza-800); font-size: 17px; }

/* Tabela de Faturamento — a cor entrega a situação sem precisar ler a coluna linha a
   linha. Redesenhada em 23/09 (feedback do usuário: a borda verde do Pago "ficava
   solta" sem fundo nenhum atrás — Vencido já tinha o tratamento completo, fundo +
   borda, e Pago só tinha a borda). Agora os 3 estados usam a MESMA lógica de bloco de
   cor, só o peso visual muda com o que cada um pede: Vencido é o mais forte (precisa
   de ação AGORA — fundo + borda grossa); Pago é mais suave (resolvido, confirma sem
   alarmar — fundo + borda fina); A vencer fica neutro, sem nenhum destaque (é a
   rotina, não compete visualmente com quem precisa de atenção). */
/* (Receber usa cards por cobrança desde 24/09 — ver .fin-cob-card) */

/* ── Recebimentos: layout redesenhado (23/09) ──────────────────────────────────
   O topo da tela consumia ~850px antes da primeira linha da tabela (tarja do Inter
   com a URL inteira + botão numa linha só dele + 3 stat-cards grandes + 2 linhas de
   filtro). Aqui o mesmo conteúdo cabe em ~200px: ações no cabeçalho da página,
   números viraram chips que TAMBÉM filtram, e o filtro pouco usado foi pra um
   recolhível. */

/* Ações no cabeçalho da página, ao lado do título */
.fin-rec-acoes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* Selo de status do Inter — substitui a tarja amarela de 5 linhas. Clicável: o
   detalhe (URL cadastrada, o que muda na prática, botão de cadastrar) abre num modal,
   porque é informação de configuração, não de operação do dia. */
.fin-chip-status {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 11px; border-radius: 999px; border: 1px solid transparent;
  font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit;
  transition: filter .12s;
}
.fin-chip-status:hover { filter: brightness(.97); }
.fin-chip-ok     { background: var(--verde-claro);   color: var(--verde);   border-color: #BFE3CC; }
.fin-chip-alerta { background: var(--amarelo-claro); color: #7A4A08;        border-color: #F0CE7A; }
.fin-chip-off    { background: var(--cinza-100);     color: var(--cinza-600); border-color: var(--cinza-200); }

/* Chips de situação — o número E o filtro na mesma peça (clicar filtra a lista). */
.fin-filtro-chips { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.fin-fchip {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
  min-width: 132px; padding: 10px 14px; border-radius: var(--raio);
  border: 1px solid var(--cinza-200); background: var(--branco);
  font-family: inherit; text-align: left; cursor: pointer;
  transition: border-color .12s, box-shadow .12s, background .12s;
}
.fin-fchip:hover:not(:disabled) { border-color: var(--cinza-400); box-shadow: 0 2px 8px rgba(20,20,40,.06); }
.fin-fchip-num { font-size: 19px; font-weight: 700; color: var(--cinza-800); line-height: 1.1; }
.fin-fchip-rot { font-size: 12px; font-weight: 600; color: var(--cinza-600); }
.fin-fchip-val { font-size: 11.5px; color: var(--cinza-500); }
.fin-fchip.vazio { opacity: .5; cursor: default; }
/* Cor só na borda lateral: identifica a situação sem transformar a barra num arco-íris. */
.fchip-aberto    { border-left: 3px solid var(--azul); }
.fchip-vencido   { border-left: 3px solid var(--vermelho); }
.fchip-pago      { border-left: 3px solid var(--verde); }
.fchip-cancelado { border-left: 3px solid var(--cinza-300); }
.fin-fchip.ativo { border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro); background: var(--azul-claro); }
.fin-fchip.ativo .fin-fchip-rot { color: var(--azul); }

/* Aviso de vencido escondido pelo filtro de competência (ver resumoReceber) */
.fin-aviso-fora {
  display: inline-flex; align-items: center; gap: 6px; margin-bottom: 12px;
  padding: 7px 12px; border-radius: 8px; cursor: pointer; font-family: inherit;
  background: var(--vermelho-claro); border: 1px solid #F0A3A3; color: var(--vermelho); font-size: 12.5px;
}
.fin-aviso-fora:hover { filter: brightness(.97); }

/* Barra de filtros — uma linha só */
.fin-toolbar {
  display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; margin-bottom: 12px;
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
}
.fin-toolbar-campo { display: flex; flex-direction: column; gap: 4px; }
.fin-toolbar-campo > span { font-size: 11.5px; font-weight: 600; color: var(--cinza-500); }
.fin-toolbar-campo input, .fin-toolbar-campo select {
  font-family: inherit; font-size: 13.5px; color: var(--cinza-800);
  padding: 7px 10px; border: 1px solid var(--cinza-300); border-radius: 8px; background: var(--branco);
}
.fin-toolbar-campo input:focus, .fin-toolbar-campo select:focus {
  outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro);
}
.fin-toolbar-busca { flex: 1; min-width: 200px; max-width: 340px; }
.fin-toolbar-busca input { width: 100%; }
.fin-toolbar-btn { padding: 7px 12px; font-size: 13px; }
.fin-toolbar-btn.tem-filtro { border-color: var(--azul); color: var(--azul); }
.fin-badge-contador {
  display: inline-block; min-width: 17px; padding: 0 5px; margin-left: 2px;
  background: var(--azul); color: var(--branco); border-radius: 999px;
  font-size: 11px; font-weight: 700; text-align: center;
}
.fin-rec-contador { margin-left: auto; font-size: 13px; color: var(--cinza-600); padding-bottom: 7px; }

.fin-mais-filtros {
  display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; margin: -4px 0 12px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
}
.fin-mais-filtros.oculto { display: none; }

/* Competência como intervalo (24/09) — dois meses lado a lado com "até" no meio, sem
   ocupar mais que um campo. O reset de `> span` é necessário: a regra genérica do
   rótulo acima (cinza, 11.5px) também pegaria este <span> filho direto. */
.fin-toolbar-campo > span.fin-comp-par {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 400; color: var(--cinza-500);
}
.fin-comp-par em { font-style: normal; font-size: 12px; }
.fin-comp-par input { width: 172px; }

/* Seletor compacto de vários clientes (24/09) — botão discreto + popover. */
.fin-selcli { position: relative; }
.fin-selcli-btn {
  font-family: inherit; font-size: 13.5px; color: var(--cinza-800); text-align: left;
  min-width: 150px; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 7px 10px; border: 1px solid var(--cinza-300); border-radius: 8px; background: var(--branco); cursor: pointer;
}
.fin-selcli-btn.tem-filtro { border-color: var(--azul); color: var(--azul); }
.fin-selcli-pop {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 30; width: 300px;
  padding: 8px; display: flex; flex-direction: column; gap: 6px;
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
}
.fin-selcli-pop.oculto { display: none; }
.fin-toolbar-campo .fin-selcli-pop input[type="search"] { width: 100%; box-sizing: border-box; }
.fin-selcli-lista { max-height: 210px; overflow-y: auto; }
.fin-selcli-item {
  display: flex; align-items: center; gap: 8px; padding: 6px 6px; border-radius: 6px;
  font-size: 13px; color: var(--cinza-800); cursor: pointer;
}
.fin-selcli-item:hover { background: var(--azul-claro); }
.fin-toolbar-campo .fin-selcli-item input { width: auto; padding: 0; border: none; box-shadow: none; }
.fin-selcli-vazio { margin: 0; padding: 10px; text-align: center; font-size: 12.5px; color: var(--cinza-500); }
.fin-selcli-limpar { align-self: flex-end; font-size: 12px; }

/* Tabela mais densa — cabem mais linhas na mesma altura sem apertar a leitura */

.fin-prazo-atraso { color: var(--vermelho); font-weight: 600; }
.fin-prazo-hoje   { color: #C2540A; font-weight: 600; }
.fin-prazo-perto  { color: var(--cinza-700, var(--cinza-600)); font-weight: 600; }
.fin-pago-info { display: block; font-size: 11.5px; color: var(--verde); margin-top: 3px; }

/* Contas a Pagar (23/09, pedido do usuário: "padronizar o sistema") — MESMA lógica de
   cor de Contas a Receber. Aqui a primeira coluna é "Fornecedor" (não tem checkbox de
   lote), então a borda esquerda vai direto no `td:first-child` da linha, sem o ajuste
   de padding que Receber precisa pra abrir espaço pro checkbox. */
/* (Pagar usa cards por conta desde 24/09 — ver .fin-cob-card) */

/* Situação (Faturamento) redesenhada em 22/09: célula compacta, o resto (Inter, linha
   digitável, PIX, PDF, notificar) mora no modal "🧾 Cobrança". */
.fin-situacao-cel { min-width: 120px; }
.fin-situacao-cel .btn-link-inline { display: block; margin-top: 4px; font-size: 12px; }
.fin-cobranca-detalhe { display: flex; flex-direction: column; gap: 10px; margin: 10px 0; }
.fin-cobranca-detalhe label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--cinza-700); }
.fin-campo-copiavel { display: flex; gap: 6px; }
.fin-campo-copiavel input { flex: 1; min-width: 0; font-size: 12px; padding: 8px 10px; border: 1px solid var(--cinza-300); border-radius: 8px; background: var(--cinza-50); color: var(--cinza-600); }

.fin-ultima-sync { font-size: 11px; color: var(--cinza-400); }

/* Baixa em lote (22/09) — barra fixa acima da tabela, só quando há seleção; lista de
   conferência dentro do modal de confirmação. */
.fin-lote-barra {
  display: flex; align-items: center; gap: 14px; padding: 10px 14px; margin-bottom: 10px;
  background: var(--azul-claro); border: 1px solid var(--azul); border-radius: 10px;
  font-size: 13.5px;
}
/* Modal de baixa em lote redesenhado (23/09) — cada título vira um card no mesmo
   padrão visual de `.fin-preview-item` (prévia de geração de faturamento), com um
   aviso compacto quando há cobrança Inter ativa que será cancelada na quitação. */
.fin-lote-aviso-inter {
  display: flex; align-items: flex-start; gap: 8px; margin-top: 10px;
  padding: 9px 12px; background: var(--amarelo-claro); border: 1px solid #F0CE7A;
  border-radius: 8px; font-size: 12.5px; color: #7A4A08;
}

/* Menu de ações em popover (23/09) — ícone único por linha de tabela, abrindo a lista
   de ações certa pra situação daquele registro. Nasceu em Contas a Receber, genérico
   pro resto do Financeiro. `.fin-btn-acoes` é o gatilho (ícone ✏️); `.fin-menu-acoes` é
   o popover em si, `position: fixed` porque é posicionado por JS pela borda do botão
   (não fica preso ao `overflow` da célula da tabela, que cortaria o menu). */
.fin-btn-acoes {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border: 1px solid var(--cinza-300); border-radius: 8px;
  background: var(--branco); font-size: 14px; cursor: pointer; transition: background .12s, border-color .12s;
}
.fin-btn-acoes:hover { background: var(--cinza-50); border-color: var(--cinza-400); }
.fin-menu-acoes {
  position: fixed; z-index: 1000; min-width: 230px;
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px;
  box-shadow: 0 10px 28px rgba(20, 20, 40, .16); padding: 6px; display: flex; flex-direction: column;
}
.fin-menu-acoes-item {
  display: flex; align-items: center; gap: 9px; width: 100%;
  padding: 8px 10px; border: none; background: none; border-radius: 6px;
  font-family: inherit; font-size: 13.5px; color: var(--cinza-800); text-align: left; cursor: pointer;
}
.fin-menu-acoes-item span { font-size: 14px; width: 18px; text-align: center; flex-shrink: 0; }
.fin-menu-acoes-item:hover { background: var(--cinza-50); }
.fin-menu-acoes-perigo { color: var(--vermelho); }
.fin-menu-acoes-perigo:hover { background: var(--vermelho-claro); }
.fin-menu-acoes-divisor { height: 1px; background: var(--cinza-100); margin: 5px 6px; }

/* Tabs */
.fin-tabs {
  display: flex; gap: 4px; margin: 16px 0 0 0;
  border-bottom: 2px solid var(--cinza-100); padding-bottom: 0;
}
.fin-tab {
  background: none; border: none; border-bottom: 2px solid transparent;
  margin-bottom: -2px; padding: 8px 18px; font-size: 13px; font-weight: 500;
  color: var(--cinza-500); cursor: pointer; border-radius: 6px 6px 0 0; transition: all .15s;
}
.fin-tab:hover { color: var(--cinza-800); background: var(--cinza-50); }
.fin-tab.ativa { color: var(--azul); border-bottom-color: var(--azul); font-weight: 600; }

/* Seções */
.fin-secao { margin: 20px 0; }
.fin-secao-titulo {
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--cinza-500); margin: 0 0 10px 0;
}

/* DRE simplificado */
.fin-dre-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0;
  border: 1px solid var(--cinza-100); border-radius: 10px; overflow: hidden;
  max-width: 560px;
}
.fin-dre-col-header {
  background: var(--cinza-50); padding: 8px 14px; font-size: 11px; font-weight: 700;
  color: var(--cinza-500); text-transform: uppercase; border-bottom: 1px solid var(--cinza-100);
  display: flex; align-items: center; gap: 6px;
}
.fin-dre-label, .fin-dre-val {
  padding: 10px 14px; font-size: 13px; border-bottom: 1px solid var(--cinza-100);
}
.fin-dre-grid > :nth-last-child(-n+3) { border-bottom: none; }
.fin-dre-label { font-weight: 600; color: var(--cinza-600); background: var(--cinza-50); }
.fin-dre-val { color: var(--cinza-800); text-align: right; }
.fin-dre-label.receita, .fin-dre-val.receita { color: var(--cinza-800); }
.fin-dre-label.despesa, .fin-dre-val.despesa { color: var(--cinza-600); font-size: 12px; }
.fin-dre-label.resultado { font-weight: 700; border-top: 2px solid var(--cinza-200); padding-top: 10px; }
.fin-dre-val.resultado { font-weight: 700; font-size: 15px; border-top: 2px solid var(--cinza-200); }
.fin-dre-val.positivo { color: #15803d; }
.fin-dre-val.negativo { color: #b91c1c; }

/* Cards de receita */
.fin-cards-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
}
@media (max-width: 900px) { .fin-cards-grid { grid-template-columns: repeat(2, 1fr); } }
.fin-card {
  background: var(--cinza-50); border: 1px solid var(--cinza-100);
  border-radius: 10px; padding: 14px 16px;
}
.fin-card-destaque { border-left: 3px solid var(--verde); }
.fin-card-label { font-size: 11px; color: var(--cinza-500); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fin-card-valor { font-size: 22px; font-weight: 700; color: var(--cinza-800); }
.fin-card-valor.verde { color: var(--verde); }
.fin-card-sub { font-size: 11px; color: var(--cinza-400); margin-top: 4px; }

/* Inadimplência */
.fin-inad-resumo-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 10px;
}
@media (max-width: 900px) { .fin-inad-resumo-grid { grid-template-columns: repeat(2, 1fr); } }
.fin-inad-bucket {
  background: var(--cinza-50); border: 1px solid var(--cinza-100);
  border-radius: 10px; padding: 12px 14px; text-align: center;
}
.fin-inad-bucket.tem-inad { border-color: #fca5a5; background: #fff5f5; }
.fin-inad-rotulo { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--cinza-500); margin-bottom: 4px; }
.fin-inad-total { font-size: 18px; font-weight: 700; color: var(--cinza-300); }
.fin-inad-total.vermelho { color: #b91c1c; }
.fin-inad-count { font-size: 11px; color: var(--cinza-400); margin-top: 2px; }
.fin-inad-total-row {
  display: flex; align-items: center; justify-content: space-between;
  background: #fff5f5; border: 1px solid #fca5a5; border-radius: 8px;
  padding: 8px 14px; font-size: 13px;
}
.fin-inad-total-count { font-size: 11px; color: var(--cinza-500); }

/* Tabela de inadimplentes */
.fin-tabela { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 10px; }
.fin-tabela thead th {
  text-align: left; font-size: 11px; font-weight: 700; text-transform: uppercase;
  color: var(--cinza-500); padding: 6px 10px; border-bottom: 2px solid var(--cinza-100);
}
.fin-tabela th.num, .fin-tabela td.num { text-align: right; }
.fin-tabela tbody tr:hover { background: var(--cinza-50); }
.fin-tabela tbody td { padding: 8px 10px; border-bottom: 1px solid var(--cinza-100); color: var(--cinza-700); }
.fin-tabela tfoot td { padding: 8px 10px; border-top: 2px solid var(--cinza-200); }
.fin-inad-dias { font-size: 10px; background: var(--cinza-100); color: var(--cinza-600); padding: 1px 5px; border-radius: 8px; margin-left: 4px; }
.fin-periodo-chip { font-size: 11px; background: var(--cinza-100); color: var(--cinza-600); padding: 2px 8px; border-radius: 10px; }
.vermelho { color: #b91c1c; }
.verde { color: var(--verde); }

/* Despesas */
.fin-desp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 700px) { .fin-desp-grid { grid-template-columns: 1fr; } }
.fin-desp-card {
  background: var(--cinza-50); border: 1px solid var(--cinza-100);
  border-radius: 12px; padding: 18px 20px;
}
.fin-desp-cabecalho { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.fin-desp-rotulo { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--cinza-500); }
.fin-desp-total { font-size: 28px; font-weight: 700; color: var(--cinza-800); margin: 4px 0 10px 0; }
.fin-desp-barra-wrap { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: 11px; color: var(--cinza-500); }
.fin-desp-linhas { display: flex; flex-direction: column; gap: 4px; }
.fin-desp-linha { display: flex; justify-content: space-between; font-size: 13px; padding: 4px 0; border-bottom: 1px solid var(--cinza-100); }
.fin-desp-linha:last-child { border-bottom: none; }
.fin-desp-linha.pago span:last-child { color: #15803d; font-weight: 600; }
.fin-desp-linha.pendente span:last-child { color: #b45309; font-weight: 600; }
.fin-desp-linha.neutro { color: var(--cinza-500); font-size: 12px; }
.fin-desp-nota { font-size: 11px; color: var(--cinza-400); margin-top: 12px; }

/* ---------- Licenças: formulário de cadastro (2 colunas) ---------- */
.campo-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.campo-grid-2 .campo { margin-bottom: 14px; }

/* ---------- Licenças: responsáveis dinâmicos ---------- */
#lista-responsaveis-licencas { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.responsavel-row { display: grid; grid-template-columns: 1fr 1fr 1.3fr auto; gap: 8px; align-items: center; }
.responsavel-row input {
  padding: 8px 10px; border: 1px solid var(--cinza-300); border-radius: var(--raio); font-size: 13px; width: 100%;
}
.responsavel-row input:focus { outline: none; border-color: var(--azul); }
.btn-remover-responsavel {
  background: var(--cinza-100); border: none; border-radius: 6px; color: var(--cinza-600);
  width: 28px; height: 28px; flex-shrink: 0; cursor: pointer; font-size: 16px; line-height: 1;
}
.btn-remover-responsavel:hover { background: var(--vermelho); color: white; }

/* ---------- Licenças: form de licença (criar/editar) ---------- */
.form-licenca-painel { padding: 16px 18px; margin: 10px 0 16px; background: var(--cinza-50); border: 1px solid var(--cinza-200); }
.form-licenca-painel .btn-primario, .form-licenca-painel .btn-secundario { margin-top: 4px; margin-right: 8px; }

/* ---------- Licenças: item de licença na lista do cliente ---------- */
.item-licenca { align-items: flex-start; }

/* ---------- Licenças: chips de anexos ---------- */
.lista-anexos-licenca { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.anexo-chip {
  display: inline-flex; align-items: center; gap: 6px; background: var(--azul-claro); color: var(--azul);
  border-radius: 20px; padding: 4px 6px 4px 11px; font-size: 12px; font-weight: 500;
}
.anexo-chip a { color: var(--azul); text-decoration: underline; }
.btn-remover-anexo {
  background: none; border: none; color: var(--azul); cursor: pointer; font-size: 14px; line-height: 1; padding: 0 4px;
}
.btn-remover-anexo:hover { color: var(--vermelho); }

/* ---------- Licenças: upload inline de anexo ---------- */
.form-upload-anexo { display: flex; gap: 8px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
.form-upload-anexo input[type="text"] {
  padding: 7px 10px; border: 1px solid var(--cinza-300); border-radius: var(--raio); font-size: 12.5px; flex: 1; min-width: 140px;
}
.form-upload-anexo input[type="file"] { font-size: 12.5px; max-width: 200px; }

/* ---------- Licenças: toggles de notificação ao cliente ---------- */
.campo-toggle { margin-bottom: 10px; }
.toggle-checkbox { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--cinza-800); cursor: pointer; font-weight: 500; margin: 0; }
.toggle-checkbox input { width: auto; padding: 0; accent-color: var(--azul); cursor: pointer; }

/* ---------- Licenças: stepper de marcos (visão do cliente) ---------- */
.stepper-marcos-cliente { display: flex; align-items: flex-start; gap: 2px; margin: 10px 0 4px; max-width: 380px; }
.stepper-marco { display: flex; flex-direction: column; align-items: center; flex: 1; text-align: center; position: relative; }
.stepper-marco:not(:last-child)::after {
  content: ''; position: absolute; top: 10px; left: calc(50% + 13px); right: calc(-50% + 13px);
  height: 2px; background: var(--cinza-200);
}
.stepper-marco.completo:not(:last-child)::after { background: var(--verde); }
.stepper-bolha {
  width: 21px; height: 21px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; background: var(--cinza-100); color: var(--cinza-500);
  border: 2px solid var(--cinza-200); position: relative; z-index: 1;
}
.stepper-marco.completo .stepper-bolha { background: var(--verde); color: white; border-color: var(--verde); }
.stepper-marco.atual .stepper-bolha { background: var(--azul); color: white; border-color: var(--azul); }
.stepper-nome { font-size: 10.5px; color: var(--cinza-500); margin-top: 4px; line-height: 1.2; }
.stepper-marco.atual .stepper-nome { color: var(--azul); font-weight: 700; }
.stepper-marco.completo .stepper-nome { color: var(--verde); }

/* ---------- Licenças: aviso de exigência do órgão pendente ---------- */
.aviso-exigencia {
  margin-top: 7px; padding: 7px 10px; background: var(--amarelo-claro); color: var(--amarelo);
  border-radius: var(--raio); font-size: 12px; font-weight: 600;
}

/* ---------- Senhas e Acessos: grade de clientes (reaproveita o cartão de Licenças) ---------- */
.card-senha-cliente { align-items: flex-start; }
.card-senha-cliente .info { display: flex; flex-direction: column; gap: 6px; }

/* ---------- Senhas e Acessos: linha de senha mascarada (mostrar/copiar) ---------- */
.item-senha-acesso { align-items: flex-start; }
.linha-valor-senha { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.valor-senha {
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  letter-spacing: 1px; color: var(--cinza-700);
}
.btn-mini {
  background: var(--cinza-100); border: 1px solid var(--cinza-200); color: var(--cinza-600);
  border-radius: var(--raio); font-size: 11px; font-weight: 600; padding: 3px 9px; cursor: pointer;
  line-height: 1.4;
}
.btn-mini:hover { border-color: var(--azul); color: var(--azul); }
.btn-primario-mini { background: var(--azul); border-color: var(--azul); color: white; }
.btn-primario-mini:hover { background: var(--azul-escuro); border-color: var(--azul-escuro); color: white; }
.btn-mostrar-senha.ativo, .btn-copiar-senha:active { border-color: var(--azul); color: var(--azul); }

/* ---------- Senhas e Acessos: cartão de sócio (reaproveita .painel) ---------- */
.card-socio-senhas { padding: 16px 18px; margin-bottom: 16px; }

/* ---------- Senhas e Acessos: formulários inline de senha/sócio (reaproveitam .painel) ---------- */
.form-senha-painel, .form-socio-painel {
  padding: 16px 18px; margin: 10px 0 16px; background: var(--cinza-50); border: 1px solid var(--cinza-200);
}
.form-senha-painel .btn-primario, .form-senha-painel .btn-secundario,
.form-socio-painel .btn-primario, .form-socio-painel .btn-secundario { margin-top: 4px; margin-right: 8px; }
.campo-feedback { display: block; margin-top: 5px; font-size: 12px; color: var(--verde); font-weight: 500; }

/* ---------- Visão Geral 2.0: filtro de período no cabeçalho da página ---------- */
.filtro-periodo { display: flex; align-items: center; gap: 8px; }
.filtro-periodo label { font-size: 12.5px; color: var(--cinza-600); font-weight: 500; }
.filtro-periodo select {
  padding: 8px 12px; border: 1px solid var(--cinza-300); border-radius: var(--raio);
  background: white; font-size: 13.5px; color: var(--cinza-800); cursor: pointer;
}
.filtro-periodo select:focus { outline: none; border-color: var(--azul); }

/* ---------- Visão Geral 2.0: cards/painéis clicáveis (navegam para outras abas) ---------- */
.clicavel { cursor: pointer; transition: box-shadow .12s, border-color .12s; }
.clicavel:hover { box-shadow: var(--sombra-md); border-color: var(--azul); }

/* ---------- Visão Geral 2.0: cobertura de Licenças/Senhas ---------- */
.grade-cobertura { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin-bottom: 18px; }
.painel-cobertura { margin-bottom: 0; }
.cobertura-corpo { padding: 4px 20px 18px; }
.cobertura-numero { font-size: 28px; font-weight: 700; color: var(--cinza-800); }
.cobertura-numero small { font-size: 12.5px; font-weight: 500; color: var(--cinza-500); }
.cobertura-corpo .barra-progresso { max-width: none; margin-top: 10px; }
.cobertura-legenda { display: flex; justify-content: space-between; margin-top: 8px; font-size: 12px; color: var(--cinza-500); }

/* ---------- Visão Geral 2.0: licenças vencendo (lista dentro de .painel) ---------- */
.painel > .lista-usuarios { padding: 14px 20px 18px; }
.item-vencendo { cursor: pointer; transition: border-color .12s; }
.item-vencendo:hover { border-color: var(--bordo); }

/* ---------- Visão Geral 2.0: desempenho da equipe (por setor / por usuário) ---------- */
.grade-desempenho { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; padding: 16px 20px 20px; }
.subtitulo-desempenho { margin: 0 0 10px; font-size: 12.5px; font-weight: 700; color: var(--cinza-600); text-transform: uppercase; letter-spacing: .04em; }
.linha-desempenho { margin-bottom: 12px; }
.linha-desempenho-rotulo { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; }
.linha-desempenho-rotulo span { color: var(--cinza-800); font-weight: 500; }
.linha-desempenho-rotulo strong { color: var(--cinza-600); font-weight: 700; }
.barra-desempenho { display: flex; height: 7px; border-radius: 4px; overflow: hidden; background: var(--cinza-100); }
.barra-desempenho .seg-prazo { height: 100%; background: var(--verde); }
.barra-desempenho .seg-atraso { height: 100%; background: var(--vermelho); }
.linha-desempenho-legenda { display: flex; justify-content: space-between; margin-top: 3px; font-size: 11px; color: var(--cinza-500); }

/* ---------- Certificados Digitais: cards de cliente (estilos específicos) ---------- */
/* .card-mod já cobre cursor, hover e borda. Classe .card-cert-cliente mantida para seletor JS. */

/* ---------- Certificados Digitais: pipeline stepper ---------- */
.cert-pipeline-stepper { display: flex; flex-direction: column; gap: 0; margin-top: 6px; }
.cert-step {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; border-left: 2px solid var(--cinza-200); margin-left: 12px; padding-left: 14px;
  position: relative;
}
.cert-step:last-child { border-left-color: transparent; }
.cert-step-check {
  width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--cinza-300);
  display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700;
  color: var(--cinza-400); background: white; flex-shrink: 0;
  margin-left: -23px; position: relative; z-index: 1;
}
.cert-step.concluido .cert-step-check { background: var(--verde); border-color: var(--verde); color: white; }
.cert-step.ativo .cert-step-check { border-color: var(--azul); color: var(--azul); }
.cert-step.concluido { border-left-color: var(--verde); }
.cert-step.ativo { border-left-color: var(--azul); }
.cert-step-rotulo { font-size: 13px; color: var(--cinza-800); font-weight: 500; line-height: 1.3; }
.cert-step.concluido .cert-step-rotulo { color: var(--cinza-500); }
.cert-step-data { font-size: 11.5px; color: var(--cinza-400); margin-top: 1px; }
.cert-step-extra { font-size: 11.5px; color: var(--cinza-600); margin-top: 2px; }
.cert-step-acoes { margin-left: auto; flex-shrink: 0; }

/* ---------- Certificados Digitais: card individual (dentro do modal) ---------- */
.cert-card-item {
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: var(--raio);
  padding: 14px 16px;
}
.cert-card-item + .cert-card-item { margin-top: 12px; }

/* ═══════════════════════════════════════════════════
   CRM / PROSPECÇÃO
   ═══════════════════════════════════════════════════ */

/* Header e tabs */
.crm-header { margin-bottom: 0; }
.crm-tabs { display: flex; gap: 4px; margin: 16px 0 4px; border-bottom: 2px solid var(--cinza-200); }
.crm-tab {
  padding: 8px 18px; font-size: 13px; font-weight: 600; background: none; border: none;
  border-bottom: 2px solid transparent; margin-bottom: -2px; cursor: pointer; color: var(--cinza-500);
  transition: color .15s, border-color .15s;
}
.crm-tab.ativa { color: var(--azul); border-bottom-color: var(--azul); }
.crm-tab:hover:not(.ativa) { color: var(--cinza-700); }

/* Período */
.crm-periodo-bar { margin-bottom: 16px; }
.crm-periodo-bar label { font-size: 13px; font-weight: 500; color: var(--cinza-600); }
.crm-periodo-bar input { margin-left: 8px; padding: 5px 8px; border-radius: 6px; border: 1px solid var(--cinza-300); font-size: 13px; }

/* KPI grid */
.crm-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 20px; }
.crm-kpi {
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px;
  padding: 14px 16px; text-align: center;
}
.crm-kpi-val { font-size: 22px; font-weight: 700; color: var(--cinza-800); line-height: 1.2; }
.crm-kpi-val small { font-size: 13px; font-weight: 400; color: var(--cinza-500); }
.crm-kpi-label { font-size: 11px; color: var(--cinza-500); margin-top: 4px; }
.crm-kpi.destaque-verde .crm-kpi-val { color: var(--verde); }
.crm-kpi.destaque-vermelho .crm-kpi-val { color: var(--vermelho); }
.crm-kpi.destaque-azul .crm-kpi-val { color: var(--azul); }

/* Funil barra */
.crm-funil-barra {
  display: flex; gap: 0; margin-bottom: 20px;
  border: 1px solid var(--cinza-200); border-radius: 10px; overflow: hidden;
}
.crm-funil-item {
  flex: 1; padding: 10px 8px; text-align: center; cursor: pointer;
  border-right: 1px solid var(--cinza-200); background: var(--branco);
  transition: background .12s;
}
.crm-funil-item:last-child { border-right: none; }
.crm-funil-item:hover { background: var(--cinza-50); }
.crm-funil-qtd { display: block; font-size: 20px; font-weight: 700; color: var(--azul); }
.crm-funil-label { display: block; font-size: 10px; color: var(--cinza-500); margin-top: 2px; line-height: 1.3; }
.crm-funil-mini-barra { height: 4px; background: var(--cinza-100); border-radius: 2px; margin-top: 8px; overflow: hidden; }
.crm-funil-mini-fill { height: 100%; background: var(--azul); border-radius: 2px; transition: width .4s; }

/* Metas */
.crm-metas-bloco { background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px; padding: 14px 16px; margin-bottom: 20px; }
.crm-meta-linha { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-size: 13px; color: var(--cinza-700); }
.crm-meta-linha:last-child { margin-bottom: 0; }
.barra-progresso-crm { flex: 1; height: 8px; background: var(--cinza-200); border-radius: 4px; overflow: hidden; }
.barra-progresso-crm-fill { height: 100%; background: var(--azul); border-radius: 4px; transition: width .4s; }
.barra-progresso-crm-fill.completo { background: var(--verde); }
.crm-meta-aviso { font-size: 13px; color: var(--cinza-500); margin-bottom: 16px; }
.btn-link { background: none; border: none; color: var(--azul); cursor: pointer; font-size: 13px; text-decoration: underline; padding: 0; }

/* Dashboard 2 colunas */
.crm-dash-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.crm-bloco { background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px; padding: 14px 16px; }
.crm-bloco-full { margin-top: 16px; }
.crm-bloco-titulo { font-size: 12px; font-weight: 700; color: var(--cinza-500); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 10px; }
.crm-orig-linha { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: var(--cinza-700); padding: 4px 0; border-bottom: 1px solid var(--cinza-100); }
.crm-orig-linha:last-child { border-bottom: none; }
.crm-orig-total { font-weight: 700; color: var(--cinza-900); background: var(--cinza-50); padding: 6px 8px; border-radius: 6px; margin-top: 4px; border: none !important; }
.crm-val-destaque { font-weight: 600; color: var(--azul); }
.crm-badge-indicador { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 6px; border-radius: 10px; background: #dbeafe; color: #2563eb; margin-left: 4px; vertical-align: middle; }
.crm-badge-indicador.crm-badge-externo { background: var(--cinza-100); color: var(--cinza-600); }
.crm-badge-indicador.crm-badge-parceiro { background: #f3e8ff; color: #7c3aed; }
.crm-esf-linha { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: var(--cinza-700); padding: 5px 0; border-bottom: 1px solid var(--cinza-100); }
.crm-esf-linha:last-child { border-bottom: none; }
.crm-esf-linha:hover { color: var(--azul); }
.crm-esf-dias { font-size: 11px; color: var(--vermelho); font-weight: 600; }
.crm-lemb-linha { padding: 6px 0; border-bottom: 1px solid var(--cinza-100); cursor: pointer; }
.crm-lemb-linha:last-child { border-bottom: none; }
.crm-lemb-linha:hover { color: var(--azul); }
.crm-lemb-hora { font-size: 11px; color: var(--cinza-500); margin-top: 2px; }

/* Cards de lead */
.crm-leads-controls { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.crm-filtros-status { display: flex; flex-wrap: wrap; gap: 6px; }
.input-busca-crm { padding: 7px 12px; border: 1px solid var(--cinza-300); border-radius: 8px; font-size: 13px; width: 240px; }
.grade-leads-crm { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }

.card-lead-crm {
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px;
  padding: 13px 15px; cursor: pointer; transition: box-shadow .12s, border-color .12s;
  display: flex; flex-direction: column; gap: 6px;
}
.card-lead-crm:hover { box-shadow: var(--sombra-md); border-color: var(--azul); }
.card-lead-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.card-lead-nome { font-size: 14px; font-weight: 600; color: var(--cinza-800); }
.card-lead-sub { font-size: 12px; font-weight: 400; color: var(--cinza-500); }
.card-lead-meta { font-size: 12px; color: var(--cinza-500); }
.card-lead-footer { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 2px; }
.card-lead-resp { font-size: 11px; color: var(--cinza-400); margin-left: auto; }
.card-lead-acao { font-size: 11px; color: var(--azul); }
.card-lead-valor { font-size: 12px; font-weight: 700; color: var(--verde); }
.card-lead-valor small { font-weight: 400; color: var(--cinza-500); }
.card-lead-wa { text-decoration: none; font-size: 14px; line-height: 1; padding: 2px; border-radius: 6px; }
.card-lead-wa:hover { background: var(--verde-claro); }

/* Toggle "Só meus leads" */
.crm-meus-toggle { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cinza-600); cursor: pointer; user-select: none; }
.crm-meus-toggle input { cursor: pointer; }
.crm-label-dica { font-weight: 400; color: var(--cinza-400); font-size: 11px; }

/* ---------- Quadro Kanban de Prospecção ---------- */
.kanban-board {
  display: grid; grid-template-columns: repeat(4, minmax(240px, 1fr)); gap: 12px;
  align-items: start; overflow-x: auto; padding-bottom: 4px;
}
.kanban-col {
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 10px; min-width: 240px; display: flex; flex-direction: column; gap: 8px;
}
.kanban-col-header { display: flex; justify-content: space-between; align-items: center; padding: 2px 4px; }
.kanban-col-titulo { font-size: 12.5px; font-weight: 700; color: var(--cinza-700); }
.kanban-col-contador {
  background: var(--branco); border: 1px solid var(--cinza-200); color: var(--cinza-600);
  font-size: 11px; font-weight: 700; border-radius: 20px; padding: 1px 8px;
}
.kanban-col-valor { font-size: 11.5px; color: var(--verde); font-weight: 600; padding: 0 4px 2px; }
.kanban-col-valor small { font-weight: 400; color: var(--cinza-500); }
.kanban-col-cards { display: flex; flex-direction: column; gap: 8px; min-height: 60px; border-radius: 8px; transition: background .12s; }
.kanban-col-cards.kanban-col-sobre { background: var(--azul-claro); outline: 2px dashed var(--azul); outline-offset: -2px; }
.kanban-col-vazio { font-size: 11.5px; color: var(--cinza-400); text-align: center; padding: 14px 6px; border: 1px dashed var(--cinza-300); border-radius: 8px; }

.kanban-card {
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px;
  padding: 10px 11px; cursor: grab; box-shadow: var(--sombra-sm);
  display: flex; flex-direction: column; gap: 6px; transition: box-shadow .12s, border-color .12s, opacity .12s;
}
.kanban-card:hover { box-shadow: var(--sombra-md); border-color: var(--azul); }
.kanban-card.arrastando { opacity: .4; }
.kanban-card-top { display: flex; align-items: center; gap: 6px; }
.kanban-temp-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.kanban-card-nome { font-size: 13.5px; font-weight: 600; color: var(--cinza-800); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kanban-card-sub { font-size: 11.5px; color: var(--cinza-500); margin-top: -4px; }
.kanban-card-alerta { font-size: 12px; flex-shrink: 0; }
.kanban-card-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.kanban-card-canal { font-size: 11px; color: var(--cinza-500); }
.kanban-card-dias { font-size: 10.5px; font-weight: 600; color: var(--cinza-400); background: var(--cinza-100); border-radius: 10px; padding: 1px 7px; }
.kanban-card-dias.parado { color: var(--vermelho); background: var(--vermelho-claro); }
.kanban-card-footer { display: flex; align-items: center; gap: 6px; margin-top: 2px; }
.kanban-card-valor { font-size: 11.5px; font-weight: 700; color: var(--verde); flex: 1; min-width: 0; }
.kanban-card-valor small { font-weight: 400; color: var(--cinza-500); }
.kanban-card-avatar { margin-left: auto; width: 24px; height: 24px; font-size: 10px; }
.kanban-card-wa { text-decoration: none; font-size: 14px; line-height: 1; }

@media (max-width: 1100px) {
  .kanban-board { grid-template-columns: repeat(4, 78vw); }
}

/* Badge de temperatura */
.crm-temp { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 12px; }
.crm-temp-quente { background: #fff1f0; color: #cf1322; }
.crm-temp-morno  { background: #fff7e6; color: #d46b08; }
.crm-temp-frio   { background: #e6f4ff; color: #1677ff; }

/* Modal ficha do lead */
.crm-modal-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.crm-modal-tabs { display: flex; gap: 4px; border-bottom: 2px solid var(--cinza-200); margin-bottom: 16px; }
.crm-modal-tab {
  padding: 7px 16px; font-size: 13px; font-weight: 600; background: none; border: none;
  border-bottom: 2px solid transparent; margin-bottom: -2px; cursor: pointer; color: var(--cinza-500);
}
.crm-modal-tab.ativa { color: var(--azul); border-bottom-color: var(--azul); }

/* Formulário de dados do lead */
.crm-form-dados { display: flex; flex-direction: column; gap: 0; }
.form-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* Seções do formulário */
.crm-form-secao { border-top: 1px solid var(--cinza-100); margin-top: 14px; padding-top: 12px; }
.crm-form-secao:first-child { border-top: none; margin-top: 0; padding-top: 0; }
.crm-form-secao-titulo { font-size: 10px; font-weight: 700; color: var(--cinza-400); text-transform: uppercase; letter-spacing: .6px; margin-bottom: 10px; }

/* Select com busca */
.crm-select-busca-wrap { position: relative; }
.crm-select-lista { position: absolute; top: calc(100% + 2px); left: 0; right: 0; background: var(--branco); border: 1px solid var(--cinza-300); border-radius: 8px; box-shadow: 0 6px 16px rgba(0,0,0,.12); z-index: 300; max-height: 200px; overflow-y: auto; list-style: none; padding: 4px 0; margin: 0; }
.crm-select-lista li { padding: 8px 12px; font-size: 13px; cursor: pointer; color: var(--cinza-800); }
.crm-select-lista li:hover, .crm-select-lista li.sel { background: var(--cinza-50); color: var(--azul); font-weight: 600; }
.crm-select-lista li.vazio { color: var(--cinza-400); cursor: default; font-style: italic; }
.crm-select-cli-selecionado { font-size: 12px; color: var(--verde); margin-top: 4px; }

/* Histórico — layout geral */
.crm-secao-titulo { font-size: 11px; font-weight: 700; color: var(--cinza-500); text-transform: uppercase; letter-spacing: .5px; padding-bottom: 8px; border-bottom: 2px solid var(--cinza-100); margin-bottom: 12px; }
.crm-hist-bloco { margin-bottom: 20px; }
.crm-hist-acoes { display: flex; gap: 8px; margin: 4px 0 16px; }
.crm-btn-toggle { transition: background .15s, color .15s, border-color .15s; }
.crm-btn-toggle.ativa { background: var(--azul) !important; color: var(--branco) !important; border-color: var(--azul) !important; }
.crm-sem-registro { color: var(--cinza-400); font-size: 13px; font-style: italic; }

/* Próximas ações */
.crm-prox-acao { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; border-radius: 8px; background: #fffbe6; border: 1px solid #ffe58f; margin-bottom: 6px; gap: 8px; }
.crm-prox-acao.atrasada { background: #fff1f0; border-color: #ffccc7; }
.crm-prox-acao-info { display: flex; align-items: center; gap: 10px; }
.crm-prox-acao-icone { font-size: 16px; }
.crm-prox-acao-titulo { font-size: 13px; font-weight: 600; color: var(--cinza-800); }
.crm-prox-acao-data { font-size: 11px; color: var(--cinza-500); margin-top: 1px; }

/* Formulários colapsíveis */
.crm-form-collapse { background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px; padding: 14px; margin-bottom: 14px; }
.form-3col { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.crm-form-acoes-sm { display: flex; gap: 8px; margin-top: 10px; }

/* Timeline de interações */
.crm-tl-item { border-left: 3px solid var(--cinza-200); padding: 10px 14px; margin-bottom: 10px; border-radius: 0 8px 8px 0; background: var(--cinza-50); }
.crm-tl-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 5px; font-size: 11px; color: var(--cinza-500); }
.crm-tl-tipo { font-weight: 600; color: var(--cinza-700); }
.crm-tl-autor { font-style: italic; }
.crm-tl-texto { font-size: 13px; color: var(--cinza-800); line-height: 1.5; }

/* Proposta resumo — 2 colunas */
.crm-proposta-2col { grid-template-columns: repeat(2, 1fr) !important; }

/* Legacy — mantidos para compatibilidade */
.crm-int-canal { font-weight: 600; color: var(--cinza-600); }
.crm-int-autor { font-style: italic; }
.crm-aviso-verde { color: var(--verde); font-size: 13px; margin-top: 8px; }
.crm-aviso-perda { color: var(--vermelho); font-size: 13px; margin-top: 8px; }

/* Proposta */
.crm-proposta-item { display: grid; grid-template-columns: 1fr 56px 110px 90px 32px; gap: 6px; align-items: center; margin-bottom: 6px; }
.crm-proposta-item .input-padrao { min-width: 0; }
.crm-proposta-resumo { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 12px 0; }
.crm-prop-card { background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px; padding: 10px 14px; text-align: center; }
.crm-prop-card.destaque { background: #eff6ff; border-color: #bfdbfe; }
.crm-prop-card-label { font-size: 11px; color: var(--cinza-500); margin-bottom: 4px; }
.crm-prop-card-val { font-size: 17px; font-weight: 700; color: var(--cinza-800); }
.crm-prop-card.destaque .crm-prop-card-val { color: var(--azul); }
.crm-prop-card-val small { font-size: 12px; font-weight: 400; color: var(--cinza-500); }
.crm-preview-wa { margin-top: 14px; background: #e7fce9; border: 1px solid #b7eab9; border-radius: 10px; padding: 13px 16px; font-size: 13px; line-height: 1.6; color: #1a5c22; white-space: pre-wrap; }
.btn-danger-sm { background: #fff1f0; color: var(--vermelho); border: 1px solid #ffccc7; border-radius: 6px; padding: 4px 8px; font-size: 12px; cursor: pointer; }
.btn-funil-opcao { width: 100%; padding: 10px 16px; background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 8px; text-align: left; cursor: pointer; font-size: 13px; color: var(--cinza-700); transition: background .1s; }
.btn-funil-opcao:hover { background: var(--cinza-50); color: var(--azul); }

/* Checklist de contrato pós-fechamento */
.crm-contrato-checklist { margin-top: 18px; background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px; padding: 12px 14px; }
.crm-ct-titulo { font-size: 12px; font-weight: 600; color: var(--cinza-500); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 10px; }
.crm-ct-steps { display: flex; gap: 6px; flex-wrap: wrap; }
.crm-ct-step { display: flex; align-items: center; gap: 7px; background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 8px; padding: 8px 12px; font-size: 13px; cursor: pointer; color: var(--cinza-600); transition: all .15s; }
.crm-ct-step:hover { border-color: var(--azul); color: var(--azul); }
.crm-ct-step.feito { background: #ecfdf5; border-color: #6ee7b7; color: #065f46; }
.crm-ct-num { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--cinza-200); font-size: 11px; font-weight: 700; color: var(--cinza-600); flex-shrink: 0; }
.crm-ct-step.feito .crm-ct-num { background: #6ee7b7; color: #065f46; }
.crm-ct-label { font-weight: 500; }
.crm-ct-check { font-size: 14px; font-weight: 700; color: #059669; min-width: 14px; }

/* Modal completar dados do cliente (pós-ganho) */
.crm-completar-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 4px; }
.crm-completar-icone { font-size: 32px; line-height: 1; }
.btn-link-inline { background: none; border: none; color: var(--azul); cursor: pointer; font-size: 13px; text-decoration: underline; padding: 0; }

/* Feature Aguardando — Onboarding */
/* Tab bar: segment control */
.filtros-onboarding-aba {
  display: flex; gap: 0; margin-bottom: 20px;
  background: var(--cinza-100); border-radius: 10px; padding: 3px; width: fit-content;
}
.btn-filtro-onboarding {
  background: transparent; border: none; border-radius: 8px;
  padding: 7px 20px; font-size: 13px; font-weight: 500;
  color: var(--cinza-600); cursor: pointer; transition: all .15s;
}
.btn-filtro-onboarding:hover { color: var(--cinza-800); }
.btn-filtro-onboarding.ativo {
  background: var(--branco); color: var(--azul); font-weight: 600;
  box-shadow: 0 1px 4px rgba(0,0,0,.10);
}
.btn-filtro-onboarding.tem-pendencias:not(.ativo) { color: #b45309; }
.btn-filtro-onboarding.tem-pendencias.ativo { color: #92400e; }

.badge-aguardando { display: inline-block; background: #fef3c7; color: #92400e; border: 1px solid #fcd34d; border-radius: 12px; padding: 2px 8px; font-size: 11px; font-weight: 600; }

.item-tarefa.aguardando { background: #fffbeb; border-left: 3px solid #f59e0b; }

.bloco-aguardar-acoes { display: flex; align-items: center; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.bloco-data-aguardar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Lista de tarefas aguardando */
.grupo-aguardando { margin-bottom: 20px; }
.grupo-aguardando-header {
  display: flex; align-items: center; gap: 10px;
  font-weight: 600; font-size: 14px; color: var(--cinza-700);
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 10px; padding: 10px 14px; margin-bottom: 6px;
}
.grupo-aguardando-avatar {
  width: 32px; height: 32px; border-radius: 8px;
  background: var(--azul-claro); color: var(--azul);
  font-size: 11.5px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.grupo-aguardando-count {
  margin-left: auto;
  background: #fef3c7; color: #92400e; border: 1px solid #fcd34d;
  border-radius: 20px; padding: 2px 10px; font-size: 11px; font-weight: 600;
}
.item-aguardando {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-left: 3px solid #f59e0b; border-radius: 10px;
  padding: 12px 16px; margin-bottom: 6px; cursor: pointer;
  transition: box-shadow .15s, border-color .15s;
}
.item-aguardando:hover { box-shadow: var(--sombra-md); border-color: var(--cinza-300); }
.item-aguardando.vencida { border-left-color: #dc2626; background: #fff5f5; }
.item-aguardando-info { flex: 1; min-width: 0; }
.item-aguardando-desc { font-weight: 600; font-size: 14px; color: var(--cinza-800); margin-bottom: 5px; }
.item-aguardando-meta { font-size: 12px; color: var(--cinza-500); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.item-aguardando-nota { font-size: 11.5px; color: var(--cinza-500); font-style: italic; margin-top: 4px; }

@media (max-width: 768px) {
  .crm-dash-grid-2 { grid-template-columns: 1fr; }
  .crm-historico-col { grid-template-columns: 1fr; }
  .form-2col { grid-template-columns: 1fr; }
  .crm-funil-barra { flex-wrap: wrap; }
}

/* ---------- Utilitários globais (btn-sm, btn-sucesso, btn-perigo, input-sm) ---------- */
.btn-sm { padding: 5px 11px; font-size: 12.5px; border-radius: 6px; }
.btn-sucesso { background: var(--verde); color: white; border: none; padding: 8px 16px; border-radius: var(--raio); font-size: 14px; cursor: pointer; font-weight: 600; }
.btn-sucesso:hover { background: #166534; }
.btn-perigo  { background: white; color: var(--vermelho); border: 1px solid var(--cinza-300); padding: 7px 14px; border-radius: var(--raio); font-size: 14px; cursor: pointer; }
.btn-perigo:hover  { border-color: var(--vermelho); }
.input-sm { padding: 5px 8px; font-size: 12.5px; border-radius: 6px; border: 1px solid var(--cinza-300); background: white; cursor: pointer; }

/* ---------- Módulo Agenda (v2) ---------- */
.agenda-wrap { max-width: 860px; margin: 0 auto; }

/* Pill tabs */
.agenda-tab-bar {
  display: flex; background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 12px; padding: 4px; gap: 3px; margin-bottom: 24px;
}
.agenda-tab {
  flex: 1; background: transparent; border: 1px solid transparent; padding: 10px 10px;
  font-size: 13px; font-weight: 500; color: var(--cinza-500); cursor: pointer;
  border-radius: 9px; transition: all .18s; text-align: center; white-space: nowrap;
}
.agenda-tab.ativa {
  background: white; color: var(--azul); font-weight: 700;
  border-color: var(--cinza-100);
  box-shadow: 0 2px 8px rgba(12,28,140,.13);
}
.agenda-tab:hover:not(.ativa) { color: var(--cinza-700); background: var(--cinza-100); }

/* Section header */
.agenda-secao-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 18px; padding-bottom: 14px;
  border-bottom: 1px solid var(--cinza-100); gap: 12px;
}
.agenda-secao-titulo { font-size: 16px; font-weight: 700; color: var(--cinza-800); margin: 0 0 2px; }
.agenda-secao-count  { font-size: 12px; color: var(--cinza-400); font-weight: 500; }

/* Cards padrão */
.agenda-card {
  background: white; border: 1px solid var(--cinza-200); border-left: 4px solid var(--cinza-300);
  border-radius: 10px; padding: 16px 18px; margin-bottom: 8px;
  box-shadow: 0 1px 4px rgba(0,0,0,.05); transition: box-shadow .18s, transform .15s;
}
.agenda-card:hover { box-shadow: 0 5px 18px rgba(12,28,140,.1); transform: translateY(-1px); }
.agenda-card-resolvida { opacity: .55; }
.agenda-card-resolvida:hover { opacity: .78; }

.agenda-card-row1 {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px; gap: 8px; flex-wrap: wrap;
}
.agenda-card-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

.agenda-chip {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 20px; white-space: nowrap;
}
.agenda-chip-ok      { color: var(--verde)!important;    background: var(--verde-claro)!important; }
.agenda-chip-alert   { color: var(--vermelho)!important; background: var(--vermelho-claro)!important; }
.agenda-chip-neutral { color: var(--cinza-600)!important; background: var(--cinza-100)!important; }
.agenda-chip-equipe   { color: #6f42c1!important; background: #6f42c115!important; }
.agenda-chip-restrito { color: var(--cinza-500)!important; background: var(--cinza-100)!important; font-weight: 600!important; }

/* ── Grupos de notas (Suas / Equipe) ─────────────────────────────────────── */
.notas-grupo {
  margin-bottom: 28px;
}
.notas-grupo-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--cinza-200, #e9ecef);
}
.notas-grupo-icone {
  font-size: 16px;
  line-height: 1;
}
.notas-grupo-titulo {
  font-size: 13px;
  font-weight: 700;
  color: var(--cinza-700, #495057);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.notas-grupo-badge {
  font-size: 11px;
  font-weight: 700;
  background: var(--primario, #0C1C8C);
  color: #fff;
  padding: 2px 8px;
  border-radius: 20px;
}
.notas-grupo-vazio {
  font-size: 13px;
  color: var(--cinza-400, #adb5bd);
  margin: 0 0 8px;
  padding-left: 2px;
}
.notas-toggle-resolvidas {
  display: inline-block;
  background: none;
  border: 1px solid var(--cinza-300, #dee2e6);
  border-radius: 6px;
  padding: 5px 12px;
  font-size: 12.5px;
  color: var(--cinza-500, #6c757d);
  cursor: pointer;
  margin: 4px 0 12px;
  transition: background 0.15s;
}
.notas-toggle-resolvidas:hover {
  background: var(--cinza-100, #f8f9fa);
  color: var(--cinza-700, #495057);
}
.notas-equipe-filtro {
  margin-bottom: 12px;
}
.notas-equipe-filtro .input-padrao {
  max-width: 220px;
  font-size: 13px;
  padding: 6px 10px;
  height: 34px;
}

/* Hint de privacidade abaixo do seletor de equipe */
.agenda-participantes-hint {
  margin: 5px 0 0; font-size: 11.5px; color: var(--cinza-400); font-style: italic;
}

/* Seletor de participantes internos (checkboxes de equipe nos modais da Agenda) */
.agenda-participantes-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  background: var(--cinza-50);
  border: 1px solid var(--cinza-200);
  border-radius: 8px;
}
.agenda-participante-check {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  background: #fff;
  border: 1px solid var(--cinza-200);
  border-radius: 20px;
  font-size: 13px;
  color: var(--cinza-700);
  cursor: pointer;
  transition: border-color .15s, background .15s;
  user-select: none;
}
.agenda-participante-check:hover { border-color: #6f42c1; background: #6f42c108; }
.agenda-participante-check input[type="checkbox"] {
  width: 14px; height: 14px; margin: 0;
  accent-color: #6f42c1;
  cursor: pointer;
}
.agenda-participante-check:has(input:checked) {
  border-color: #6f42c1;
  background: #6f42c112;
  color: #6f42c1;
  font-weight: 600;
}

/* Seletor segmentado de tipo (Interna / Com cliente) */
.reu-tipo-seg {
  display: flex; border: 1px solid var(--cinza-200); border-radius: 8px; overflow: hidden;
}
.reu-tipo-btn {
  flex: 1; padding: 10px 14px; background: white; border: none; border-right: 1px solid var(--cinza-200);
  font-size: 13.5px; font-weight: 500; color: var(--cinza-600); cursor: pointer;
  transition: background .15s, color .15s; text-align: center;
}
.reu-tipo-btn:last-child { border-right: none; }
.reu-tipo-btn.ativa { background: var(--azul); color: white; font-weight: 700; }
.reu-tipo-btn:hover:not(.ativa) { background: var(--cinza-100); color: var(--cinza-800); }

/* Label de notificação ao cliente (evita overflow em telas pequenas) */
.reu-notificar-label {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 9px 12px; background: var(--cinza-50);
  border: 1px solid var(--cinza-200); border-radius: 8px;
  font-size: 13.5px; color: var(--cinza-700); cursor: pointer; line-height: 1.45;
}
.reu-notificar-label input[type="checkbox"] {
  width: 15px; height: 15px; cursor: pointer; margin-top: 2px;
  flex-shrink: 0; accent-color: var(--azul);
}

.agenda-card-date       { font-size: 12px; color: var(--cinza-500); font-weight: 500; white-space: nowrap; }
.agenda-card-date-alert { color: var(--vermelho); font-weight: 700; }
.agenda-card-titulo     { font-size: 15.5px; font-weight: 700; color: var(--cinza-800); margin-bottom: 5px; line-height: 1.3; }
.agenda-card-body       { font-size: 13.5px; color: var(--cinza-600); margin-bottom: 4px; white-space: pre-wrap; line-height: 1.5; }
.agenda-card-meta-linha { font-size: 13px; color: var(--cinza-600); margin-bottom: 4px; }

.agenda-card-actions {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--cinza-100);
}
.agenda-btn-ghost {
  background: none; border: 1px solid var(--cinza-200); color: var(--cinza-600);
  padding: 5px 12px; border-radius: 6px; font-size: 12.5px; cursor: pointer; transition: all .15s;
}
.agenda-btn-ghost:hover   { border-color: var(--azul); color: var(--azul); background: var(--azul-claro); }
.agenda-btn-success {
  background: var(--verde); color: white; border: none;
  padding: 5px 12px; border-radius: 6px; font-size: 12.5px; cursor: pointer; font-weight: 600; transition: background .15s;
}
.agenda-btn-success:hover { background: #166534; }
.agenda-btn-danger {
  background: none; border: 1px solid var(--cinza-200); color: var(--cinza-500);
  padding: 5px 12px; border-radius: 6px; font-size: 12.5px; cursor: pointer;
  transition: all .15s; margin-left: auto;
}
.agenda-btn-danger:hover { border-color: var(--vermelho); color: var(--vermelho); background: var(--vermelho-claro); }
.agenda-status-sel {
  padding: 5px 10px; font-size: 12.5px; border-radius: 6px;
  border: 1px solid var(--cinza-300); background: white; cursor: pointer;
}

/* Chip de cliente vinculado na pendência */
.agenda-chip-cliente { color: #0C1C8C!important; background: #0C1C8C12!important; }

/* Chip de setor na pendência */
.agenda-chip-setor { color: #6f42c1!important; background: #6f42c115!important; font-weight: 600; }

/* Barra de filtros das pendências */
.pend-filtros-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 8px;
  padding: 10px 14px;
  background: var(--cinza-50, #f8f9fa);
  border: 1px solid var(--cinza-200, #e9ecef);
  border-radius: 8px;
}
.pend-filtros-bar .input-padrao {
  flex: 1;
  min-width: 140px;
  max-width: 260px;
  margin: 0;
  font-size: 13px;
  padding: 6px 10px;
  height: 34px;
}
.pend-filtro-busca { flex: 2 !important; max-width: 340px !important; }
.pend-filtros-bar .btn { flex-shrink: 0; height: 34px; padding: 0 12px; font-size: 13px; }
.pend-filtros-resultado {
  font-size: 12px;
  color: var(--cinza-500, #6c757d);
  margin-bottom: 10px;
  padding-left: 2px;
}

/* Toolbar de formatação (Notas e Pendências) */
.agenda-toolbar {
  display: flex; gap: 6px; margin-bottom: 6px;
}
.ag-tb-btn {
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  color: var(--cinza-700); padding: 4px 10px; border-radius: 5px;
  font-size: 12px; cursor: pointer; transition: all .15s;
  line-height: 1.4; user-select: none;
}
.ag-tb-btn:hover { background: var(--azul-claro); border-color: var(--azul); color: var(--azul); }
.ag-tb-bold { font-weight: 800; min-width: 32px; text-align: center; }

/* Renderização formatada nos cards da Agenda */
.agenda-desc-html { font-size: 13.5px; color: var(--cinza-600); line-height: 1.55; white-space: normal; }
.agenda-desc-html .ag-p   { margin: 0 0 3px; }
.agenda-desc-html .ag-spacer { height: 6px; }
.agenda-desc-html .ag-item {
  display: flex; align-items: baseline; gap: 6px; margin: 1px 0;
}
.agenda-desc-html .ag-bullet { color: var(--azul); font-weight: 700; flex-shrink: 0; }
.agenda-desc-html .ag-num    { color: var(--cinza-500); font-weight: 700; flex-shrink: 0; min-width: 18px; }

/* ---------- Visão Geral: dashboard melhorado ---------- */

/* Cabeçalhos de seção */
.vg-secao { display: flex; align-items: center; gap: 10px; margin: 24px 0 10px; }
.vg-secao-icone { font-size: 16px; }
.vg-secao-titulo { font-size: 11px; font-weight: 700; color: var(--cinza-500); text-transform: uppercase; letter-spacing: 0.07em; white-space: nowrap; margin: 0; }
.vg-secao-linha { flex: 1; height: 1px; background: var(--cinza-150, var(--cinza-100)); }

/* Painel de atenção urgente */
.vg-painel-urgente { margin-top: 18px; }
.vg-urg-cabecalho h3 { color: var(--vermelho) !important; }
.vg-alertas-grid { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px 20px 16px; }
.vg-alerta-chip { display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: var(--raio); border: 1.5px solid; cursor: pointer; transition: box-shadow .15s; }
.vg-alerta-chip:hover { box-shadow: var(--sombra-md); }
.vg-alerta-vermelho { background: #fef2f2; border-color: #fca5a5; }
.vg-alerta-laranja  { background: #fff7ed; border-color: #fed7aa; }
.vg-alerta-info     { background: #eff6ff; border-color: #bfdbfe; }
.vg-alerta-cinza    { background: var(--cinza-50); border-color: var(--cinza-300); }
.vg-alerta-num { font-size: 20px; font-weight: 800; line-height: 1; }
.vg-alerta-vermelho .vg-alerta-num { color: var(--vermelho); }
.vg-alerta-laranja .vg-alerta-num  { color: #ea580c; }
.vg-alerta-info .vg-alerta-num     { color: var(--azul); }
.vg-alerta-cinza .vg-alerta-num    { color: var(--cinza-600); }
.vg-alerta-label { font-size: 13px; font-weight: 600; color: var(--cinza-700); }
.vg-urg-vazio { padding: 12px 20px 16px; font-size: 14px; font-weight: 600; color: var(--verde); }

/* Mini-cards de módulos secundários */
.vg-modulos-sec { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-top: 18px; }
.vg-modulo-card { background: white; border: 1.5px solid var(--cinza-200); border-radius: var(--raio-lg); padding: 16px 18px; display: flex; flex-direction: column; gap: 7px; box-shadow: var(--sombra-sm); transition: box-shadow .15s, border-color .15s; cursor: pointer; }
.vg-modulo-card:hover { box-shadow: var(--sombra-md); border-color: var(--azul); }
.vg-modulo-titulo { font-size: 13.5px; font-weight: 700; color: var(--cinza-800); margin-bottom: 3px; }
.vg-modulo-linha { font-size: 13px; color: var(--cinza-600); display: flex; align-items: baseline; gap: 5px; }
.vg-modulo-num { font-size: 17px; font-weight: 800; color: var(--cinza-800); }
.vg-num-alerta { color: var(--vermelho) !important; }
.vg-num-info   { color: var(--azul) !important; }
.vg-modulo-ok   { font-size: 12.5px; color: var(--verde); font-weight: 600; }
.vg-modulo-vazio { font-size: 12.5px; color: var(--cinza-400); }

/* Sublabel no stat-card (ex.: "X com atraso" abaixo do número) */
.stat-sublabel { font-size: 11px; font-weight: 600; margin-top: 4px; border-radius: 20px; padding: 1px 7px; display: inline-block; }
.stat-sublabel-alerta { color: var(--vermelho); background: #fef2f2; }

/* Empty state */
.agenda-empty { text-align: center; padding: 52px 20px; }
.agenda-empty-icon   { font-size: 42px; margin-bottom: 14px; }
.agenda-empty-titulo { font-size: 16px; font-weight: 700; color: var(--cinza-800); display: block; margin-bottom: 6px; }
.agenda-empty-sub    { font-size: 13.5px; color: var(--cinza-500); margin: 0; }

/* Card de Reunião (layout com bloco de data) */
.agenda-card-reu {
  background: white; border: 1px solid var(--cinza-200); border-radius: 10px;
  padding: 14px 16px; margin-bottom: 10px; display: flex; gap: 14px; align-items: flex-start;
  box-shadow: 0 1px 3px rgba(0,0,0,.04); transition: box-shadow .15s, transform .12s;
}
.agenda-card-reu:hover { box-shadow: 0 4px 14px rgba(12,28,140,.09); transform: translateY(-1px); }
.agenda-reu-date-block {
  flex-shrink: 0; width: 54px; border-radius: 9px; border: 1px solid transparent;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 8px 4px; text-align: center;
}
.agenda-reu-dia  { font-size: 24px; font-weight: 800; color: var(--cinza-800); line-height: 1; }
.agenda-reu-mes  { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--cinza-600); margin-top: 1px; }
.agenda-reu-hora { font-size: 11px; color: var(--cinza-500); margin-top: 4px; }
.agenda-reu-content { flex: 1; min-width: 0; }

/* Form */
.agenda-form { display: flex; flex-direction: column; gap: 12px; }
.agenda-form-grupo { display: flex; flex-direction: column; gap: 5px; }
.agenda-form-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.agenda-form label { font-size: 13px; font-weight: 600; color: var(--cinza-700); }
.agenda-form-acoes { display: flex; gap: 10px; margin-top: 8px; padding-top: 14px; border-top: 1px solid var(--cinza-100); }

@media (max-width: 600px) {
  .agenda-tab { font-size: 11.5px; padding: 9px 5px; }
  .agenda-card-reu { flex-direction: column; }
  .agenda-reu-date-block { width: 100%; flex-direction: row; gap: 8px; padding: 8px 12px; }
  .agenda-form-row2 { grid-template-columns: 1fr; }
}

/* ── Cards de Reunião redesenhados ─────────────────────────────────────── */
.reu-section { margin-bottom: 6px; }
.reu-section-lbl {
  font-size: 11.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .6px; color: var(--cinza-500); padding: 14px 0 8px;
}

/* Card base */
.reu-card {
  display: flex; align-items: center; gap: 14px;
  background: white; border: 1px solid var(--cinza-200); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04); transition: box-shadow .15s, transform .12s;
}
.reu-card:hover { box-shadow: 0 4px 14px rgba(12,28,140,.08); transform: translateY(-1px); }
.reu-card--agendada { border-left: 3px solid var(--azul); }
.reu-card--historico { opacity: .72; }
.reu-card--historico:hover { opacity: 1; }

/* Bloco de data */
.reu-date-blk {
  flex-shrink: 0; width: 52px; min-height: 60px;
  border-radius: 8px; border: 1px solid transparent;
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; padding: 6px 4px; text-align: center;
}
.reu-dia  { font-size: 22px; font-weight: 800; color: var(--cinza-800); line-height: 1; }
.reu-mes  { font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--cinza-500); margin-top: 2px; }
.reu-hora { font-size: 10.5px; color: var(--cinza-500); margin-top: 3px; font-weight: 600; }

/* Corpo do card */
.reu-body { flex: 1; min-width: 0; }
.reu-badges-row { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 5px; }
.reu-badge {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 600; padding: 2px 8px;
  border-radius: 20px; white-space: nowrap;
}
.reu-badge--ata-ok   { color: var(--verde)!important; background: #15803d18!important; }
.reu-badge--ata-pend { color: #b45309!important; background: #fef3c718!important; }
.reu-badge--sem-ata  { color: #dc2626!important; background: #dc262618!important; }
.reu-badge--ext      { color: var(--cinza-600)!important; background: var(--cinza-100)!important; cursor: default; }

.ver-reu-label {
  font-size: 11px; font-weight: 600; color: var(--cinza-500);
  text-transform: uppercase; letter-spacing: .05em; display: block;
}

.reu-titulo {
  font-size: 14px; font-weight: 700; color: var(--cinza-900);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.reu-meta  { font-size: 12px; color: var(--cinza-600); margin-top: 3px; }
.reu-pauta {
  font-size: 12px; color: var(--cinza-500); margin-top: 3px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Ações */
.reu-actions {
  flex-shrink: 0; display: flex; align-items: center; gap: 6px;
}
.btn-reu-realizar {
  background: var(--verde); color: white; border: none;
  padding: 6px 13px; border-radius: 7px; font-size: 12.5px;
  font-weight: 700; cursor: pointer; white-space: nowrap; transition: background .15s;
}
.btn-reu-realizar:hover { background: #166534; }
.btn-reu-ghost {
  background: none; border: 1px solid var(--cinza-200); color: var(--cinza-600);
  padding: 6px 12px; border-radius: 7px; font-size: 12.5px; cursor: pointer; transition: all .15s;
}
.btn-reu-ghost:hover { border-color: var(--azul); color: var(--azul); background: var(--azul-claro); }
.btn-reu-icon-danger {
  background: none; border: 1px solid var(--cinza-200); color: var(--cinza-400);
  width: 32px; height: 32px; border-radius: 7px; font-size: 14px;
  cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.btn-reu-icon-danger:hover { border-color: var(--vermelho); color: var(--vermelho); background: var(--vermelho-claro); }

/* Dropdown ••• */
.reu-menu-wrap { position: relative; }
.btn-reu-menu {
  background: none; border: 1px solid var(--cinza-200); color: var(--cinza-600);
  width: 32px; height: 32px; border-radius: 7px; font-size: 15px; font-weight: 800;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  letter-spacing: -1px; transition: all .15s;
}
.btn-reu-menu:hover { border-color: var(--cinza-400); background: var(--cinza-50); }
.reu-menu-drop {
  display: none; position: absolute; right: 0; top: calc(100% + 4px);
  background: white; border: 1px solid var(--cinza-200); border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0,0,0,.12); min-width: 180px; z-index: 200;
  overflow: hidden;
}
.reu-menu-drop.aberto { display: block; }
.reu-menu-drop button {
  display: block; width: 100%; text-align: left;
  padding: 10px 14px; font-size: 13px; color: var(--cinza-700);
  background: none; border: none; cursor: pointer; transition: background .12s;
}
.reu-menu-drop button:hover { background: var(--cinza-50); }
.reu-menu-drop .reu-drop-cancel { color: #b45309; }
.reu-menu-drop .reu-drop-cancel:hover { background: #fef3c740; }
.reu-menu-drop .reu-drop-danger { color: var(--vermelho); }
.reu-menu-drop .reu-drop-danger:hover { background: var(--vermelho-claro); }

/* Seção histórico (colapsável) */
.reu-hist-toggle {
  width: 100%; display: flex; align-items: center; gap: 8px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 8px; padding: 10px 14px; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--cinza-700);
  margin: 8px 0; transition: background .15s;
}
.reu-hist-toggle:hover { background: var(--cinza-100); }
.reu-hist-count {
  background: var(--cinza-200); color: var(--cinza-700);
  font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 20px;
}
.reu-hist-icon { margin-left: auto; font-size: 11px; color: var(--cinza-500); }
.reu-hist-body { padding-top: 4px; }

@media (max-width: 600px) {
  .reu-card { flex-wrap: wrap; }
  .reu-actions { width: 100%; justify-content: flex-end; padding-top: 8px; border-top: 1px solid var(--cinza-100); }
  .reu-titulo { white-space: normal; }
}

/* ---------- Módulo Obrigações ---------- */
.obr-wrap { max-width: 1100px; margin: 0 auto; }

/* Select estilizado */
.obr-select {
  appearance: none; -webkit-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236B7280' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center;
  border: 1.5px solid var(--cinza-200); border-radius: 8px;
  padding: 8px 34px 8px 11px;
  font-size: 13.5px; color: var(--cinza-800); line-height: 1.4;
  cursor: pointer; transition: border-color .15s, box-shadow .15s;
  min-width: 0; max-width: 100%;
}
.obr-select:hover { border-color: var(--cinza-400); }
.obr-select:focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px rgba(12,28,140,.12); }

/* Toggle switch */
.obr-toggle { position: relative; display: inline-block; width: 40px; height: 22px; flex-shrink: 0; }
.obr-toggle input { opacity: 0; width: 0; height: 0; position: absolute; }
.obr-toggle-slider {
  position: absolute; inset: 0; background: var(--cinza-300); border-radius: 22px;
  cursor: pointer; transition: background .2s;
}
.obr-toggle-slider::before {
  content: ''; position: absolute; width: 16px; height: 16px;
  left: 3px; top: 3px; background: white; border-radius: 50%;
  transition: transform .2s; box-shadow: 0 1px 3px rgba(0,0,0,.25);
}
.obr-toggle input:checked + .obr-toggle-slider { background: var(--azul); }
.obr-toggle input:checked + .obr-toggle-slider::before { transform: translateX(18px); }
.obr-toggle-wrap { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--cinza-100); }
.obr-toggle-wrap:last-child { border-bottom: none; }
.obr-toggle-label { font-size: 13.5px; color: var(--cinza-700); flex: 1; }

/* Toolbar */
.obr-toolbar {
  display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap;
  margin-bottom: 20px; padding: 14px 18px;
  background: white; border: 1px solid var(--cinza-200); border-radius: 10px;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.obr-filter-group { display: flex; flex-direction: column; gap: 4px; }
.obr-filter-label { font-size: 10.5px; font-weight: 700; color: var(--cinza-500); text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
.obr-toolbar-divider { width: 1px; background: var(--cinza-200); align-self: stretch; margin: 0 2px; }
.obr-filter-toggle { display: flex; align-items: center; gap: 8px; padding-bottom: 2px; }

/* Dashboard */
.obr-dashboard {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px;
}
.obr-dash-card {
  background: white; border: 1px solid var(--cinza-200); border-left: 4px solid var(--azul);
  border-radius: 10px; padding: 16px 18px;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.obr-dash-card-header { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.obr-dash-icon  { font-size: 18px; line-height: 1; }
.obr-dash-label { font-size: 11.5px; font-weight: 700; color: var(--cinza-600); text-transform: uppercase; letter-spacing: .4px; }
.obr-dash-nums  { font-size: 26px; font-weight: 800; color: var(--cinza-800); line-height: 1; margin-bottom: 8px; }
.obr-dash-sep   { font-size: 18px; color: var(--cinza-300); margin: 0 3px; font-weight: 300; }
.obr-dash-bar   { height: 5px; background: var(--cinza-100); border-radius: 99px; overflow: hidden; margin-bottom: 5px; }
.obr-dash-fill  { height: 100%; border-radius: 99px; transition: width .4s ease; }
.obr-dash-pct   { font-size: 11.5px; font-weight: 700; }

/* Tabela */
.obr-tabela-wrap { background: white; border: 1px solid var(--cinza-200); border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.04); }
.obr-tabela { width: 100%; border-collapse: collapse; }
.obr-tabela thead th {
  padding: 11px 14px; text-align: left; font-size: 11.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .4px; color: var(--cinza-500);
  background: var(--cinza-50); border-bottom: 1px solid var(--cinza-200);
}
.obr-th-center { text-align: center !important; }
.obr-tr { border-bottom: 1px solid var(--cinza-100); transition: background .12s; }
.obr-tr:hover { background: #f8f9ff; }
.obr-tr:last-child { border-bottom: none; }
.obr-tabela td { padding: 10px 14px; vertical-align: middle; }
.obr-td-nome    { min-width: 220px; }
.obr-td-center  { text-align: center; }
.obr-td-acoes   { text-align: right; white-space: nowrap; }
.obr-td-resp    { min-width: 120px; }
.obr-nome { font-size: 13.5px; font-weight: 600; color: var(--cinza-800); display: block; margin-bottom: 3px; }
.obr-resp { font-size: 12px; color: var(--cinza-600); }
.obr-resp-vazio { font-size: 12px; color: var(--cinza-400); }
.obr-vazio { text-align: center; padding: 40px; color: var(--cinza-500); font-size: 13.5px; }

/* Chips na tabela */
.obr-chip {
  display: inline-block; font-size: 10.5px; font-weight: 700;
  padding: 2px 7px; border-radius: 20px; border: 1px solid transparent;
  white-space: nowrap; line-height: 1.6;
}
.obr-chip-trib  { background: #ede9fe; color: #6d28d9; border-color: #ddd6fe; margin-right: 3px; }
.obr-chip-folha { background: var(--cinza-100); color: var(--cinza-600); border-color: var(--cinza-200); }

/* Botão de status inline */
.obr-status-btn { background: none; border: none; cursor: pointer; padding: 2px; border-radius: 6px; transition: opacity .15s; }
.obr-status-btn:hover:not(:disabled) { opacity: .75; }
.obr-status-btn:disabled { cursor: default; }

/* Config lista */
.obr-config-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border: 1.5px solid var(--cinza-200); border-radius: 8px;
  background: var(--cinza-50); transition: border-color .15s, background .15s;
}
.obr-config-item:hover { background: white; border-color: var(--azul); }

/* Modal detalhe */
.obr-det-tabela { width: 100%; border-collapse: collapse; margin-bottom: 4px; }
.obr-det-tabela thead th {
  padding: 8px 12px; text-align: left; font-size: 11.5px; font-weight: 700;
  text-transform: uppercase; color: var(--cinza-500); border-bottom: 2px solid var(--cinza-200);
}
.obr-det-row td { padding: 8px 12px; border-bottom: 1px solid var(--cinza-100); font-size: 13.5px; }
.obr-det-row:last-child td { border-bottom: none; }
.obr-det-na td  { opacity: .5; }
.obr-det-na-txt { font-size: 12px; color: var(--cinza-400); }
.obr-det-sub td { background: var(--cinza-50); font-size: 13px; }
.obr-det-check  { display: flex; align-items: center; gap: 7px; font-size: 13px; cursor: pointer; }

/* Row coloring por estado geral */
.obr-tr-ok:not(:hover) td { background: #f0fdf4; }
.obr-tr-ok:hover td { background: #dcfce7; }

/* Modal detalhe — blocos por obrigação */
.obr-modal-progress { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.obr-modal-progress-bar { flex: 1; height: 5px; background: var(--cinza-100); border-radius: 99px; overflow: hidden; }
.obr-modal-progress-fill { height: 100%; border-radius: 99px; transition: width .3s; }
.obr-blocos { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.obr-bloco {
  border: 1.5px solid var(--cinza-200); border-radius: 10px; overflow: hidden;
  transition: border-color .15s;
}
.obr-bloco-ok { border-color: #86efac; }
.obr-bloco-na { opacity: .5; }
.obr-bloco-header {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 11px 14px; background: var(--cinza-50);
  border-bottom: 1px solid var(--cinza-200);
}
.obr-bloco-ok > .obr-bloco-header { background: #f0fdf4; border-bottom-color: #bbf7d0; }
.obr-bloco-na > .obr-bloco-header { border-bottom: none; }
.obr-bloco-icon  { font-size: 17px; line-height: 1; flex-shrink: 0; }
.obr-bloco-titulo { font-size: 13.5px; font-weight: 700; color: var(--cinza-800); }
.obr-bloco-acoes { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.obr-bloco-ts { font-size: 11px; color: var(--cinza-500); white-space: nowrap; }
.obr-bloco-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.obr-sub-passo { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--cinza-700); cursor: pointer; }
.obr-obs-field {
  width: 100%; resize: none; font-size: 13px; min-height: 34px;
  border: 1.5px solid var(--cinza-200); border-radius: 7px; padding: 7px 10px;
  color: var(--cinza-700); background: white; transition: border-color .15s;
}
.obr-obs-field:focus { outline: none; border-color: var(--azul); }
.obr-obs-field::placeholder { color: var(--cinza-400); }
.obr-det-obs-global { margin-bottom: 14px; }
.obr-det-obs-global label { display: block; font-size: 12px; font-weight: 600; color: var(--cinza-500); margin-bottom: 5px; text-transform: uppercase; letter-spacing: .4px; }

@media (max-width: 860px) {
  .obr-dashboard { grid-template-columns: repeat(2, 1fr); }
  .obr-tabela { display: block; overflow-x: auto; }
  .obr-toolbar { gap: 8px; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   MÓDULO GESTÃO INTERNA
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Tabela genérica do módulo ──────────────────────────────────────────────── */
.gestao-tabela-wrapper { overflow-x: auto; }
.gestao-tabela {
  width: 100%; border-collapse: collapse; font-size: 13.5px;
}
.gestao-tabela thead th {
  background: var(--cinza-50); padding: 9px 12px;
  text-align: left; font-size: 11.5px; font-weight: 700;
  color: var(--cinza-600); text-transform: uppercase; letter-spacing: .4px;
  border-bottom: 1.5px solid var(--cinza-200);
}
.gestao-tabela tbody td {
  padding: 10px 12px; border-bottom: 1px solid var(--cinza-100);
  color: var(--cinza-800); vertical-align: middle;
}
.gestao-tabela tbody tr:last-child td { border-bottom: none; }
.gestao-tabela tbody tr:hover td { background: var(--cinza-50); }
.gestao-row-inativo td { opacity: .55; }
.gestao-acoes { display: flex; gap: 6px; white-space: nowrap; }

/* ── Grupo por tipo (Patrimônio) ─────────────────────────────────────────────── */
.gestao-grupo-titulo {
  font-size: 14px; font-weight: 700; color: var(--cinza-800);
  margin: 0 0 10px; display: flex; align-items: center; gap: 8px;
}
.badge-count {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--cinza-200); color: var(--cinza-600);
  border-radius: 99px; padding: 1px 8px; font-size: 11.5px; font-weight: 600;
}

/* ── Grupo por responsável (E-mails) ─────────────────────────────────────────── */
.gestao-email-responsavel-header {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 0 6px; border-bottom: 2px solid var(--azul-claro);
  margin-bottom: 10px;
}
.gestao-email-responsavel-nome {
  font-size: 14px; font-weight: 700; color: var(--azul);
}
.gestao-email-contas { display: flex; flex-direction: column; gap: 8px; }
.gestao-email-card {
  background: var(--branco); border: 1.5px solid var(--cinza-200);
  border-radius: var(--raio); padding: 12px 14px;
  display: flex; flex-direction: column; gap: 6px;
}
.gestao-email-card-topo {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.gestao-email-endereco {
  font-size: 13.5px; color: var(--cinza-800); font-weight: 500;
}
.gestao-email-desc { font-size: 12px; color: var(--cinza-600); }
.gestao-email-obs  { font-size: 12px; }
.gestao-email-senha-linha {
  display: flex; align-items: center; gap: 8px; font-size: 13px;
  color: var(--cinza-600); flex-wrap: wrap;
}
.gestao-senha-val { font-family: monospace; letter-spacing: .05em; }

/* ── Badges de tipo de e-mail ────────────────────────────────────────────────── */
.gestao-badge {
  display: inline-flex; align-items: center; padding: 2px 9px;
  border-radius: 99px; font-size: 11.5px; font-weight: 700; white-space: nowrap;
}
.gestao-badge-ms  { background: #dbeafe; color: #1d4ed8; }
.gestao-badge-gg  { background: #fce7f3; color: #be185d; }
.gestao-badge-res { background: var(--azul-claro); color: var(--azul); }
.gestao-badge-out { background: var(--cinza-100); color: var(--cinza-600); }

/* ── Cards de Licenças ───────────────────────────────────────────────────────── */
.gestao-licenca-card {
  background: var(--branco); border: 1.5px solid var(--cinza-200);
  border-radius: var(--raio-lg); margin-bottom: 1rem;
  box-shadow: var(--sombra-sm);
}
.gestao-licenca-topo {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 16px; border-bottom: 1px solid var(--cinza-100);
  background: var(--cinza-50); border-radius: var(--raio-lg) var(--raio-lg) 0 0;
}
.gestao-licenca-nome { font-size: 15px; font-weight: 700; color: var(--cinza-800); }
.gestao-licenca-plano { font-size: 12.5px; color: var(--cinza-600); }
.gestao-licenca-corpo { padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; }
.gestao-licenca-info { font-size: 13px; color: var(--cinza-700); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gestao-lic-label { font-weight: 600; color: var(--cinza-600); min-width: 90px; }

/* Barra de progresso de vagas */
.gestao-progress-bar {
  flex: 1; min-width: 80px; max-width: 180px;
  height: 6px; background: var(--cinza-200); border-radius: 99px; overflow: hidden;
}
.gestao-progress-fill { height: 100%; border-radius: 99px; transition: width .3s; }
.fill-ok      { background: var(--verde); }
.fill-atencao { background: var(--amarelo); }
.fill-danger  { background: var(--vermelho); }

/* Chips de usuários vinculados */
.gestao-lic-usuarios { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.gestao-lic-user-chip {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--azul-claro); color: var(--azul);
  border-radius: 99px; padding: 2px 10px 2px 10px; font-size: 12px; font-weight: 600;
}
.btn-remover-usuario-lic {
  background: none; border: none; cursor: pointer;
  color: var(--azul); font-size: 15px; line-height: 1; padding: 0 2px;
  opacity: .6;
}
.btn-remover-usuario-lic:hover { opacity: 1; color: var(--vermelho); }

/* ── Badges reutilizados (garante compatibilidade) ──────────────────────────── */
/* Base da pílula — faltava em todo o app (cada .badge-X só definia cor, nunca forma).
   Adição pura e seguro: não existia efeito nenhum antes, então não há nada pra
   sobrescrever. De brinde, conserta os badges já existentes em Gestão Interna
   (Patrimônio/Celulares/Licenças de Software), que usam o mesmo padrão
   `class="badge badge-X"` e estavam no mesmo buraco. */
.badge {
  display: inline-block; padding: 2px 9px; border-radius: 12px;
  font-size: 11px; font-weight: 600; line-height: 1.5; white-space: nowrap;
}
.badge-ativo    { background: var(--verde-claro);   color: var(--verde);   }
.badge-inativo  { background: var(--cinza-100);     color: var(--cinza-600); }
.badge-neutro   { background: var(--cinza-100);     color: var(--cinza-600); }
.badge-atencao  { background: var(--amarelo-claro); color: var(--amarelo); }
.badge-danger   { background: var(--vermelho-claro); color: var(--vermelho); }
.badge-verde    { background: var(--verde-claro);   color: var(--verde);   }
.badge-vermelho { background: var(--vermelho-claro); color: var(--vermelho); }
.badge-azul     { background: var(--azul-claro);    color: var(--azul);    }

/* ── txt-muted helper ─────────────────────────────────────────────────────────── */
.txt-muted { color: var(--cinza-500); }

@media (max-width: 860px) {
  .gestao-tabela { font-size: 12.5px; }
  .gestao-licenca-topo { gap: 7px; }
  .gestao-lic-label { min-width: unset; }
}

/* ═══════════════════════════════════════════════════════════════
   Módulo Contábil — Implantação e Fechamento Mensal
═══════════════════════════════════════════════════════════════ */

/* Grid de cards da Implantação */
.contabil-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

/* Card individual de implantação */
.contabil-card {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
  padding: 1rem 1.1rem;
  cursor: pointer;
  transition: box-shadow .15s, border-color .15s;
}
.contabil-card:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,.1);
  border-color: var(--azul);
}
.contabil-card-topo {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: .5rem;
}
.contabil-card-nome {
  flex: 1;
  font-size: 15px;
  font-weight: 700;
  color: var(--cinza-800);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.contabil-card-detalhe {
  font-size: 12.5px;
  color: var(--cinza-500);
  margin-bottom: .2rem;
}

/* Chip de regime tributário */
.contabil-regime {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  letter-spacing: .03em;
  white-space: nowrap;
}
.contabil-regime-sm {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 99px;
  font-size: 10.5px;
  font-weight: 700;
  color: #fff;
  margin-right: 4px;
}

/* Badge de status da implantação */
.contabil-badge-status {
  font-size: 11.5px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 6px;
  white-space: nowrap;
}
.contabil-status-em_andamento { background: #dbeafe; color: #1e40af; }
.contabil-status-concluido    { background: #d1fae5; color: #065f46; }
.contabil-status-suspenso     { background: #fef3c7; color: #92400e; }

/* Barra de progresso das etapas */
.contabil-progresso-barra {
  height: 6px;
  background: var(--cinza-100);
  border-radius: 99px;
  margin-top: .7rem;
  overflow: hidden;
}
.contabil-progresso-fill {
  height: 100%;
  background: var(--azul);
  border-radius: 99px;
  transition: width .3s;
}
.contabil-progresso-txt {
  font-size: 11.5px;
  color: var(--cinza-400);
  margin-top: .3rem;
}

/* Título de seção (Em Andamento / Concluídas) */
.contabil-secao-titulo {
  font-size: 13px;
  font-weight: 700;
  color: var(--cinza-500);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0 0 .7rem;
}

/* Etapas no modal de detalhe */
.contabil-etapa {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  padding: .55rem .6rem;
  border-radius: 7px;
  transition: background .12s;
  margin-bottom: 2px;
}
.contabil-etapa:hover { background: var(--cinza-50, #f9f9f9); }
.contabil-etapa-ok { background: #f0fdf4; }
.contabil-etapa-check { padding-top: 1px; }
.contabil-etapa-check input[type=checkbox] { width: 16px; height: 16px; cursor: pointer; accent-color: var(--verde); }
.contabil-etapa-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.contabil-etapa-label {
  font-size: 14px;
  color: var(--cinza-800);
}
.contabil-etapa-ok .contabil-etapa-label {
  color: #15803d;
  font-weight: 600;
}
.contabil-etapa-data { font-size: 11.5px; color: var(--cinza-400); }
.contabil-etapa-obs-btn {
  background: none; border: none; cursor: pointer; font-size: 14px;
  opacity: .4; transition: opacity .15s; padding: 2px 4px;
}
.contabil-etapa-obs-btn:hover { opacity: 1; }
.contabil-etapa-obs-txt {
  width: 100%; font-size: 12px; color: var(--cinza-500);
  background: var(--cinza-50,#f9f9f9); border-radius: 5px;
  padding: 4px 8px; margin-top: 3px; font-style: italic;
}

/* Dashboard de resumo do Fechamento Mensal */
.contabil-dash-row {
  display: flex;
  gap: .8rem;
  flex-wrap: wrap;
  margin-bottom: 1.2rem;
}
.contabil-dash-card {
  flex: 1;
  min-width: 110px;
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
  padding: .8rem 1rem;
  text-align: center;
}
.contabil-dash-num {
  font-size: 26px;
  font-weight: 800;
  color: var(--cinza-800);
  line-height: 1;
}
.contabil-dash-label {
  font-size: 11.5px;
  color: var(--cinza-500);
  margin-top: .3rem;
}

/* Filtros da aba Fechamento */
.contabil-filtros-row {
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: .8rem;
}

/* Chips de status/atraso na tabela */
.contabil-status-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}
.contabil-atraso {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}
.contabil-atraso-ok       { background: #d1fae5; color: #065f46; }
.contabil-atraso-alerta   { background: #fef3c7; color: #92400e; }
.contabil-atraso-urgente  { background: #fee2e2; color: #991b1b; }
.contabil-atraso-atrasado { background: #fce7f3; color: #9d174d; }

/* Badge de auditada */
.contabil-auditada {
  display: inline-block;
  margin-left: 5px;
  font-size: 11px;
  color: #198754;
  font-weight: 700;
}

/* chip-resumo (reutilizado nos headers) */
.chip-resumo {
  display: inline-block;
  background: var(--cinza-100);
  color: var(--cinza-700);
  font-size: 12.5px;
  padding: 3px 10px;
  border-radius: 99px;
}

@media (max-width: 700px) {
  .contabil-grid { grid-template-columns: 1fr; }
  .contabil-dash-row { gap: .5rem; }
  .contabil-dash-card { min-width: 80px; padding: .6rem .7rem; }
  .contabil-dash-num { font-size: 20px; }
}

/* ── Redesign Fechamento Mensal ──────────────────────────────────────────── */

/* Barra de filtros */
.fech-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1.25rem;
  padding: .75rem 1rem;
  background: var(--cinza-50);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
}
.fech-comp-wrap { display: flex; align-items: center; gap: .4rem; }
.fech-comp-label { font-size: 12px; font-weight: 600; color: var(--cinza-500); white-space: nowrap; }
.fech-comp-input { padding: .35rem .6rem; border: 1.5px solid var(--cinza-300); border-radius: 7px; font-size: 14px; }
.fech-select { padding: .35rem .6rem; border: 1.5px solid var(--cinza-300); border-radius: 7px; font-size: 13.5px; background: #fff; }

/* Painéis do dashboard */
.fech-dash-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.fech-dash-painel {
  background: #fff;
  border: 1px solid var(--cinza-200);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.fech-dash-painel-titulo {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--cinza-700);
  margin-bottom: .2rem;
  display: flex;
  align-items: baseline;
  gap: .6rem;
}
.fech-dash-painel-sub {
  font-size: 11.5px;
  font-weight: 400;
  color: var(--cinza-400);
}
.fech-dash-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .5rem;
  margin: .75rem 0 .6rem;
}
.fech-dash-card {
  background: var(--cinza-50);
  border-radius: 8px;
  padding: .55rem .6rem;
  text-align: center;
}
.fech-card-prazo  { background: #d1fae5; }
.fech-card-atraso { background: #fef3c7; }
.fech-card-nao    { background: #fee2e2; }
.fech-card-ok     { background: #d1fae5; }
.fech-card-urgente{ background: #fee2e2; }
.fech-dash-num { font-size: 22px; font-weight: 800; color: var(--cinza-700); line-height: 1.1; }
.fech-num-pct  { font-size: 18px; color: var(--primario); }
.fech-dash-label { font-size: 10.5px; color: var(--cinza-500); margin-top: .15rem; }

/* Barra de progresso */
.fech-progress-wrap { margin-top: .25rem; }
.fech-progress-bar {
  height: 6px;
  background: var(--cinza-200);
  border-radius: 99px;
  overflow: hidden;
  display: flex;
}
.fech-progress-fill { height: 100%; transition: width .3s; }
.fech-progress-prazo  { background: #10b981; }
.fech-progress-atraso { background: #f59e0b; }
.fech-progress-legend {
  display: flex;
  gap: .75rem;
  margin-top: .35rem;
  flex-wrap: wrap;
}
.fech-leg { font-size: 11px; color: var(--cinza-500); }
.fech-leg-prazo  { color: #065f46; font-weight: 600; }
.fech-leg-atraso { color: #92400e; font-weight: 600; }
.fech-leg-nao    { color: #991b1b; font-weight: 600; }

/* Tabela */
.fech-table-wrap { margin-top: .5rem; }
.fech-tabela { width: 100%; }
.fech-nome-cliente { font-weight: 600; }
.fech-col-resp { color: var(--cinza-500); font-size: 13px; }

/* Chip de docs */
.fech-docs-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 99px;
  font-size: 11.5px;
  font-weight: 600;
}
.fech-docs-prazo { background: #d1fae5; color: #065f46; }
.fech-docs-atraso { background: #fef3c7; color: #92400e; }
.fech-docs-nao   { background: #f3f4f6; color: #6b7280; }

/* Modal redesenhado */
.fech-modal-header {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--cinza-200);
}
.fech-modal-titulo h2 {
  margin: 0 0 .2rem;
  font-size: 17px;
  font-weight: 800;
  color: var(--cinza-800);
}
.fech-modal-sub { font-size: 12.5px; color: var(--cinza-500); }
.fech-modal-secao {
  margin-bottom: 1.1rem;
  background: var(--cinza-50);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
  overflow: hidden;
}
.fech-modal-secao-titulo {
  font-size: 13px;
  font-weight: 700;
  color: var(--cinza-700);
  padding: .6rem 1rem .1rem;
}
.fech-modal-secao-sub {
  font-size: 11.5px;
  color: var(--cinza-400);
  padding: 0 1rem .5rem;
}
.fech-modal-secao-corpo {
  background: #fff;
  padding: .75rem 1rem;
  border-top: 1px solid var(--cinza-200);
}
.fech-field-label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--cinza-600);
  margin-bottom: .15rem;
}
.fech-field-input {
  display: block;
  width: 100%;
  padding: .45rem .65rem;
  border: 1.5px solid var(--cinza-200);
  border-radius: 7px;
  font-size: 14px;
  margin-top: .3rem;
  box-sizing: border-box;
}
.fech-auditada-wrap {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: 13.5px;
  color: var(--cinza-700);
  cursor: pointer;
}

/* Badge de meta de docs no modal */
.fech-meta-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 99px;
  font-size: 12.5px;
  font-weight: 600;
}
.fech-meta-prazo  { background: #d1fae5; color: #065f46; }
.fech-meta-atraso { background: #fef3c7; color: #92400e; }
.fech-meta-nao    { background: #f3f4f6; color: #6b7280; }

@media (max-width: 700px) {
  .fech-dash-row { grid-template-columns: 1fr; }
  .fech-dash-cards { grid-template-columns: repeat(2, 1fr); }
  .fech-col-resp { display: none; }
  .fech-toolbar { flex-direction: column; align-items: stretch; }
}

/* ── Modal Nova Implantação — Design moderno ─────────────────────────────── */
.impl-header {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.6rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--cinza-100);
}
.impl-header-icon {
  font-size: 26px;
  background: var(--azul-claro);
  border-radius: 10px;
  padding: .55rem .65rem;
  line-height: 1;
  flex-shrink: 0;
}
.impl-titulo {
  margin: 0 0 .2rem;
  font-size: 18px;
  font-weight: 800;
  color: var(--cinza-800);
}
.impl-subtitulo {
  margin: 0;
  font-size: 13px;
  color: var(--cinza-500);
  line-height: 1.4;
}
.impl-campo {
  margin-bottom: 1.1rem;
}
.impl-lbl {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--cinza-600);
  margin-bottom: .45rem;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.impl-opcional {
  font-weight: 400;
  color: var(--cinza-400);
  text-transform: none;
  letter-spacing: 0;
}
.impl-ctrl {
  width: 100%;
  padding: .6rem .8rem;
  border: 1.5px solid var(--cinza-200);
  border-radius: 8px;
  font-size: 14px;
  color: var(--cinza-800);
  background: var(--branco);
  transition: border-color .15s, box-shadow .15s;
  box-sizing: border-box;
  font-family: inherit;
}
.impl-ctrl:focus {
  outline: none;
  border-color: var(--azul);
  box-shadow: 0 0 0 3px rgba(67,97,238,.08);
}
.impl-textarea {
  resize: vertical;
  min-height: 70px;
}
.impl-dica {
  display: block;
  font-size: 11.5px;
  color: var(--cinza-400);
  margin-top: .35rem;
  line-height: 1.4;
}
/* Grid de datas lado a lado */
.impl-datas-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
/* Pills de regime tributário */
.impl-regime-pills {
  display: flex;
  gap: .6rem;
}
.impl-pill {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
  padding: .75rem .5rem;
  border: 2px solid var(--cinza-200);
  border-radius: 10px;
  background: var(--branco);
  cursor: pointer;
  transition: border-color .15s, background .15s, transform .1s;
}
.impl-pill:hover {
  border-color: var(--cinza-300);
  background: var(--cinza-50, #f9fafb);
  transform: translateY(-1px);
}
.impl-pill strong {
  font-size: 16px;
  font-weight: 800;
  color: var(--cinza-600);
  line-height: 1;
}
.impl-pill span {
  font-size: 10px;
  color: var(--cinza-400);
  text-align: center;
  line-height: 1.3;
}
/* Estados ativos por regime */
.impl-pill-ativo[data-regime="SN"] { border-color: #0d6efd; background: #eff6ff; }
.impl-pill-ativo[data-regime="SN"] strong { color: #0d6efd; }
.impl-pill-ativo[data-regime="LP"] { border-color: #e67e22; background: #fff8f0; }
.impl-pill-ativo[data-regime="LP"] strong { color: #e67e22; }
.impl-pill-ativo[data-regime="LR"] { border-color: #8e44ad; background: #faf0ff; }
.impl-pill-ativo[data-regime="LR"] strong { color: #8e44ad; }
/* Footer do modal */
.impl-footer {
  display: flex;
  justify-content: flex-end;
  gap: .75rem;
  margin-top: 1.5rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--cinza-100);
}
@media (max-width: 520px) {
  .impl-datas-grid { grid-template-columns: 1fr; }
  .impl-regime-pills { flex-direction: column; }
}

/* ── Módulo Controle de Ponto ─────────────────────────────────────────────── */

/* Tabs do módulo */
.ponto-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 1.5rem;
  border-bottom: 2px solid var(--cinza-200);
  overflow-x: auto;
  scrollbar-width: thin;
}
.ponto-tab {
  padding: .6rem 1.15rem;
  border: none;
  background: transparent;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--cinza-500);
  cursor: pointer;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: color .15s, border-color .15s;
  border-radius: 0;
  white-space: nowrap;
  flex-shrink: 0;
}
.ponto-tab.ponto-tab-ativa {
  color: var(--azul);
  border-bottom-color: var(--azul);
}
.ponto-tab:hover:not(.ponto-tab-ativa) { color: var(--cinza-800); }

/* Navegação entre ciclos de fechamento (29-28) */
.ponto-ciclo-nav {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
  padding: .55rem .75rem;
  margin-bottom: 1rem;
  background: var(--cinza-100);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
}
.ponto-ciclo-seta {
  width: 30px;
  height: 30px;
  flex: none;
  border: 1px solid var(--cinza-300);
  background: #fff;
  border-radius: 7px;
  font-size: 17px;
  line-height: 1;
  color: var(--cinza-600);
  cursor: pointer;
  transition: background .12s, border-color .12s;
}
.ponto-ciclo-seta:hover:not(:disabled) { background: var(--cinza-100); border-color: var(--azul); color: var(--azul); }
.ponto-ciclo-seta:disabled { opacity: .35; cursor: default; }
.ponto-ciclo-info { display: flex; align-items: center; gap: .5rem; font-size: 14px; }
.ponto-ciclo-info strong { font-variant-numeric: tabular-nums; }
.ponto-ciclo-tag {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .15rem .45rem;
  border-radius: 5px;
}
.ponto-ciclo-tag-aberto  { background: var(--azul-claro); color: var(--azul); }
.ponto-ciclo-tag-fechado { background: var(--verde-claro); color: var(--verde); }
.ponto-ciclo-hoje {
  margin-left: auto;
  border: none;
  background: transparent;
  color: var(--azul);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
}
.ponto-ciclo-aviso {
  padding: .6rem .8rem;
  margin-bottom: 1rem;
  background: var(--verde-claro);
  border: 1px solid var(--verde);
  border-radius: 8px;
  font-size: 13px;
  color: var(--cinza-800);
}

/* KPIs do dia */
.ponto-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.ponto-kpi {
  padding: 1.2rem 1.4rem;
  border-radius: var(--raio-lg);
  border: 1.5px solid;
}
.ponto-kpi-verde   { background: var(--verde-claro);    border-color: #a7f3d0; }
.ponto-kpi-vermelho{ background: var(--vermelho-claro); border-color: #fca5a5; }
.ponto-kpi-amarelo { background: var(--amarelo-claro);  border-color: #fcd34d; }
.ponto-kpi-azul    { background: var(--azul-claro);     border-color: #c7d2fe; }
.ponto-kpi-neutro  { background: var(--cinza-100);      border-color: var(--cinza-200); }
.ponto-kpi-num {
  font-size: 2.4rem;
  font-weight: 800;
  line-height: 1;
}
.ponto-kpi-verde    .ponto-kpi-num { color: var(--verde); }
.ponto-kpi-vermelho .ponto-kpi-num { color: var(--vermelho); }
.ponto-kpi-amarelo  .ponto-kpi-num { color: var(--amarelo); }
.ponto-kpi-azul     .ponto-kpi-num { color: var(--azul); }
.ponto-kpi-neutro   .ponto-kpi-num { color: var(--cinza-600); }
.ponto-kpi-rot  { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; margin-top: .35rem; color: var(--cinza-600); }
.ponto-kpi-sub  { font-size: 10.5px; color: var(--cinza-500); margin-top: .2rem; }

/* Barra de presença */
.ponto-barra-wrap { margin-bottom: 2rem; }
.ponto-barra-label {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 600;
  color: var(--cinza-600);
  margin-bottom: .4rem;
}
.ponto-barra-fundo {
  height: 8px;
  background: var(--cinza-200);
  border-radius: 99px;
  overflow: hidden;
}
.ponto-barra-preen {
  height: 100%;
  background: var(--verde);
  border-radius: 99px;
  transition: width .4s ease;
  min-width: 4px;
}

/* Título de seção */
.ponto-secao-titulo {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--cinza-500);
  margin: 0 0 .75rem;
}

/* Cards de equipe */
.ponto-equipe-lista { display: flex; flex-direction: column; gap: .45rem; }
.ponto-func-card {
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: .75rem 1rem;
  background: var(--branco);
  border: 1px solid var(--cinza-100);
  border-radius: var(--raio);
  box-shadow: var(--sombra-sm);
}
.ponto-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 800;
  flex-shrink: 0;
}
.ponto-func-info { flex: 1; min-width: 0; }
.ponto-func-nome { font-size: 13.5px; font-weight: 600; color: var(--cinza-800); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ponto-func-det  { font-size: 11px; color: var(--cinza-500); margin-top: 1px; }
/* Batidas de hoje, em tempo real, no card de cada colaborador do Painel da
   Equipe — a gestão acompanha quem já voltou do almoço sem precisar perguntar. */
.ponto-func-batidas { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.pf-bat {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; color: var(--cinza-600);
  background: var(--cinza-50); border: 1px solid var(--cinza-100);
  border-radius: 6px; padding: 1px 7px;
}
.pf-bat b {
  font-family: ui-monospace, Consolas, monospace; font-size: 11px;
  color: var(--cinza-800); font-weight: 700;
}

/* Badge genérico do módulo */
.ponto-badge {
  display: inline-flex;
  align-items: center;
  padding: .2rem .65rem;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.ponto-badge-vermelho { background: var(--vermelho-claro); color: var(--vermelho); }
.ponto-badge-neutro   { background: var(--cinza-100); color: var(--cinza-600); }

/* ── Cadastros (jornada + feriados) ────────────────────────────────────────── */
.ponto-cad-dia {
  border: 1px solid var(--cinza-200);
  border-radius: var(--raio);
  padding: 10px 14px;
  margin-bottom: 8px;
  background: var(--branco);
}
.ponto-cad-dia-campos {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--cinza-100);
}
.ponto-cad-dia-campos label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 11.5px;
  color: var(--cinza-600);
}
.ponto-cad-config {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 14px 0;
}
.ponto-cad-config label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 12px;
  color: var(--cinza-600);
}
.ponto-cad-config input { width: 90px; }
.ponto-cad-excecao {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--cinza-100);
}
.ponto-cad-excecao:last-of-type { border-bottom: none; }
.ponto-cad-feriado-form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 16px;
}

/* ── Fechamentos ────────────────────────────────────────────────────────────── */
span.mp-banco-neg { color: var(--vermelho); font-weight: 700; }
span.mp-banco-pos { color: var(--verde); font-weight: 700; }

/* Filtros de período */
.ponto-filtros {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: flex-end;
  margin-bottom: 1.5rem;
  padding: 1rem 1.2rem;
  background: var(--cinza-50);
  border-radius: var(--raio);
  border: 1px solid var(--cinza-100);
}
.ponto-filtros label {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--cinza-600);
  text-transform: uppercase;
  letter-spacing: .3px;
}
.ponto-filtros input[type="date"],
.ponto-filtros select {
  padding: .45rem .7rem;
  border: 1.5px solid var(--cinza-200);
  border-radius: 8px;
  font-size: 13px;
  background: var(--branco);
  color: var(--cinza-800);
  font-family: inherit;
}
.ponto-filtros input[type="date"]:focus,
.ponto-filtros select:focus {
  outline: none;
  border-color: var(--azul);
}

/* Tabelas */
.ponto-table-wrap { overflow-x: auto; margin-bottom: .5rem; }
.ponto-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.ponto-table th {
  padding: .5rem .85rem;
  text-align: left;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--cinza-500);
  border-bottom: 2px solid var(--cinza-100);
  white-space: nowrap;
}
.ponto-table td {
  padding: .6rem .85rem;
  border-bottom: 1px solid var(--cinza-100);
  color: var(--cinza-800);
  vertical-align: middle;
}
.ponto-table tbody tr:hover { background: var(--cinza-50); }
.ponto-td-nome { font-weight: 600; }
.ponto-td-mono { font-variant-numeric: tabular-nums; font-family: ui-monospace, 'Courier New', monospace; font-size: 12.5px; }

/* Blocos por funcionário (Registros) */
.ponto-reg-bloco { margin-bottom: 1.75rem; }
.ponto-reg-cabec {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: 14px;
  font-weight: 700;
  color: var(--cinza-800);
  margin-bottom: .6rem;
  padding-bottom: .5rem;
  border-bottom: 2px solid var(--cinza-100);
}
.ponto-reg-qtd {
  font-size: 11px;
  font-weight: 600;
  background: var(--azul-claro);
  color: var(--azul);
  padding: .15rem .5rem;
  border-radius: 20px;
}

/* ── Aba Registros (redesenho) ─────────────────────────────────────────── */
.reg-toolbar {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 16px; margin-bottom: 1.25rem;
  padding: 14px 16px;
  background: #fff; border: 1px solid var(--cinza-200); border-radius: 12px;
}
.reg-tb-campos { display: flex; flex-wrap: wrap; gap: 16px; }
.reg-tb-campo { display: flex; flex-direction: column; gap: 5px; }
.reg-tb-campo > label {
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
  color: var(--cinza-500);
}
.reg-tb-periodo { display: flex; align-items: center; gap: 6px; }
.reg-tb-periodo span { color: var(--cinza-400); }
.reg-toolbar input[type="date"], .reg-toolbar select {
  padding: 7px 10px; border: 1.5px solid var(--cinza-200); border-radius: 8px;
  font-size: 13px; font-family: inherit; background: #fff; color: var(--cinza-800);
}
.reg-toolbar input[type="date"]:focus, .reg-toolbar select:focus { outline: none; border-color: var(--azul); }
.reg-toolbar select { min-width: 190px; }
.reg-tb-acoes { display: flex; gap: 8px; }

.reg-cards { display: flex; flex-direction: column; gap: 14px; }
.reg-card { border: 1px solid var(--cinza-200); border-radius: 12px; overflow: hidden; background: #fff; }
.reg-card-head {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; border-bottom: 1px solid var(--cinza-100); background: var(--cinza-50);
}
.reg-card-head strong { font-size: 14px; color: var(--cinza-800); }
.reg-card-qtd {
  font-size: 11px; font-weight: 700; color: var(--cinza-500);
  background: var(--cinza-100); padding: 2px 8px; border-radius: 999px;
}
.reg-card-add { font-size: 12px; font-weight: 600; }
.reg-card-body { padding: 4px 16px; }

/* Totalizador do card — soma do saldo do período, mesma paleta de cor dos
   chips diários (.reg-dia-saldo-pos/-neg/-neutro), só que maior/com rótulo. */
.reg-card-saldo {
  margin-left: auto; margin-right: 4px;
  font-family: ui-monospace, Consolas, monospace; font-size: 13px; font-weight: 700;
  padding: 5px 12px; border-radius: 999px; white-space: nowrap;
}
.reg-card-saldo-aviso { font-size: 13px; cursor: default; }

.reg-dia {
  display: flex; align-items: center; gap: 16px;
  padding: 11px 0; border-bottom: 1px solid var(--cinza-100);
}
.reg-dia:last-child { border-bottom: none; }
.reg-dia-data { display: flex; flex-direction: column; min-width: 56px; line-height: 1.1; }
.reg-dia-num { font-size: 13px; font-weight: 700; color: var(--cinza-700); }
.reg-dia-dow { font-size: 10.5px; color: var(--cinza-400); text-transform: capitalize; }
.reg-dia-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }

.reg-chip {
  position: relative; display: inline-flex; align-items: center;
  border-radius: 8px; overflow: visible;
}
.reg-chip-hora {
  font-family: ui-monospace, Consolas, monospace; font-size: 13px; font-weight: 600;
  padding: 4px 10px; border: 1px solid transparent; border-radius: 8px;
  background: var(--cinza-100); color: var(--cinza-700); cursor: pointer;
}
.reg-chip-web    .reg-chip-hora { background: var(--cinza-100);  color: var(--cinza-700); }
.reg-chip-import .reg-chip-hora { background: #dbeafe; color: #1e40af; }
.reg-chip-ajuste .reg-chip-hora { background: #fef3c7; color: #92400e; }
.reg-chip-hora:hover { border-color: var(--azul); }
.reg-chip-del {
  position: absolute; top: -6px; right: -6px;
  width: 16px; height: 16px; line-height: 14px; text-align: center;
  border-radius: 999px; border: none;
  background: var(--vermelho); color: #fff; font-size: 12px; cursor: pointer;
  opacity: 0; transform: scale(.7); transition: opacity .12s, transform .12s;
}
.reg-chip:hover .reg-chip-del { opacity: 1; transform: scale(1); }
.reg-chip-add {
  width: 26px; height: 26px; border-radius: 8px;
  border: 1.5px dashed var(--cinza-300); background: transparent;
  color: var(--cinza-400); font-size: 16px; line-height: 1; cursor: pointer;
}
.reg-chip-add:hover { border-color: var(--azul); color: var(--azul); }

/* Saldo do dia (banco de horas), na mesma linha das batidas — pedido do usuário
   para conferir a exatidão do sistema, mesma informação que a folha da Zorya trazia. */
.reg-dia-saldo {
  margin-left: auto; flex-shrink: 0;
  font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; font-weight: 700;
  padding: 4px 10px; border-radius: 8px; white-space: nowrap;
}
.reg-dia-saldo-pos     { background: #dcfce7; color: var(--verde); }
.reg-dia-saldo-neg     { background: #fee2e2; color: var(--vermelho); }
.reg-dia-saldo-neutro  { background: var(--cinza-100); color: var(--cinza-500); font-weight: 600; }
.reg-dia-saldo-atencao { background: #fef3c7; color: var(--amarelo); font-weight: 600; }
.reg-legenda .reg-dia-saldo { padding: 2px 8px; font-size: 11px; }

/* Dia "incompleto": o chip de aviso + o atalho pra confirmar "saiu mais cedo
   mesmo" direto na aba Registros (antes só existia em Inconsistências). O
   grupo é quem recebe o margin-left:auto — o chip interno fica sem, senão
   os dois disputariam o mesmo espaço em branco. */
.reg-dia-saldo-grupo { margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; }
.reg-dia-saldo-grupo .reg-dia-saldo { margin-left: 0; }
.reg-dia-confirmar {
  font-size: 11.5px; font-weight: 600; color: var(--azul);
  background: transparent; border: 1px dashed var(--azul); border-radius: 8px;
  padding: 3px 9px; cursor: pointer; white-space: nowrap;
}
.reg-dia-confirmar:hover { background: var(--azul-claro); }

.reg-legenda {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--cinza-100);
  font-size: 11.5px; color: var(--cinza-500);
}
.reg-legenda .reg-chip-hora { padding: 2px 7px; font-size: 11px; cursor: default; }
.ponto-mat { font-size: 11px; font-weight: 400; color: var(--cinza-500); }
.ponto-orig { font-size: 12px; font-weight: 600; color: var(--cinza-600); }
.ponto-link { font-size: 12px; color: var(--azul); text-decoration: none; }
.ponto-link:hover { text-decoration: underline; }
.ponto-gps { font-size: 11.5px; font-weight: 700; }
.ponto-gps-ok   { color: var(--verde); }
.ponto-gps-fora { color: var(--amarelo); }

/* Inconsistências */
.ponto-inc-resumo {
  padding: .7rem 1rem;
  background: var(--amarelo-claro);
  border: 1px solid #fcd34d;
  border-radius: var(--raio);
  font-size: 13px;
  font-weight: 700;
  color: var(--amarelo);
  margin-bottom: 1rem;
}
.ponto-inc-lista { display: flex; flex-direction: column; gap: .75rem; }
.ponto-inc-card {
  padding: .9rem 1rem;
  background: var(--branco);
  border: 1px solid var(--cinza-100);
  border-radius: var(--raio);
  box-shadow: var(--sombra-sm);
}
.ponto-inc-nome {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--cinza-800);
  margin-bottom: .65rem;
}
.ponto-avatar-mini {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--vermelho-claro);
  color: var(--vermelho);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
  flex-shrink: 0;
}
.ponto-inc-dias { display: flex; flex-wrap: wrap; gap: .4rem; }
.ponto-inc-dia {
  display: inline-flex;
  align-items: center;
  padding: .25rem .6rem;
  background: var(--vermelho-claro);
  border: 1px solid #fca5a5;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--vermelho);
}
.ponto-inc-hora { font-size: 11px; font-weight: 400; color: var(--cinza-500); margin-left: .25rem; }
.ponto-inc-btn { margin-left: .4rem; font-size: 11px; font-weight: 600; }

/* Estados gerais */
.ponto-loading {
  padding: 2.5rem;
  text-align: center;
  color: var(--cinza-500);
  font-size: 13px;
}
/* ── Aba Folha — header com chips de período + filtro ─── */
.ponto-folha-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.ponto-folha-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1;
}
.ponto-chip-periodo {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 13px;
  border-radius: 20px;
  font-size: 13px;
  line-height: 1.4;
}
.ponto-chip-atual {
  background: #eff6ff;
  color: #1d4ed8;
}
.ponto-chip-ant {
  background: var(--cinza-100, #f3f4f6);
  color: var(--cinza-700, #374151);
}
.ponto-select-colab {
  padding: 6px 10px;
  border: 1px solid var(--cinza-300, #d1d5db);
  border-radius: var(--raio);
  font-size: 13px;
  background: #fff;
  min-width: 200px;
}
.ponto-folha-obs {
  font-size: 12px;
  color: var(--cinza-500);
  margin-top: 12px;
  font-style: italic;
  padding: 0 4px;
}
.ponto-ajuste-tip {
  font-size: 11px;
  color: var(--azul-600, #2563eb);
  cursor: help;
  font-weight: 700;
  margin-left: 2px;
}
.ponto-erro {
  padding: 1rem 1.2rem;
  background: var(--vermelho-claro);
  border: 1px solid #fca5a5;
  border-radius: var(--raio);
  color: var(--vermelho);
  font-size: 13px;
  line-height: 1.5;
}
.ponto-erro code { background: rgba(220,38,38,.12); padding: .1rem .35rem; border-radius: 4px; font-size: 12px; }
.ponto-sucesso {
  padding: 1rem 1.2rem;
  background: var(--verde-claro);
  border: 1px solid #a7f3d0;
  border-radius: var(--raio);
  color: var(--verde);
  font-size: 13px;
  font-weight: 700;
}

/* Botão refresh no header */
.btn-ponto-refresh { font-size: 13px; padding: .4rem .9rem; }

@media (max-width: 600px) {
  .ponto-kpi-grid { grid-template-columns: 1fr 1fr; }
  .ponto-tabs { overflow-x: auto; }
  .ponto-tab { padding: .5rem .85rem; font-size: 12.5px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Visão Geral — Controle de Ponto (pvg-*)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Seções */
.pvg-secao {
  background: #fff;
  border: 1px solid var(--cinza-200);
  border-radius: 12px;
  padding: 1.4rem 1.6rem;
  margin-bottom: 1.25rem;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.pvg-secao-header {
  display: flex;
  align-items: flex-start;
  gap: .85rem;
  margin-bottom: 1.2rem;
}
.pvg-secao-icon {
  font-size: 1.5rem;
  line-height: 1;
  margin-top: 2px;
}
.pvg-secao-titulo {
  font-size: 14px;
  font-weight: 700;
  color: var(--cinza-800);
  line-height: 1.2;
}
.pvg-secao-sub {
  font-size: 12px;
  color: var(--cinza-500);
  margin-top: 2px;
}

/* Grid de KPIs */
.pvg-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .85rem;
  margin-bottom: 1rem;
}
.pvg-kpi {
  border-radius: 10px;
  padding: 1rem 1.1rem 1rem;
  border: 1.5px solid transparent;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pvg-kpi-valor {
  font-size: 1.75rem;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.pvg-kpi-rot {
  font-size: 12.5px;
  font-weight: 600;
  margin-top: 4px;
}
.pvg-kpi-sub {
  font-size: 11.5px;
  opacity: .7;
}
/* Variantes de cor */
.pvg-kpi-verde   { background: var(--verde-claro); border-color: #a7f3d0; color: var(--verde); }
.pvg-kpi-vermelho{ background: var(--vermelho-claro); border-color: #fca5a5; color: var(--vermelho); }
.pvg-kpi-amarelo { background: var(--amarelo-claro); border-color: #fde68a; color: #92400e; }
.pvg-kpi-azul    { background: var(--azul-claro); border-color: #bfdbfe; color: var(--azul); }
.pvg-kpi-neutro  { background: var(--cinza-100); border-color: var(--cinza-200); color: var(--cinza-600); }

/* Barra de presença */
.pvg-barra-wrap { margin-top: .25rem; }
.pvg-barra-label {
  display: flex;
  justify-content: space-between;
  font-size: 12.5px;
  color: var(--cinza-600);
  margin-bottom: .4rem;
}
.pvg-barra-pct { font-weight: 700; }
.pvg-pct-ok     { color: var(--verde); }
.pvg-pct-warn   { color: #92400e; }
.pvg-pct-danger { color: var(--vermelho); }
.pvg-barra-fundo {
  height: 8px;
  background: var(--cinza-100);
  border-radius: 99px;
  overflow: hidden;
}
.pvg-barra-preen {
  height: 100%;
  border-radius: 99px;
  transition: width .5s ease;
}
.pvg-barra-verde    { background: var(--verde); }
.pvg-barra-amarela  { background: #f59e0b; }
.pvg-barra-vermelha { background: var(--vermelho); }

/* Tabela da equipe */
.pvg-table-wrap { overflow-x: auto; }
.pvg-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.pvg-table thead th {
  background: var(--cinza-50, #f9fafb);
  color: var(--cinza-500);
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .55rem .85rem;
  border-bottom: 1px solid var(--cinza-200);
  white-space: nowrap;
}
.pvg-th-centro { text-align: center; }
.pvg-table tbody tr {
  border-bottom: 1px solid var(--cinza-100);
  transition: background .15s;
}
.pvg-table tbody tr:last-child { border-bottom: none; }
.pvg-table tbody tr:hover { background: var(--cinza-50, #f9fafb); }
.pvg-table td { padding: .65rem .85rem; vertical-align: middle; }
.pvg-td-centro { text-align: center; }
.pvg-mono { font-variant-numeric: tabular-nums; }
.pvg-zero { color: var(--cinza-400); }
.pvg-status-icon { font-size: 15px; }

/* Célula de colaborador */
.pvg-func-cell { display: flex; align-items: center; gap: .6rem; }
.pvg-avatar-sm {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--azul-claro);
  color: var(--azul);
  font-size: 11px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pvg-func-nome { font-weight: 500; color: var(--cinza-800); }

/* Badge de falta */
.pvg-badge-falta {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 22px; height: 22px;
  padding: 0 5px;
  border-radius: 11px;
  background: var(--vermelho-claro);
  color: var(--vermelho);
  font-size: 12px;
  font-weight: 700;
}

/* Alertas */
.pvg-alertas-secao { border-color: #fde68a; background: #fffdf4; }
.pvg-alertas-lista { display: flex; flex-direction: column; gap: .5rem; }
.pvg-alerta {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  padding: .65rem .9rem;
  border-radius: 8px;
  font-size: 13px;
}
.pvg-alerta-danger { background: var(--vermelho-claro); color: #7f1d1d; border: 1px solid #fca5a5; }
.pvg-alerta-warn   { background: var(--amarelo-claro); color: #78350f; border: 1px solid #fde68a; }
.pvg-alerta-icon   { flex-shrink: 0; font-size: 14px; margin-top: 1px; }

/* Seção OK */
.pvg-ok-secao { border-color: #a7f3d0; background: #f0fdf4; }
.pvg-ok-msg {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--verde);
  text-align: center;
  padding: .5rem 0;
}

/* Responsivo */
@media (max-width: 700px) {
  .pvg-kpi-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
  .pvg-kpi-grid { grid-template-columns: 1fr 1fr; }
  .pvg-kpi-valor { font-size: 1.4rem; }
  .pvg-secao { padding: 1rem 1rem; }
}

/* ── Cards da equipe (Banco de Horas) ─────────────────────────────────────── */
.pvg-colab-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}
.pvg-colab-card {
  background: #fff;
  border: 1px solid var(--cinza-200);
  border-left: 4px solid var(--cinza-300);
  border-radius: var(--raio);
  padding: 14px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: box-shadow .15s;
}
.pvg-colab-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.pvg-colab-card-verde   { border-left-color: var(--verde); }
.pvg-colab-card-vermelho{ border-left-color: var(--vermelho); }
.pvg-colab-card-amarelo { border-left-color: #f59e0b; }

.pvg-colab-top {
  display: flex;
  align-items: center;
  gap: 10px;
}
.pvg-colab-avatar {
  width: 40px; height: 40px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 14px;
  flex-shrink: 0;
}
.pvg-colab-info { flex: 1; min-width: 0; }
.pvg-colab-nome {
  font-weight: 600;
  font-size: 13px;
  color: var(--cinza-800);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pvg-colab-sit {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 20px;
  margin-top: 3px;
  letter-spacing: .02em;
}

.pvg-colab-banco {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px;
  border-top: 1px solid var(--cinza-100);
  padding-top: 10px;
}
.pvg-colab-banco-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.pvg-colab-banco-rot {
  font-size: 10px;
  color: var(--cinza-500);
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}
.pvg-colab-banco-val {
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pvg-colab-carga { color: var(--cinza-700) !important; }
.pvg-colab-ajuste {
  color: var(--azul);
  font-size: 11px;
  font-weight: 700;
  cursor: help;
  margin-left: 1px;
}

.pvg-colab-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  border-top: 1px solid var(--cinza-100);
  padding-top: 8px;
}
.pvg-colab-tag {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
}
.pvg-colab-tag-falta { background: var(--vermelho-claro); color: #7f1d1d; }
.pvg-colab-tag-inc   { background: var(--amarelo-claro);  color: #78350f; }

/* ── Ocorrências ──────────────────────────────────────────────────────────── */
.pvg-ocorr-kpis {
  display: flex;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.pvg-ocorr-kpi {
  flex: 1;
  min-width: 100px;
  border-radius: var(--raio);
  padding: 12px 16px;
  text-align: center;
  border: 1px solid transparent;
}
.pvg-ocorr-kpi-val {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
}
.pvg-ocorr-kpi-rot {
  font-size: 12px;
  font-weight: 600;
  margin-top: 4px;
  letter-spacing: .02em;
}
.pvg-ocorr-aberto { background: #fff7ed; border-color: #fed7aa; color: #9a3412; }
.pvg-ocorr-aceita { background: #f0fdf4; border-color: #a7f3d0; color: var(--verde); }
.pvg-ocorr-rejeit { background: var(--vermelho-claro); border-color: #fca5a5; color: #7f1d1d; }

.pvg-ocorr-lista {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-top: 1px solid var(--cinza-100);
  padding-top: 12px;
}
.pvg-ocorr-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
}
.pvg-ocorr-avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--cinza-200);
  color: var(--cinza-700);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
  flex-shrink: 0;
}
.pvg-ocorr-nome {
  flex: 1;
  font-size: 13px;
  font-weight: 500;
  color: var(--cinza-800);
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pvg-ocorr-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.pvg-ocorr-chip {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 20px;
  white-space: nowrap;
}
.pvg-ocorr-chip-aberto { background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; }
.pvg-ocorr-chip-aceita { background: #f0fdf4; color: #166534; border: 1px solid #a7f3d0; }
.pvg-ocorr-chip-rejeit { background: var(--vermelho-claro); color: #7f1d1d; border: 1px solid #fca5a5; }
.pvg-ocorr-vazio {
  font-size: 13px;
  color: var(--cinza-400);
  text-align: center;
  padding: 16px 0;
  border-top: 1px solid var(--cinza-100);
  margin-top: 4px;
}

@media (max-width: 600px) {
  .pvg-colab-grid { grid-template-columns: 1fr; }
  .pvg-ocorr-kpis { gap: 8px; }
  .pvg-ocorr-kpi { min-width: 80px; }
}

/* ── Módulo Frequência / Pontualidade ─────────────────────────────────────── */
.freq-periodo-label {
  font-size: .8rem;
  color: var(--cinza-500);
  margin-bottom: 1rem;
}

/* KPIs da equipe */
.freq-kpis {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}
.freq-kpi {
  flex: 1 1 120px;
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
  padding: 14px 16px;
  text-align: center;
  border-top: 3px solid var(--cinza-300);
}
.freq-kpi-bom    { border-top-color: #22c55e; }
.freq-kpi-atencao{ border-top-color: #f59e0b; }
.freq-kpi-critico{ border-top-color: #ef4444; }
.freq-kpi-val {
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--cinza-800);
  line-height: 1;
  margin-bottom: 4px;
}
.freq-kpi-lab {
  font-size: .72rem;
  color: var(--cinza-500);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* Título do ranking */
.freq-ranking-titulo {
  font-size: .85rem;
  font-weight: 600;
  color: var(--cinza-700);
  margin-bottom: .75rem;
  display: flex;
  align-items: center;
  gap: 8px;
}
.freq-hint {
  font-size: .72rem;
  font-weight: 400;
  color: var(--cinza-400);
}

/* Cards dos funcionários */
.freq-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
  margin-bottom: 1.5rem;
}
.freq-card {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.freq-card-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.freq-rank {
  font-size: .75rem;
  font-weight: 700;
  color: var(--cinza-400);
  min-width: 24px;
  padding-top: 2px;
}
.freq-nome-bloco { flex: 1; }
.freq-nome {
  font-size: .9rem;
  font-weight: 600;
  color: var(--cinza-800);
  line-height: 1.2;
}
.freq-cargo {
  font-size: .75rem;
  color: var(--cinza-500);
}

/* Badge de status */
.freq-status {
  font-size: .68rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 20px;
  white-space: nowrap;
  letter-spacing: .04em;
}
.freq-status-bom     { background: #dcfce7; color: #15803d; }
.freq-status-atencao { background: #fef3c7; color: #92400e; }
.freq-status-critico { background: #fee2e2; color: #991b1b; }

/* Métricas numéricas */
.freq-metricas {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.freq-met {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--cinza-50);
  border-radius: 7px;
  padding: 6px 10px;
  min-width: 54px;
  flex: 1;
}
.freq-met-val {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--cinza-700);
  line-height: 1;
}
.freq-met-pct {
  font-size: .68rem;
  color: var(--cinza-400);
}
.freq-met-lab {
  font-size: .65rem;
  color: var(--cinza-500);
  text-align: center;
  margin-top: 2px;
}

/* Cores de valores */
.freq-val-atencao { color: #d97706 !important; }
.freq-val-critico { color: #dc2626 !important; }

/* Barra de % atrasos */
.freq-barra-wrap {
  height: 5px;
  background: var(--cinza-100);
  border-radius: 3px;
  overflow: hidden;
}
.freq-barra-fill {
  height: 100%;
  border-radius: 3px;
  transition: width .3s;
}
.freq-barra-bom     { background: #22c55e; }
.freq-barra-atencao { background: #f59e0b; }
.freq-barra-critico { background: #ef4444; }

/* Botão "Ver ficha" */
.freq-btn-ficha {
  font-size: .78rem;
  color: var(--primario);
  align-self: flex-start;
}

/* Modal — Ficha individual */
.freq-ficha-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 1rem;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--cinza-100);
}
.freq-ficha-nome {
  font-size: 1rem;
  font-weight: 700;
  color: var(--cinza-800);
}
.freq-ficha-cargo {
  font-size: .78rem;
  color: var(--cinza-500);
  margin-top: 2px;
}
.freq-ficha-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 8px;
  margin-bottom: 1rem;
}
.freq-fkpi {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--cinza-50);
  border: 1px solid var(--cinza-100);
  border-radius: 10px;
  padding: 10px 8px;
}
.freq-fkpi span {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--cinza-800);
  white-space: nowrap;
}
.freq-fkpi span small { font-size: .72rem; font-weight: 600; color: var(--cinza-400); }
.freq-fkpi label {
  font-size: .68rem;
  color: var(--cinza-500);
  text-align: center;
  margin-top: 3px;
  line-height: 1.25;
}

/* Tabela da ficha */
.freq-ficha-tabela { width: 100%; }
.freq-ficha-tabela th { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: var(--cinza-400); text-align: left; padding: 6px 10px; }
.freq-ficha-tabela td { padding: 8px 10px; font-size: .82rem; vertical-align: middle; }
.freq-td-data  { font-weight: 700; color: var(--cinza-700); white-space: nowrap; }
.freq-dow { display: block; font-size: .66rem; font-weight: 500; color: var(--cinza-400); text-transform: capitalize; }
.freq-td-mono  { font-family: monospace; }
.freq-td-bat   { text-align: center; color: var(--cinza-400); font-size: .75rem; }
.freq-td-batlist { color: var(--cinza-500); font-size: .74rem; white-space: nowrap; }
.freq-td-neutro { color: var(--cinza-400); font-style: italic; }

/* Batidas como chips; a batida vermelha já sinaliza o problema */
.freq-ficha-tabela td.freq-td-bats { width: 100%; line-height: 1.9; }
.freq-ficha-tabela td.freq-td-data,
.freq-ficha-tabela td.freq-td-saldo { white-space: nowrap; }
.freq-ficha-tabela th:nth-child(3), .freq-ficha-tabela td.freq-td-saldo { text-align: right; }
.freq-chip {
  display: inline-block; font-family: ui-monospace, Consolas, monospace;
  font-size: .78rem; font-weight: 600;
  padding: 1px 7px; margin: 1px 1px; border-radius: 5px;
  background: var(--cinza-100); color: var(--cinza-700);
}
.freq-chip-red { background: #fee2e2; color: #b91c1c; }
/* Origem da batida — não é infração, é rastreabilidade: quem lançou aquele
   horário e por qual caminho (gestor direto, ou colaborador pediu e foi
   aprovado). Pode combinar com .freq-chip-red (batida ajustada que também
   ficou fora do padrão). */
.freq-chip-manual     { background: var(--azul-claro); color: var(--azul); box-shadow: inset 0 0 0 1px var(--azul); }
.freq-chip-ocorrencia { background: #f0fdfa; color: #0d9488; box-shadow: inset 0 0 0 1px #0d9488; }
.freq-chip-almoco {
  display: inline-block; font-size: .7rem; font-weight: 600;
  padding: 1px 6px; margin: 1px 2px 1px 6px; border-radius: 999px;
  background: #f1f5f9; color: var(--cinza-500);
}
.freq-chip-almoco.freq-chip-red { background: #fee2e2; color: #b91c1c; }

.freq-td-saldo { font-family: ui-monospace, Consolas, monospace; font-weight: 700; white-space: nowrap; color: var(--cinza-500); }
.freq-saldo-neg { color: #dc2626; }
.freq-saldo-pos { color: #16a34a; }

/* Pílula de situação */
.freq-pill {
  display: inline-flex; align-items: center; white-space: nowrap;
  font-size: .72rem; font-weight: 700;
  padding: 3px 9px; border-radius: 999px;
  background: var(--cinza-100); color: var(--cinza-600);
}
.freq-pill-ok      { background: #f0fdf4; color: #16a34a; }
.freq-pill-alerta  { background: #fffbeb; color: #b45309; }
.freq-pill-inc     { background: #eff6ff; color: #1d4ed8; }
.freq-pill-confirm { background: #f0fdfa; color: #0d9488; }
.freq-pill-falta   { background: #fef2f2; color: #b91c1c; }
.freq-pill-neutro  { background: var(--cinza-100); color: var(--cinza-500); }

/* Linhas — tom suave por estado */
.freq-linha-alerta  { background: #fffbeb; }
.freq-linha-falta   { background: #fef2f2; }
.freq-linha-incompleto { background: #f5f9ff; }
.freq-linha-abonado { background: #f6fdf9; }

/* Células de situação (legado — ainda usadas em outros lugares) */
.freq-cell-ok     { color: #16a34a; font-size: .8rem; }
.freq-cell-alerta { color: #dc2626; font-size: .8rem; font-weight: 700; }
.freq-cell-nd     { color: var(--cinza-300); font-size: .8rem; }
.freq-cell-incompleto { color: #2563eb; font-size: .8rem; font-weight: 600; }
.freq-cell-abonado    { color: #16a34a; font-size: .8rem; font-weight: 600; }
.freq-val-incompleto  { color: #2563eb !important; }
.freq-aviso-incompleto {
  margin: 10px 0 4px; padding: 8px 12px;
  background: #eff6ff; border-left: 3px solid #2563eb; border-radius: 6px;
  font-size: .78rem; color: var(--cinza-700);
}

/* Legenda da ficha */
.freq-ficha-legenda {
  margin-top: 12px;
  font-size: .72rem;
  color: var(--cinza-400);
  border-top: 1px solid var(--cinza-100);
  padding-top: 8px;
}

@media (max-width: 600px) {
  .freq-cards { grid-template-columns: 1fr; }
  .freq-kpis  { gap: 8px; }
  .freq-ficha-kpis { gap: 6px; }
}

/* Semáforo de pontualidade na Visão Geral */
.pvg-freq-semaforo {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 8px;
}
.pvg-freq-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  background: var(--cinza-50);
  border: 1px solid var(--cinza-200);
  border-radius: 10px;
  padding: 10px 12px;
  min-width: 80px;
  flex: 1;
  cursor: default;
  border-top: 3px solid var(--cinza-300);
  transition: box-shadow .15s;
}
.pvg-freq-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.pvg-freq-bom     { border-top-color: #22c55e; }
.pvg-freq-atencao { border-top-color: #f59e0b; background: #fffbeb; }
.pvg-freq-critico { border-top-color: #ef4444; background: #fff5f5; }
.pvg-freq-iniciais {
  font-size: .8rem;
  font-weight: 700;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--primario);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pvg-freq-nome {
  font-size: .72rem;
  font-weight: 600;
  color: var(--cinza-700);
  white-space: nowrap;
}
.pvg-freq-pct {
  font-size: .85rem;
  font-weight: 700;
  color: var(--cinza-600);
}
.pvg-freq-alerta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
  font-size: .78rem;
}
.pvg-freq-badge {
  padding: 3px 10px;
  border-radius: 20px;
  font-weight: 600;
  font-size: .72rem;
}
.pvg-freq-badge-critico { background: #fee2e2; color: #991b1b; }
.pvg-freq-badge-atencao { background: #fef3c7; color: #92400e; }
.pvg-freq-badge-ok      { background: #dcfce7; color: #15803d; }
.pvg-freq-link {
  color: var(--primario);
  cursor: pointer;
  font-size: .75rem;
  text-decoration: underline;
}
.pvg-freq-link:hover { opacity: .8; }

/* ── Painel unificado da equipe (tabela: frequência + banco de horas) ──────── */
.pvg-et-wrap {
  overflow-x: auto;
  border-radius: 8px;
  border: 1px solid var(--cinza-200);
  margin-top: 16px;
}
.pvg-et-header,
.pvg-et-row {
  display: grid;
  grid-template-columns: 2fr 90px 90px 1fr 72px 80px;
  align-items: start;
  gap: 12px;
  padding: 10px 14px;
}
.pvg-et-header {
  background: var(--cinza-50);
  font-size: 11px;
  font-weight: 600;
  color: var(--cinza-500);
  text-transform: uppercase;
  letter-spacing: .04em;
  border-bottom: 1px solid var(--cinza-200);
}
.pvg-et-row {
  border-bottom: 1px solid var(--cinza-100);
  border-left: 3px solid transparent;
  background: #fff;
  transition: background .15s;
}
.pvg-et-row:last-child { border-bottom: none; }
.pvg-et-row:hover { background: var(--cinza-50); }
.pvg-et-row-critico { border-left-color: #ef4444; }
.pvg-et-row-atencao { border-left-color: #f59e0b; }
.pvg-et-row-bom     { border-left-color: #22c55e; }

.pvg-et-col-colab {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.pvg-et-avatar {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--cinza-100);
  color: var(--cinza-600);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
  flex-shrink: 0;
}
.pvg-et-colab-info { min-width: 0; }
.pvg-et-nome {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pvg-et-cargo {
  font-size: 11px;
  color: var(--cinza-400);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pvg-et-col-status { padding-top: 2px; }
.pvg-et-col-presenca { font-size: 12px; padding-top: 2px; }
.pvg-et-dias { font-weight: 600; color: var(--cinza-700); }
.pvg-et-faltas { color: var(--cinza-400); font-size: 11px; margin-top: 2px; }
.pvg-et-faltas-alerta { color: var(--vermelho) !important; font-weight: 600; }
.pvg-et-atestado { font-size: 11px; color: #15803d; margin-top: 2px; }

.pvg-et-col-atrasos { min-width: 0; padding-top: 2px; }
.pvg-et-atraso-ok { font-size: 12px; color: #15803d; }
.pvg-et-atraso-resumo {
  font-size: 12px;
  color: var(--cinza-700);
  font-weight: 600;
  margin-bottom: 5px;
}
.pvg-et-atraso-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.pvg-et-chip-atraso {
  font-size: 11px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fde68a;
  border-radius: 4px;
  padding: 2px 7px;
  white-space: nowrap;
  cursor: default;
}
.pvg-et-chip-atraso strong { font-weight: 700; }

.pvg-et-chip-saida {
  font-size: 11px;
  background: #ffe4e6;
  color: #9f1239;
  border: 1px solid #fecdd3;
  border-radius: 4px;
  padding: 2px 7px;
  white-space: nowrap;
  cursor: default;
}
.pvg-et-chip-saida strong { font-weight: 700; }
.pvg-et-saida-resumo {
  font-size: 12px;
  color: #be123c;
  font-weight: 600;
  margin-top: 6px;
  margin-bottom: 3px;
}

.pvg-et-col-banco {
  font-size: 13px;
  font-weight: 600;
  text-align: right;
  padding-top: 4px;
}
.pvg-et-banco-hoje { font-size: 14px; }

@media (max-width: 760px) {
  .pvg-et-header { display: none; }
  .pvg-et-row {
    grid-template-columns: 1fr 1fr;
    padding: 12px 14px;
    gap: 8px;
  }
  .pvg-et-col-colab { grid-column: 1 / -1; }
  .pvg-et-col-atrasos { grid-column: 1 / -1; }
  .pvg-et-col-banco { text-align: left; }
}

/* ── Módulo Parcelamentos Tributários ─────────────────────────────────────────
   A tela reproduz a planilha da equipe: uma tabela por cliente, uma linha por
   parcelamento, uma coluna por mês. As cores das células seguem a convenção que
   eles já usam no Excel (verde / laranja / vermelho).                          */

/* Auxiliares reutilizados nos modais do módulo */
.modal-sub {
  margin: -6px 0 18px;
  font-size: 13px;
  color: var(--cinza-600);
  line-height: 1.45;
}
.campo-dica {
  display: block;
  margin-top: 5px;
  font-size: 11.5px;
  color: var(--cinza-500);
  line-height: 1.4;
}

/* Pontos coloridos de status — substituem emojis, ficam mais sóbrios */
.parc-dot {
  width: 9px; height: 9px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}
.parc-dot-ok       { background: var(--verde); }
.parc-dot-atencao  { background: #E0A500; }
.parc-dot-critico  { background: #E2680E; }
.parc-dot-iminente { background: var(--vermelho); }

/* ── Indicadores ──────────────────────────────────────────────────────────── */

.parc-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.parc-kpi {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: var(--raio);
  padding: 15px 16px;
  box-shadow: var(--sombra-sm);
  transition: border-color .15s;
}
.parc-kpi-topo {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 3px;
}
.parc-kpi-num {
  font-size: 25px;
  font-weight: 700;
  line-height: 1.05;
  color: var(--cinza-800);
  letter-spacing: -.5px;
}
.parc-kpi-lab {
  font-size: 12px;
  color: var(--cinza-600);
  line-height: 1.3;
}
.parc-kpi-atencao  { border-color: #F0CE7A; background: var(--amarelo-claro); }
.parc-kpi-critico  { border-color: #F3B183; background: #FFF3E9; }
.parc-kpi-iminente { border-color: #F0A3A3; background: var(--vermelho-claro); }
.parc-kpi-iminente .parc-kpi-num { color: var(--vermelho); }
.parc-kpi-critico  .parc-kpi-num { color: #C2540A; }
.parc-kpi-atencao  .parc-kpi-num { color: var(--amarelo); }

/* ── Banner de inconsistências ────────────────────────────────────────────── */

.parc-banner-alerta {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--amarelo-claro);
  border: 1px solid #F0CE7A;
  border-radius: var(--raio);
  padding: 13px 18px;
  margin-bottom: 18px;
}
.parc-banner-icone { font-size: 19px; line-height: 1; flex-shrink: 0; }
.parc-banner-txt { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.parc-banner-txt strong { font-size: 13.5px; color: #7A4A08; }
.parc-banner-txt span   { font-size: 12.5px; color: var(--amarelo); }

/* ── Barra de filtros ─────────────────────────────────────────────────────── */

.parc-toolbar {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: var(--raio);
  padding: 14px 16px;
  margin-bottom: 18px;
  box-shadow: var(--sombra-sm);
}
.parc-filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: flex-end;
}
.parc-f { display: flex; flex-direction: column; gap: 5px; }
.parc-f > span {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--cinza-500);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.parc-f select,
.parc-f input {
  font-size: 13px;
  padding: 7px 10px;
  border: 1px solid var(--cinza-300);
  border-radius: 7px;
  background: var(--branco);
  color: var(--cinza-800);
  font-family: inherit;
  min-width: 132px;
}
.parc-f select:focus,
.parc-f input:focus { outline: none; border-color: var(--azul); }
.parc-f-busca { flex: 1; min-width: 200px; }
.parc-f-busca input { width: 100%; min-width: 0; }

.parc-check {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--cinza-600);
  cursor: pointer;
  padding-bottom: 8px;
  white-space: nowrap;
}
.parc-limpar {
  background: none;
  border: none;
  color: var(--azul);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  padding: 0 0 9px;
  font-family: inherit;
}
.parc-limpar:hover { text-decoration: underline; }

.parc-legenda {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid var(--cinza-100);
}
.parc-leg-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--cinza-600);
}
.parc-leg {
  width: 13px; height: 13px;
  border-radius: 3px;
  display: inline-block;
}
.parc-leg-ok       { background: var(--verde); }
.parc-leg-atencao  { background: #E0A500; }
.parc-leg-problema { background: #B91C1C; }
.parc-leg-recalculo {
  background: #1D4ED8;
  background-image: repeating-linear-gradient(45deg, transparent, transparent 2px, rgba(255,255,255,.3) 2px, rgba(255,255,255,.3) 4px);
}
.parc-leg-vazio    { background: var(--branco); border: 1px dashed var(--cinza-300); }
.parc-leg-atual    { background: var(--azul-claro); border: 1.5px solid var(--azul); }

/* ── Bloco de cliente ─────────────────────────────────────────────────────── */

.parc-bloco {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-left: 3px solid var(--cinza-200);
  border-radius: var(--raio);
  padding: 16px 18px;
  margin-bottom: 14px;
  box-shadow: var(--sombra-sm);
}
.parc-bloco.parc-r-atencao  { border-left-color: #E0A500; }
.parc-bloco.parc-r-critico  { border-left-color: #E2680E; }
.parc-bloco.parc-r-iminente { border-left-color: var(--vermelho); }

.parc-bloco-header {
  display: flex;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.parc-bloco-cliente {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--cinza-800);
}
.parc-bloco-qtd {
  margin-left: auto;
  font-size: 11.5px;
  color: var(--cinza-500);
}
.parc-selo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 20px;
}
.parc-selo.parc-r-normal   { background: var(--verde-claro);    color: var(--verde); }
.parc-selo.parc-r-atencao  { background: var(--amarelo-claro);  color: var(--amarelo); }
.parc-selo.parc-r-critico  { background: #FFF3E9;               color: #C2540A; }
.parc-selo.parc-r-iminente { background: var(--vermelho-claro); color: var(--vermelho); }

.parc-sem-ativos {
  font-size: 13px;
  color: var(--cinza-500);
  font-style: italic;
  margin: 4px 0 0;
}

/* ── Tabela / grade ───────────────────────────────────────────────────────── */

.parc-tabela-wrap {
  overflow-x: auto;
  margin: 0 -18px;
  padding: 0 18px;
  position: relative;
  scroll-behavior: smooth;
  /* Barra mais visível: era fina demais para se notar que dava para arrastar */
  scrollbar-width: auto;
}
.parc-tabela-wrap::-webkit-scrollbar { height: 11px; }
.parc-tabela-wrap::-webkit-scrollbar-track {
  background: var(--cinza-100); border-radius: 100px; margin: 0 18px;
}
.parc-tabela-wrap::-webkit-scrollbar-thumb {
  background: var(--cinza-300); border-radius: 100px; border: 2px solid var(--cinza-100);
}
.parc-tabela-wrap::-webkit-scrollbar-thumb:hover { background: var(--cinza-500); }

/* Sombra na borda avisa que há mês escondido para aquele lado */
.parc-bloco { position: relative; }
.parc-tabela-wrap.parc-tem-mais::after,
.parc-tabela-wrap.parc-tem-antes::before {
  content: '';
  position: sticky; top: 0;
  display: block; width: 22px; height: 0;
  pointer-events: none;
}
.parc-tabela {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
  min-width: 1060px;
}
.parc-tabela th {
  text-align: left;
  padding: 0 8px 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--cinza-500);
  border-bottom: 1px solid var(--cinza-200);
  white-space: nowrap;
}
.parc-tabela td {
  padding: 9px 8px;
  border-bottom: 1px solid var(--cinza-100);
  vertical-align: middle;
}
.parc-tabela tbody tr:last-child td { border-bottom: none; }
.parc-tabela tbody tr:hover td { background: var(--cinza-50); }

.parc-th-mes  { text-align: center !important; width: 44px; }
.parc-th-c,
.parc-th-prog { text-align: center !important; }
.parc-th-acoes   { width: 84px; min-width: 84px; max-width: 84px; }

/* Colunas congeladas: identificação do parcelamento fica sempre visível enquanto
   os meses rolam na horizontal. As larguras precisam ser fixas (não min-width)
   porque cada coluna sticky se posiciona pela soma das anteriores. */
.parc-tabela th.parc-th-imposto,
.parc-tabela td.parc-td-imposto { width: 200px; min-width: 200px; max-width: 200px; left: 0; }
.parc-tabela th.parc-th-acesso,
.parc-tabela td.parc-td-acesso  { width: 104px; min-width: 104px; max-width: 104px; left: 200px; }
.parc-tabela th.parc-th-insc,
.parc-tabela td.parc-td-insc    { width: 116px; min-width: 116px; max-width: 116px; left: 304px; }
.parc-tabela th.parc-th-c,
.parc-tabela td.parc-td-c       { width: 52px;  min-width: 52px;  max-width: 52px;  left: 420px; }
.parc-tabela th.parc-th-sit,
.parc-tabela td.parc-td-sit     { width: 92px;  min-width: 92px;  max-width: 92px;  left: 472px; }

.parc-tabela th.parc-th-imposto,
.parc-tabela th.parc-th-acesso,
.parc-tabela th.parc-th-insc,
.parc-tabela th.parc-th-c,
.parc-tabela th.parc-th-sit,
.parc-tabela td.parc-td-imposto,
.parc-tabela td.parc-td-acesso,
.parc-tabela td.parc-td-insc,
.parc-tabela td.parc-td-c,
.parc-tabela td.parc-td-sit {
  position: sticky;
  z-index: 3;
  background: var(--branco);
}
/* A última coluna congelada marca onde termina a área fixa */
.parc-tabela th.parc-th-sit,
.parc-tabela td.parc-td-sit { box-shadow: 1px 0 0 var(--cinza-200); }

/* Coluna de ações congelada à DIREITA.
   Sem isso os botões (ver, preencher em lote, editar) ficam no fim da tabela,
   atrás da rolagem horizontal — quem não arrastasse a barra até o fim não
   descobriria que eles existem. Ações precisam estar sempre à mão. */
.parc-tabela th.parc-th-acoes,
.parc-tabela td.parc-td-acoes {
  position: sticky;
  right: 0;
  z-index: 3;
  background: var(--branco);
}
/* Andamento colado nas ações, também congelado. Antes ele ficava entre a grade
   e os botões fixos: o conteúdo sumia na rolagem e sobrava um vão branco.
   Congelado, o "11/60" fica sempre à vista — é a informação que responde
   "quanto falta" sem precisar abrir nada. */
.parc-tabela th.parc-th-prog,
.parc-tabela td.parc-td-prog {
  position: sticky;
  right: 84px;
  z-index: 3;
  background: var(--branco);
  box-shadow: -1px 0 0 var(--cinza-200);
}
.parc-tabela tbody tr:hover td.parc-td-acoes,
.parc-tabela tbody tr:hover td.parc-td-prog { background: var(--cinza-50); }

/* O hover da linha precisa repintar as células congeladas, senão elas
   ficam brancas enquanto o resto da linha muda de cor. */
.parc-tabela tbody tr:hover td.parc-td-imposto,
.parc-tabela tbody tr:hover td.parc-td-acesso,
.parc-tabela tbody tr:hover td.parc-td-insc,
.parc-tabela tbody tr:hover td.parc-td-c,
.parc-tabela tbody tr:hover td.parc-td-sit { background: var(--cinza-50); }

/* Nome comprido não pode empurrar a coluna: quebra em até 2 linhas */
.parc-imposto-nome {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
}
.parc-td-acesso, .parc-td-insc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.parc-td-imposto { line-height: 1.35; }
.parc-imposto-nome {
  display: block;
  font-weight: 600;
  color: var(--cinza-800);
}
.parc-td-meta {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 3px;
}
.parc-tag {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
  background: var(--azul-claro);
  color: var(--azul);
  padding: 2px 7px;
  border-radius: 20px;
}
.parc-resp { font-size: 11px; color: var(--cinza-500); }

.parc-td-sec  { font-size: 11.5px; color: var(--cinza-600); }
.parc-td-mono { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 11px; }
.parc-td-c    { text-align: center; font-weight: 600; color: var(--cinza-600); }
.parc-vazio-td { color: var(--cinza-300); }

.parc-td-sit { white-space: nowrap; }
.parc-sit {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: .3px;
}
.parc-sit-ativo     { background: var(--verde-claro);   color: var(--verde); }
.parc-sit-liquidado { background: var(--azul-claro);    color: var(--azul); }
.parc-sit-suspenso  { background: var(--amarelo-claro); color: var(--amarelo); }
.parc-sit-rescindido,
.parc-sit-excluido,
.parc-sit-cancelado,
.parc-sit-desistencia,
.parc-sit-indeferimento { background: var(--bordo-claro); color: var(--bordo); }
.parc-td-sit .parc-dot { margin-left: 5px; vertical-align: middle; }

/* Células dos meses — o coração da tela.
   Cada célula é uma competência independente, então precisa ler como um bloco
   separado. Antes as cores encostavam umas nas outras e três meses verdes viravam
   uma faixa só, sem dizer onde um mês termina e o outro começa. A separação vem de
   três coisas somadas: respiro entre células (padding no td), borda clara em volta
   e uma linha divisória a cada trimestre. */
.parc-td-mes {
  padding: 3px 2px !important;
  vertical-align: middle;
}
/* Divisor de trimestre: MAR|ABR, JUN|JUL, SET|OUT — ajuda a achar o mês no meio da
   grade sem contar coluna por coluna */
.parc-td-mes.parc-td-trim { border-right: 2px solid var(--cinza-200); }

.parc-cel {
  display: block;
  text-align: center;
  font-weight: 700;
  font-size: 11.5px;
  cursor: pointer;
  min-width: 42px;
  padding: 7px 2px;
  border-radius: 6px;
  border: 1.5px solid rgba(255,255,255,.85);
  box-shadow: 0 0 0 1px rgba(20,24,48,.10);
  user-select: none;
  transition: transform .1s, box-shadow .1s;
}
.parc-cel:hover {
  transform: scale(1.14);
  box-shadow: var(--sombra-md), 0 0 0 1px rgba(20,24,48,.2);
  position: relative;
  z-index: 2;
}
.parc-cel-ok        { background: #15803D; color: #fff; }
.parc-cel-atencao   { background: #E0A500; color: #3D2A00; }
.parc-cel-problema  { background: #B91C1C; color: #fff; }
/* Em recálculo: em aberto, mas já sendo tratado. Azul porque a ação é acompanhar o
   órgão, não cobrar o cliente — e porque precisa ser distinguível do vermelho num
   relance, inclusive por quem tem dificuldade com verde/vermelho. */
.parc-cel-recalculo {
  background: #1D4ED8;
  color: #fff;
  background-image: repeating-linear-gradient(
    45deg, transparent, transparent 4px,
    rgba(255,255,255,.16) 4px, rgba(255,255,255,.16) 8px);
}
.parc-cel-vazio {
  background: transparent;
  border: 1px dashed var(--cinza-300);
  box-shadow: none;
  color: transparent;
}
.parc-cel-vazio:hover { background: var(--azul-claro); border-style: solid; border-color: var(--azul); }

/* Mês corrente ainda não lançado — é o que precisa de ação hoje */
.parc-cel-atual {
  border: 1.5px solid var(--azul) !important;
  background: var(--azul-claro) !important;
  position: relative;
}
.parc-cel-atual::after {
  content: '';
  position: absolute;
  top: 3px; right: 3px;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--azul);
}
.parc-cel-ro { text-align: center; font-size: 11px; color: var(--cinza-500); }

/* Andamento */
.parc-td-prog { width: 88px; min-width: 88px; max-width: 88px; padding-left: 10px !important; padding-right: 10px !important; }
.parc-prog { display: flex; flex-direction: column; gap: 4px; align-items: center; }
.parc-prog-txt { font-size: 11px; color: var(--cinza-600); }
.parc-prog-txt strong { color: var(--cinza-800); font-size: 12.5px; }
.parc-prog-bar {
  width: 100%;
  height: 5px;
  background: var(--cinza-200);
  border-radius: 100px;
  overflow: hidden;
}
.parc-prog-fill { height: 100%; background: var(--verde); border-radius: 100px; }

/* Ações da linha — botões juntos, sem espaço morto entre eles */
.parc-td-acoes {
  white-space: nowrap;
  padding-left: 6px !important;
  padding-right: 8px !important;
}
.parc-td-acoes { text-align: center; }
.parc-ico-btn {
  background: none;
  border: 1px solid transparent;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  color: var(--cinza-500);
  padding: 4px 5px;
  margin: 0;
  line-height: 1;
  font-family: inherit;
}
.parc-ico-btn:hover { background: var(--cinza-100); border-color: var(--cinza-200); color: var(--azul); }

/* Encerrados */
.parc-toggle-hist {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  color: var(--cinza-500);
  padding: 10px 0 2px;
  margin-top: 8px;
  border-top: 1px solid var(--cinza-100);
  width: 100%;
  text-align: left;
  font-family: inherit;
}
.parc-toggle-hist:hover { color: var(--cinza-800); }
.parc-th-seta { display: inline-block; width: 12px; }
.parc-hist-wrap { margin-top: 6px; }
.parc-tabela-hist { opacity: .68; }
.parc-linha-hist td { font-size: 11.5px; }

/* Rodapé */
.parc-rodape {
  font-size: 12px;
  color: var(--cinza-500);
  text-align: center;
  padding: 8px 0 20px;
}
.parc-rodape-alerta { color: var(--vermelho); }

/* ── Estado vazio ─────────────────────────────────────────────────────────── */

.parc-vazio {
  background: var(--branco);
  border: 1px dashed var(--cinza-300);
  border-radius: var(--raio-lg);
  padding: 52px 28px;
  text-align: center;
}
.parc-vazio-icone { font-size: 40px; margin-bottom: 12px; opacity: .75; }
.parc-vazio h3 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: var(--cinza-800);
}
.parc-vazio p {
  margin: 0 0 20px;
  font-size: 13.5px;
  color: var(--cinza-600);
  line-height: 1.6;
}
.parc-vazio p:last-child { margin-bottom: 0; }

/* ── Modais do módulo ─────────────────────────────────────────────────────── */

.parc-radios { display: flex; gap: 9px; flex-wrap: wrap; }
.parc-radio {
  flex: 1;
  min-width: 108px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 13px;
  padding: 9px 12px;
  border: 1.5px solid var(--cinza-300);
  border-radius: 8px;
  cursor: pointer;
  transition: all .12s;
  background: var(--branco);
}
.parc-radio input { margin: 0; }
.parc-radio:hover { border-color: var(--cinza-500); }
.parc-radio-ok:has(input:checked) {
  border-color: var(--verde); background: var(--verde-claro);
  color: var(--verde); font-weight: 600;
}
.parc-radio-atencao:has(input:checked) {
  border-color: #E0A500; background: var(--amarelo-claro);
  color: var(--amarelo); font-weight: 600;
}
.parc-radio-problema:has(input:checked) {
  border-color: #B91C1C; background: var(--vermelho-claro);
  color: var(--vermelho); font-weight: 600;
}
.parc-radio-recalculo:has(input:checked) {
  border-color: #1D4ED8; background: #E7EEFD;
  color: #1D4ED8; font-weight: 600;
}

.parc-modal-acoes {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--cinza-100);
}
.parc-recibo-linha {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
  margin-bottom: 8px; padding: 7px 10px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 8px;
  font-size: 13px;
}
.parc-recibo-linha span { color: var(--cinza-700); }
.parc-recibo-linha a { color: var(--azul); font-weight: 600; }
.parc-recibo-linha .parc-recibo-remover { color: var(--vermelho); font-size: 12px; }
.parc-btn-remover {
  margin-left: auto;
  background: none;
  border: none;
  color: var(--vermelho);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  padding: 6px 2px;
  font-family: inherit;
}
.parc-btn-remover:hover { text-decoration: underline; }

.parc-aviso {
  background: var(--amarelo-claro);
  border: 1px solid #F0CE7A;
  border-radius: 8px;
  padding: 13px 15px;
  margin-top: 4px;
}
.parc-aviso-titulo { font-size: 13px; font-weight: 700; color: #7A4A08; margin-bottom: 5px; }
.parc-aviso p { margin: 0 0 11px; font-size: 12.5px; color: var(--amarelo); line-height: 1.5; }

/* ── Meu Ponto (visão do colaborador) ─────────────────────────────────────── */

.mp-hoje {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-radius: var(--raio);
  padding: 14px 18px;
  margin-bottom: 20px;
  border: 1px solid var(--cinza-200);
  background: var(--branco);
}
.mp-hoje-top { display: flex; align-items: center; gap: 14px; }
.mp-hoje-txt { display: flex; flex-direction: column; gap: 3px; }
.mp-hoje-txt strong { font-size: 14.5px; color: var(--cinza-800); }
.mp-hoje-txt span   { font-size: 12.5px; color: var(--cinza-600); }
.mp-hoje-ok     { border-color: #A8D5B8; background: var(--verde-claro); }
.mp-hoje-atraso { border-color: #F0CE7A; background: var(--amarelo-claro); }
.mp-hoje-sem    { border-color: #F0A3A3; background: var(--vermelho-claro); }
.mp-hoje-aguard { border-color: var(--cinza-300); background: var(--cinza-50); }
.mp-hoje #mp-btn-bater { margin-left: auto; flex-shrink: 0; }

/* Batidas de hoje, em tempo real */
.mp-hoje-batidas {
  display: flex; flex-wrap: wrap; gap: 10px;
  padding-top: 12px; border-top: 1px dashed rgba(0,0,0,.1);
}
.mp-hoje-bat {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  min-width: 68px; padding: 6px 10px; border-radius: 8px;
  background: rgba(255,255,255,.65);
}
.mp-hoje-bat-hora {
  font-family: ui-monospace, Consolas, monospace; font-size: 15px; font-weight: 700;
  color: var(--cinza-800);
}
.mp-hoje-bat-rot { font-size: 10.5px; color: var(--cinza-500); text-align: center; }

.mp-lanc-ocorrencia {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: -8px 0 20px;
}
.mp-lanc-ocorrencia .btn-sm { padding: 5px 12px; font-size: 12.5px; }
.mp-lanc-prazo { font-size: 11.5px; color: var(--cinza-500); }

.mp-bater-msg { font-size: 12.5px; margin: -12px 0 20px; min-height: 16px; }
.mp-bater-msg.mp-bater-ok  { color: var(--verde); }
.mp-bater-msg.mp-bater-erro { color: var(--vermelho); }

.mp-secao { margin-bottom: 26px; }
.mp-secao-titulo {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--cinza-500);
}
.mp-nota { font-size: 12px; color: var(--cinza-500); margin: 10px 0 0; line-height: 1.5; }

/* Banco de horas */
.mp-banco {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.mp-banco-item {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: var(--raio);
  padding: 15px 16px;
}
.mp-banco-val {
  display: block;
  font-size: 21px;
  font-weight: 700;
  color: var(--cinza-800);
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
}
.mp-banco-item label { font-size: 11.5px; color: var(--cinza-600); }
.mp-banco-destaque { border-width: 1.5px; }
.mp-banco-pos { border-color: #A8D5B8; background: var(--verde-claro); }
.mp-banco-pos .mp-banco-val { color: var(--verde); }
.mp-banco-neg { border-color: #F0A3A3; background: var(--vermelho-claro); }
.mp-banco-neg .mp-banco-val { color: var(--vermelho); }

/* Pendências */
.mp-pend-lista { display: flex; flex-direction: column; gap: 9px; }
.mp-pend {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-left: 3px solid var(--vermelho);
  border-radius: 0 var(--raio) var(--raio) 0;
  padding: 12px 16px;
}
.mp-pend-ausencia { border-left-color: var(--bordo); }
.mp-pend-data {
  font-size: 14px;
  font-weight: 700;
  color: var(--cinza-800);
  min-width: 52px;
}
.mp-pend-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 180px; }
.mp-pend-info strong { font-size: 13px; color: var(--cinza-800); }
.mp-pend-info span {
  font-size: 12px;
  color: var(--cinza-600);
  font-family: ui-monospace, Consolas, monospace;
}
.mp-pend-acao {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  background: var(--cinza-100);
  color: var(--cinza-600);
  padding: 3px 9px;
  border-radius: 20px;
}
.mp-pend-acao-aguardando { background: #fbefd7; color: #9a5b00; }
.mp-pend-acao-rejeitada { background: var(--vermelho-claro); color: var(--vermelho); }
.mp-pend .btn-link-inline { margin-left: 8px; font-size: 11px; }
.mp-ok {
  background: var(--verde-claro);
  border: 1px solid #A8D5B8;
  border-radius: var(--raio);
  padding: 14px 18px;
  font-size: 13.5px;
  color: var(--verde);
}

/* Resumo */
.mp-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 12px;
}
.mp-kpi {
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: var(--raio);
  padding: 15px 16px;
  text-align: center;
}
.mp-kpi span { display: block; font-size: 22px; font-weight: 700; color: var(--cinza-800); }
.mp-kpi label { font-size: 11.5px; color: var(--cinza-600); line-height: 1.3; }

/* Legado: tabela de batidas (mantido para outras telas que ainda usam .mp-mono) */
.mp-mono { font-family: ui-monospace, Consolas, monospace; }
.mp-alerta { color: var(--vermelho); font-weight: 700; }

/* ── Cards "Suas batidas, dia a dia" ─────────────────────────────────────── */
.mpc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px;
}
.mpc {
  --mpc-cor: var(--cinza-400);
  --mpc-bg: var(--cinza-50, #f8fafc);
  background: #fff;
  border: 1px solid var(--cinza-200);
  border-left: 4px solid var(--mpc-cor);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: box-shadow .15s ease, transform .15s ease;
}
.mpc:hover { box-shadow: 0 6px 18px rgba(15, 23, 42, .08); transform: translateY(-1px); }

.mpc-ok         { --mpc-cor: #16a34a; --mpc-bg: #f0fdf4; }
.mpc-alerta     { --mpc-cor: #f59e0b; --mpc-bg: #fffbeb; }
.mpc-incompleto { --mpc-cor: #2563eb; --mpc-bg: #eff6ff; }
.mpc-confirmado { --mpc-cor: #0d9488; --mpc-bg: #f0fdfa; }
.mpc-abonado    { --mpc-cor: #16a34a; --mpc-bg: #f0fdf4; }
.mpc-falta      { --mpc-cor: #dc2626; --mpc-bg: #fef2f2; }

.mpc-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.mpc-data { display: flex; flex-direction: column; line-height: 1.15; }
.mpc-dia  { font-size: 16px; font-weight: 800; color: var(--cinza-900, #0f172a); letter-spacing: -.01em; }
.mpc-dow  { font-size: 11px; color: var(--cinza-500); text-transform: capitalize; }

.mpc-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 700;
  background: var(--mpc-bg); color: var(--mpc-cor);
  box-shadow: inset 0 0 0 1px var(--mpc-cor);
  white-space: nowrap;
}
.mpc-ico { font-size: 11px; line-height: 1; }

.mpc-batidas { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.mpc-par { display: inline-flex; align-items: center; gap: 4px; }
.mpc-bat {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 12.5px; font-weight: 600;
  padding: 2px 8px; border-radius: 6px;
  background: var(--cinza-100); color: var(--cinza-700);
}
.mpc-seta { color: var(--cinza-300); font-size: 11px; }
.mpc-gap  { color: var(--cinza-300); margin: 0 3px; }
.mpc-bat-nd { font-size: 12px; color: var(--cinza-400); font-style: italic; }

.mpc-sit {
  font-size: 12.5px; line-height: 1.4;
  color: var(--cinza-700);
  border-top: 1px dashed var(--cinza-200);
  padding-top: 8px;
}
.mpc-alerta .mpc-sit,
.mpc-falta  .mpc-sit { color: #b45309; }
.mpc-falta  .mpc-sit { color: #b91c1c; }
.mpc-incompleto .mpc-sit { color: #1d4ed8; }
.mpc-extra { display: block; margin-top: 3px; font-size: 11.5px; color: var(--cinza-500); }

@media (max-width: 560px) { .mpc-grid { grid-template-columns: 1fr; } }

.mp-rodape {
  font-size: 12px;
  color: var(--cinza-500);
  line-height: 1.6;
  border-top: 1px solid var(--cinza-100);
  padding-top: 16px;
  margin-top: 8px;
}

.mp-vazio {
  background: var(--branco);
  border: 1px dashed var(--cinza-300);
  border-radius: var(--raio-lg);
  padding: 48px 28px;
  text-align: center;
}
.mp-vazio-icone { font-size: 38px; margin-bottom: 12px; opacity: .75; }
.mp-vazio h3 { margin: 0 0 8px; font-size: 16px; color: var(--cinza-800); }
.mp-vazio p  { margin: 0; font-size: 13.5px; color: var(--cinza-600); line-height: 1.6; }

@media (max-width: 640px) {
  .mp-pend { flex-direction: column; align-items: flex-start; gap: 8px; }
}

/* Aba Inconsistências — dia em andamento fica visualmente distinto do que falhou */
.ponto-inc-nota {
  font-size: 12.5px;
  color: var(--cinza-600);
  margin: 10px 0 14px;
  line-height: 1.5;
}
.ponto-inc-dia {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.ponto-inc-dia-hoje {
  background: var(--cinza-100) !important;
  border-color: var(--cinza-300) !important;
  color: var(--cinza-600) !important;
}
.ponto-inc-tag-hoje {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  background: var(--cinza-300);
  color: var(--cinza-800);
  padding: 1px 6px;
  border-radius: 20px;
}

/* Dia inteiro sem registro (ausência) x batida esquecida — tratamentos diferentes */
.ponto-inc-dia-ausencia {
  background: var(--bordo-claro) !important;
  border-color: var(--bordo) !important;
  color: var(--bordo) !important;
}
.ponto-inc-tag-aus {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  background: var(--bordo);
  color: #fff;
  padding: 1px 6px;
  border-radius: 20px;
}

.ponto-inc-legenda {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 16px;
  font-size: 12.5px;
  color: var(--cinza-600);
  line-height: 1.5;
}
.ponto-inc-legenda span { display: flex; align-items: center; gap: 8px; }
.ponto-inc-legenda strong { color: var(--cinza-800); }
.ponto-inc-leg {
  width: 12px; height: 12px;
  border-radius: 3px;
  display: inline-block;
  flex-shrink: 0;
}
.ponto-inc-leg-ausencia  { background: var(--bordo-claro); border: 1px solid var(--bordo); }
.ponto-inc-leg-esquecida { background: var(--vermelho-claro); border: 1px solid var(--vermelho); }
.ponto-inc-leg-hoje      { background: var(--cinza-100); border: 1px solid var(--cinza-300); }

/* Aviso e diagnóstico da integração de Ponto */
.pvg-aviso-zerado {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  background: var(--amarelo-claro);
  border: 1px solid #F0CE7A;
  border-radius: 8px;
  padding: 11px 15px;
  margin-bottom: 14px;
  font-size: 12.5px;
  color: #7A4A08;
  line-height: 1.5;
}
.pvg-aviso-zerado span { flex: 1; min-width: 240px; }

.diag-conclusao {
  background: var(--azul-claro);
  border-left: 3px solid var(--azul);
  border-radius: 0 8px 8px 0;
  padding: 12px 15px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--cinza-800);
  margin-bottom: 18px;
}
.diag-bloco { margin-bottom: 18px; }
.diag-bloco h4 {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--cinza-500);
}
.diag-tabela { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.diag-tabela td { padding: 6px 0; border-bottom: 1px solid var(--cinza-100); }
.diag-tabela td:first-child { color: var(--cinza-600); }
.diag-tabela td:last-child  { text-align: right; }
.diag-tabela tr:last-child td { border-bottom: none; }
.diag-tabela code {
  background: var(--cinza-100);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11.5px;
}
.diag-tabela-sit td:first-child { text-align: left; }
.diag-legenda { font-size: 11.5px; color: var(--cinza-500); margin: 12px 0 6px; }

/* Importação de planilha */
.parc-header-acoes { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; }
.parc-vazio-acoes  { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

.parc-import-carregando { font-size: 13px; color: var(--cinza-500); margin: 18px 0; }

.parc-import-rel { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--cinza-100); }
.parc-import-num {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}
.parc-import-num > div {
  background: var(--cinza-50);
  border-radius: 8px;
  padding: 11px 8px;
  text-align: center;
}
.parc-import-num strong { display: block; font-size: 20px; color: var(--cinza-800); }
.parc-import-num span   { font-size: 10.5px; color: var(--cinza-600); }
.parc-import-linha { font-size: 12.5px; color: var(--cinza-600); margin: 0 0 14px; line-height: 1.5; }

.parc-import-det {
  border: 1px solid var(--cinza-200);
  border-radius: 8px;
  padding: 10px 13px;
  margin-bottom: 10px;
  font-size: 12.5px;
}
.parc-import-det summary { cursor: pointer; font-weight: 600; color: var(--cinza-800); }
.parc-import-det ul {
  margin: 10px 0 0;
  padding-left: 18px;
  max-height: 230px;
  overflow-y: auto;
}
.parc-import-det li { margin-bottom: 7px; line-height: 1.45; color: var(--cinza-800); }
.parc-import-det li span { color: var(--cinza-500); font-size: 11.5px; }

.parc-import-acao {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--cinza-100);
}
.parc-import-nota { font-size: 11.5px; color: var(--cinza-500); }

.parc-import-ok {
  background: var(--verde-claro);
  border: 1px solid #A8D5B8;
  border-radius: 10px;
  padding: 18px 20px;
  margin-top: 20px;
  text-align: center;
}
.parc-import-ok-titulo { font-size: 15px; font-weight: 700; color: var(--verde); margin-bottom: 7px; }
.parc-import-ok p { font-size: 13px; color: var(--cinza-800); margin: 0 0 14px; line-height: 1.6; }

/* Lista de inconsistências */
.parc-inc-lista {
  max-height: 440px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.parc-inc {
  border: 1px solid var(--cinza-200);
  border-left: 3px solid var(--cinza-300);
  border-radius: 8px;
  padding: 11px 14px;
}
.parc-inc.parc-inc-erro  { border-left-color: var(--vermelho); background: var(--vermelho-claro); }
.parc-inc.parc-inc-aviso { border-left-color: #E0A500;         background: var(--amarelo-claro); }
.parc-inc-topo { display: flex; align-items: center; gap: 9px; margin-bottom: 3px; flex-wrap: wrap; }
.parc-inc-tag {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
  background: rgba(0,0,0,.07);
  padding: 2px 7px;
  border-radius: 20px;
}
.parc-inc-desc { font-size: 12px; color: var(--cinza-600); }
.parc-inc-msg  { font-size: 12.5px; margin-top: 5px; line-height: 1.45; }

/* ── Aviso flutuante ──────────────────────────────────────────────────────── */

.parc-toast {
  position: fixed;
  bottom: 26px;
  left: 50%;
  transform: translate(-50%, 18px);
  background: var(--cinza-800);
  color: #fff;
  font-size: 13px;
  line-height: 1.45;
  padding: 13px 20px;
  border-radius: 10px;
  box-shadow: var(--sombra-lg);
  max-width: 520px;
  z-index: 9999;
  opacity: 0;
  transition: opacity .25s, transform .25s;
}
.parc-toast.visivel { opacity: 1; transform: translate(-50%, 0); }
.parc-toast-erro  { background: var(--vermelho); }
.parc-toast-aviso { background: #7A4A08; }

@media (max-width: 860px) {
  .parc-filtros { flex-direction: column; align-items: stretch; }
  .parc-f select, .parc-f input { width: 100%; min-width: 0; }
  .parc-bloco { padding: 14px; }
  .parc-tabela-wrap { margin: 0 -14px; padding: 0 14px; }
  .parc-radios { flex-direction: column; }
  .parc-modal-acoes { flex-direction: column; align-items: stretch; }
  .parc-btn-remover { margin-left: 0; text-align: center; }

  /* Em tela estreita as 5 colunas congeladas comeriam quase todo o espaço —
     melhor liberar a rolagem inteira do que sobrar 80px para os meses. */
  .parc-tabela th.parc-th-imposto,
  .parc-tabela th.parc-th-acesso,
  .parc-tabela th.parc-th-insc,
  .parc-tabela th.parc-th-c,
  .parc-tabela th.parc-th-sit,
  .parc-tabela td.parc-td-imposto,
  .parc-tabela td.parc-td-acesso,
  .parc-tabela td.parc-td-insc,
  .parc-tabela td.parc-td-c,
  .parc-tabela td.parc-td-sit { position: static; box-shadow: none; }
}

/* ═══════════════════════════════════════════════════════════════
   OCORRÊNCIAS DE JORNADA (Controle de Ponto)
   ═══════════════════════════════════════════════════════════════ */

.ocorr-resumo {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  align-items: center;
  margin-bottom: 1.2rem;
}

.ocorr-resumo-card {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  padding: .7rem 1.1rem;
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-radius: var(--raio);
  box-shadow: var(--sombra-sm);
  min-width: 110px;
}
.ocorr-resumo-num {
  font-size: 22px;
  font-weight: 800;
  color: var(--azul);
  line-height: 1.1;
}
.ocorr-resumo-lbl {
  font-size: 11px;
  font-weight: 600;
  color: var(--cinza-600);
  text-transform: uppercase;
  letter-spacing: .3px;
}

.ocorr-resumo-grupos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}
.ocorr-grupo-chip {
  padding: .3rem .6rem;
  background: var(--cinza-100);
  border-radius: 999px;
  font-size: 11.5px;
  color: var(--cinza-600);
  white-space: nowrap;
}
.ocorr-grupo-chip b { color: var(--cinza-800); }

/* Lista de lançamentos */
.ocorr-lista {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: .9rem;
}

.ocorr-card {
  position: relative;
  padding: .9rem 1rem .8rem 1.1rem;
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  border-left: 4px solid var(--cinza-300);
  border-radius: var(--raio);
  box-shadow: var(--sombra-sm);
  transition: box-shadow .15s;
}
.ocorr-card:hover { box-shadow: var(--sombra-md); }

/* A faixa lateral repete a cor do tipo: a leitura da lista vira visual */
.ocorr-cor-azul     { border-left-color: #2563EB; }
.ocorr-cor-verde    { border-left-color: var(--verde); }
.ocorr-cor-vermelho { border-left-color: var(--vermelho); }
.ocorr-cor-amarelo  { border-left-color: #D97706; }
.ocorr-cor-roxo     { border-left-color: #7C3AED; }
.ocorr-cor-cinza    { border-left-color: var(--cinza-500); }

.ocorr-card-topo {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .5rem;
}
.ocorr-card-id { display: flex; flex-direction: column; gap: .05rem; min-width: 0; flex: 1; }
.ocorr-card-id strong {
  font-size: 13.5px;
  color: var(--cinza-800);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ocorr-tipo { font-size: 12px; font-weight: 600; color: var(--cinza-600); }

.ocorr-card-acoes { display: flex; gap: .2rem; }
.btn-icone {
  border: none;
  background: transparent;
  cursor: pointer;
  padding: .25rem .4rem;
  border-radius: 6px;
  font-size: 13px;
  color: var(--cinza-500);
  line-height: 1;
}
.btn-icone:hover { background: var(--cinza-100); color: var(--cinza-800); }
.ponto-reg-acoes { display: flex; gap: 4px; white-space: nowrap; }

.ocorr-card-periodo {
  font-size: 12.5px;
  color: var(--cinza-800);
  font-weight: 600;
  margin-bottom: .45rem;
}

.ocorr-card-efeitos { display: flex; flex-wrap: wrap; gap: .3rem; }
.ocorr-efeito {
  padding: .18rem .5rem;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
}
.ocorr-efeito-abona { background: var(--verde-claro);    color: var(--verde); }
.ocorr-efeito-conta { background: var(--vermelho-claro); color: var(--vermelho); }
.ocorr-efeito-trab  { background: var(--azul-claro);     color: var(--azul); }

.ocorr-card-motivo {
  margin-top: .5rem;
  padding-top: .5rem;
  border-top: 1px dashed var(--cinza-200);
  font-size: 12px;
  color: var(--cinza-600);
  line-height: 1.45;
}
.ocorr-card-rodape {
  margin-top: .4rem;
  font-size: 10.5px;
  color: var(--cinza-500);
}
.ocorr-card-divida {
  margin-top: .5rem;
  padding: .4rem .6rem;
  border-radius: var(--raio);
  font-size: 11.5px;
  font-weight: 600;
  background: var(--cinza-100);
  color: var(--cinza-700);
}
.ocorr-divida-aberta { background: #fbefd7; color: #9a5b00; }
.ocorr-divida-quitada { background: var(--verde-claro); color: var(--verde); }
.ocorr-divida-quitada_no_prazo { background: var(--vermelho-claro); color: var(--vermelho); }
/* Saldo positivo em aberto: escritório deve horas — verde, não laranja de alerta */
.ocorr-divida-aberta.ocorr-divida-sinal-pos { background: var(--verde-claro); color: var(--verde); }
.ocorr-divida-desc {
  display: block;
  margin-top: .2rem;
  font-weight: 500;
  opacity: .85;
}
.ponto-sinal-badge {
  display: inline-block;
  padding: .1rem .45rem;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.ocorr-divida-sinal-neg.ponto-sinal-badge { background: var(--vermelho-claro); color: var(--vermelho); }
.ocorr-divida-sinal-pos.ponto-sinal-badge { background: var(--verde-claro); color: var(--verde); }

/* Modal de lançamento */
.oc-ajuda {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: .45rem 0 0;
  font-size: 11.5px;
}
.oc-ajuda-txt {
  flex-basis: 100%;
  color: var(--cinza-600);
  line-height: 1.45;
}
.oc-check {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: .45rem;
  font-weight: 600;
  font-size: 13px;
  color: var(--cinza-800);
  cursor: pointer;
}
.oc-check input { width: auto; margin: 0; }

.oc-erro {
  margin-top: .8rem;
  padding: .65rem .9rem;
  background: var(--vermelho-claro);
  border: 1px solid #f5b5b5;
  border-radius: var(--raio);
  font-size: 12.5px;
  color: var(--vermelho);
  line-height: 1.45;
}

/* Selo de ocorrência dentro das outras telas do Ponto */
.ponto-selo-ocorr {
  display: inline-block;
  padding: .15rem .45rem;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  background: var(--cinza-100);
  color: var(--cinza-600);
  margin-left: .35rem;
}
.ponto-selo-ocorr.ocorr-cor-verde { background: var(--verde-claro); color: var(--verde); }
.ponto-selo-ocorr.ocorr-cor-azul  { background: #E7EEFD;            color: #2563EB; }
.ponto-selo-ocorr.ocorr-cor-roxo  { background: #F1EAFE;            color: #7C3AED; }
.ponto-selo-ocorr.ocorr-cor-cinza { background: var(--cinza-100);   color: var(--cinza-600); }

@media (max-width: 640px) {
  .ocorr-lista { grid-template-columns: 1fr; }
}

/* Pendência já justificada por ocorrência (Meu Ponto) */
.mp-pend-ok { border-left-color: var(--verde) !important; opacity: .85; }
.mp-pend-acao-ok { background: var(--verde-claro) !important; color: var(--verde) !important; }

/* Dia sem batida que já tem ocorrência lançada: continua visível, mas resolvido */
.ponto-inc-dia-ok {
  border-color: var(--verde) !important;
  background: var(--verde-claro) !important;
}
.ponto-inc-dia-ok .ponto-inc-hora { color: var(--verde); }
.ponto-inc-tag-ok {
  display: inline-block;
  margin-left: .4rem;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: var(--verde);
  color: var(--branco);
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
  vertical-align: middle;
}
.ponto-inc-leg-ok { background: var(--verde); }
.ponto-badge-verde { background: var(--verde-claro); color: var(--verde); }

/* Ocorrência lançada para quem não tem vínculo Zorya — não abate nada */
.ocorr-alerta-vinculo {
  padding: .85rem 1.1rem;
  margin-bottom: 1rem;
  background: var(--amarelo-claro);
  border: 1px solid #fcd34d;
  border-left: 4px solid var(--amarelo);
  border-radius: 0 var(--raio) var(--raio) 0;
}
.ocorr-alerta-vinculo strong { font-size: 13.5px; color: var(--amarelo); }
.ocorr-alerta-vinculo p {
  margin: .35rem 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--cinza-800);
}
.ocorr-alerta-vinculo em { font-style: normal; font-weight: 600; }

/* Vínculo com a Zorya na lista de usuários — precisa saltar aos olhos quando falta,
   porque sem ele atestado e férias lançados não abatem nada nos indicadores */
.tag-ponto-ok    { background: var(--verde-claro)   !important; color: var(--verde)    !important; }
.tag-ponto-falta { background: var(--amarelo-claro) !important; color: var(--amarelo)  !important; font-weight: 700; }
.campo-dica-erro { color: var(--vermelho); }

/* ═══════════════════════════════════════════════════════════════
   FICHA DO PARCELAMENTO (modal de visualização)
   ═══════════════════════════════════════════════════════════════ */

.parc-ficha-carregando { padding: 2rem; text-align: center; color: var(--cinza-600); }

.parc-ficha-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem;
  padding-bottom: .9rem; border-bottom: 1px solid var(--cinza-200);
}
.parc-ficha-head h2 { margin: 0 0 .2rem; font-size: 17px; line-height: 1.3; }
.parc-ficha-cliente { margin: 0; font-size: 13px; color: var(--cinza-600); }
.parc-ficha-selos { display: flex; gap: .35rem; flex-wrap: wrap; align-items: center; }

.parc-chip-esfera, .parc-chip-cat {
  padding: .2rem .55rem; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px;
}
.parc-chip-cat { background: var(--cinza-100); color: var(--cinza-600); }
.parc-esf-federal   { background: #E7EEFD; color: #1D4ED8; }
.parc-esf-estadual  { background: var(--verde-claro); color: var(--verde); }
.parc-esf-municipal { background: #F1EAFE; color: #7C3AED; }

.parc-ficha-alerta {
  padding: .8rem 1rem; margin-bottom: 1rem;
  background: var(--vermelho-claro); border-left: 4px solid var(--vermelho); border-radius: 0 8px 8px 0;
}
.parc-ficha-alerta strong { font-size: 13px; color: var(--vermelho); }
.parc-ficha-alerta p { margin: .3rem 0 0; font-size: 12.5px; line-height: 1.5; color: var(--cinza-800); }

.parc-ficha-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem; margin-bottom: 1.4rem; }
.parc-fk {
  background: var(--cinza-50); border-radius: 10px; padding: .7rem .5rem; text-align: center;
}
.parc-fk span { display: block; font-size: 21px; font-weight: 800; color: var(--azul); line-height: 1.1; }
.parc-fk span i { font-style: normal; font-size: 13px; color: var(--cinza-500); font-weight: 600; }
.parc-fk label { font-size: 10.5px; color: var(--cinza-600); text-transform: uppercase; letter-spacing: .3px; }
.parc-fk-alerta span { color: var(--vermelho); }

.parc-ficha-sec {
  font-size: 12px; text-transform: uppercase; letter-spacing: .4px;
  color: var(--cinza-500); margin: 0 0 .6rem; font-weight: 700;
}

/* Linha do tempo do ano — a mesma leitura da grade, em tamanho de leitura */
.parc-ficha-faixa { display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; }
.parc-fx-col { text-align: center; }
.parc-fx-cel {
  height: 32px; display: flex; align-items: center; justify-content: center;
  border-radius: 6px; font-size: 11px; font-weight: 700;
  border: 1.5px solid rgba(255,255,255,.85); box-shadow: 0 0 0 1px rgba(20,24,48,.1);
}
.parc-fx-ok        { background: #15803D; color: #fff; }
.parc-fx-atencao   { background: #E0A500; color: #3D2A00; }
.parc-fx-problema  { background: #B91C1C; color: #fff; }
.parc-fx-recalculo {
  background: #1D4ED8; color: #fff;
  background-image: repeating-linear-gradient(45deg, transparent, transparent 4px, rgba(255,255,255,.16) 4px, rgba(255,255,255,.16) 8px);
}
.parc-fx-vazio { background: transparent; border: 1px dashed var(--cinza-300); box-shadow: none; }
.parc-fx-mes { font-size: 9.5px; color: var(--cinza-500); margin-top: 3px; font-weight: 600; }

.parc-ficha-nota { font-size: 12px; color: var(--cinza-600); margin: .6rem 0 1.4rem; }

.parc-ficha-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .1rem .9rem; margin-bottom: 1.2rem; }
.parc-ficha-linha {
  display: flex; justify-content: space-between; gap: .6rem;
  padding: .45rem 0; border-bottom: 1px dashed var(--cinza-200); font-size: 12.5px;
}
.parc-ficha-linha span { color: var(--cinza-600); white-space: nowrap; }
.parc-ficha-linha strong { color: var(--cinza-800); text-align: right; word-break: break-word; }

.parc-ficha-obs { margin-bottom: 1.2rem; }
.parc-ficha-obs span {
  display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .3px;
  color: var(--cinza-500); font-weight: 700; margin-bottom: .25rem;
}
.parc-ficha-obs p {
  margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--cinza-800);
  background: var(--cinza-50); padding: .6rem .8rem; border-radius: 8px;
}

.parc-ficha-acoes { display: flex; justify-content: flex-end; gap: .5rem; padding-top: .9rem; border-top: 1px solid var(--cinza-200); }

@media (max-width: 640px) {
  .parc-ficha-kpis { grid-template-columns: repeat(2, 1fr); }
  .parc-ficha-grid { grid-template-columns: 1fr; }
  .parc-ficha-faixa { grid-template-columns: repeat(6, 1fr); gap: 6px; }
}

/* Chip de esfera na linha da grade */
.parc-tag-esf { font-weight: 700; }

/* ═══════════════════════════════════════════════════════════════
   PARCELAMENTOS — DASHBOARD FINANCEIRO
   ═══════════════════════════════════════════════════════════════ */

.parc-subabas {
  display: flex; gap: .35rem; margin-bottom: 1.2rem;
  border-bottom: 1px solid var(--cinza-200); padding-bottom: .1rem;
}
.parc-subaba {
  background: none; border: none; cursor: pointer;
  padding: .55rem .95rem; font-size: 13px; font-weight: 600;
  color: var(--cinza-600); border-bottom: 2.5px solid transparent;
  font-family: inherit; margin-bottom: -1px;
}
.parc-subaba:hover { color: var(--azul); }
.parc-subaba-ativa { color: var(--azul); border-bottom-color: var(--azul); }

.parc-fin-escopo { font-size: 12px; color: var(--cinza-600); align-self: flex-end; padding-bottom: .5rem; }

/* Aviso de dado incompleto — precisa incomodar, senão o total mente em silêncio */
.parc-fin-aviso {
  padding: .85rem 1.1rem; margin-bottom: 1.4rem;
  background: var(--amarelo-claro); border: 1px solid #fcd34d;
  border-left: 4px solid var(--amarelo); border-radius: 0 var(--raio) var(--raio) 0;
}
.parc-fin-aviso strong { font-size: 13.5px; color: var(--amarelo); }
.parc-fin-aviso p { margin: .35rem 0 0; font-size: 12.5px; line-height: 1.55; color: var(--cinza-800); }

.parc-fin-sec {
  font-size: 12px; text-transform: uppercase; letter-spacing: .4px;
  color: var(--cinza-500); font-weight: 700; margin: 1.8rem 0 .7rem;
}
.parc-fin-sec span {
  text-transform: none; letter-spacing: 0; font-weight: 500;
  color: var(--cinza-500); font-size: 11.5px; margin-left: .4rem;
}
.parc-fin-sec span::before { content: '· '; }

.parc-fin-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.parc-fc {
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-top: 3px solid var(--cinza-300);
  border-radius: var(--raio); padding: .9rem 1rem; box-shadow: var(--sombra-sm);
}
.parc-fc label {
  display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .3px;
  color: var(--cinza-600); font-weight: 700; margin-bottom: .25rem;
}
.parc-fc span { display: block; font-size: 19px; font-weight: 800; color: var(--cinza-800); line-height: 1.2; }
.parc-fc small { display: block; font-size: 11px; color: var(--cinza-500); margin-top: .2rem; }
.parc-fc-total  { border-top-color: var(--azul); }
.parc-fc-pago   { border-top-color: var(--verde); }
.parc-fc-pago span { color: var(--verde); }
.parc-fc-aberto { border-top-color: var(--vermelho); }
.parc-fc-aberto span { color: var(--vermelho); }
.parc-fc-aguard { border-top-color: #E0A500; }

/* Barra de quitação */
.parc-fin-barra {
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-radius: var(--raio); padding: 1rem 1.2rem; margin-top: 1.2rem;
}
.parc-fin-barra-topo { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .5rem; }
.parc-fin-barra-topo span { font-size: 12.5px; color: var(--cinza-600); font-weight: 600; }
.parc-fin-barra-topo strong { font-size: 21px; color: var(--verde); font-weight: 800; }
.parc-fin-barra-fundo { height: 10px; background: var(--cinza-200); border-radius: 100px; overflow: hidden; }
.parc-fin-barra-fill { height: 100%; background: var(--verde); border-radius: 100px; transition: width .4s; }
.parc-fin-barra-rod { display: flex; justify-content: space-between; margin-top: .4rem; font-size: 11.5px; color: var(--cinza-500); }

/* Projeção — visualmente separada dos fatos, com fundo diferente */
.parc-fin-proj {
  background: var(--cinza-50); border: 1px dashed var(--cinza-300);
  border-radius: var(--raio); padding: 1rem 1.2rem;
  display: flex; gap: 1.4rem; align-items: flex-start; flex-wrap: wrap;
}
.parc-fin-proj > div { flex-shrink: 0; }
.parc-fin-proj label {
  display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .3px;
  color: var(--cinza-600); font-weight: 700;
}
.parc-fin-proj span { font-size: 21px; font-weight: 800; color: var(--cinza-800); }
.parc-fin-proj p { margin: 0; font-size: 12px; line-height: 1.55; color: var(--cinza-600); flex: 1; min-width: 260px; }
.parc-fin-proj em { font-style: normal; font-weight: 600; color: var(--cinza-800); }

/* Por esfera */
.parc-fin-esferas { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .8rem; }
.parc-fin-esf {
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-left: 4px solid var(--cinza-300); border-radius: 0 var(--raio) var(--raio) 0;
  padding: .85rem 1rem;
}
.parc-fin-esf.parc-esf-federal   { border-left-color: #1D4ED8; }
.parc-fin-esf.parc-esf-estadual  { border-left-color: var(--verde); }
.parc-fin-esf.parc-esf-municipal { border-left-color: #7C3AED; }
.parc-fin-esf-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .55rem; }
.parc-fin-esf-top strong { font-size: 13px; color: var(--cinza-800); }
.parc-fin-esf-top span { font-size: 11px; color: var(--cinza-500); }
.parc-fin-esf-val { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; }
.parc-fin-esf-val label { display: block; font-size: 10px; color: var(--cinza-500); text-transform: uppercase; }
.parc-fin-esf-val b { font-size: 12.5px; color: var(--cinza-800); }

/* Tabela por cliente */
.parc-fin-tabela td, .parc-fin-tabela th { vertical-align: middle; }
.parc-fin-num { text-align: right !important; white-space: nowrap; }
.parc-fin-pos { color: var(--verde); font-weight: 600; }
.parc-fin-neg { color: var(--vermelho); font-weight: 600; }
.parc-fin-sub { font-size: 11px; color: var(--cinza-500); margin-top: 2px; }
.parc-fin-alerta-mini { color: var(--amarelo); font-weight: 600; }
.parc-fin-rodape { font-size: 11.5px; color: var(--cinza-500); margin-top: 1.4rem; line-height: 1.5; }

/* ── Urgências: cards por gravidade ────────────────────────────────────────── */
.parc-subaba-badge {
  display: inline-block; min-width: 18px; padding: 1px 6px; margin-left: 4px;
  background: var(--vermelho); color: #fff; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; line-height: 16px; text-align: center;
}

/* Os KPIs reaproveitam .stat-card/.grade-stats da Visão Geral — o módulo tem
   que parecer parte do sistema. Aqui só o comportamento de clique. */
.parc-urg-stats .stat-card { cursor: pointer; transition: box-shadow .15s, border-color .15s; }
.parc-urg-stats .stat-card:hover { box-shadow: var(--sombra-md); border-color: var(--cinza-300); }
.parc-urg-stats .stat-card-ativo { border-color: var(--azul); box-shadow: 0 0 0 2px var(--azul-claro); }
.parc-urg-stats .stat-card-zero { opacity: .55; }
.parc-urg-stats .stat-card-zero:hover { box-shadow: var(--sombra-sm); }

.parc-urg-filtro-ativo {
  padding: 9px 20px; background: var(--azul-claro); font-size: 12px; color: var(--cinza-600);
  border-bottom: 1px solid var(--cinza-100);
}
.parc-urg-filtro-ativo strong { color: var(--azul); }
.parc-urg-filtro-ativo button {
  margin-left: 8px; background: none; border: none; color: var(--azul);
  font-size: 11.5px; text-decoration: underline; cursor: pointer; padding: 0;
}

.parc-urg-corpo { padding: 4px 20px 18px; }
.parc-urg-corpo .vg-secao { margin: 18px 0 10px; }
.parc-urg-corpo .vg-secao:first-child { margin-top: 12px; }
.parc-secao-iminente .vg-secao-titulo { color: var(--vermelho); }
.parc-secao-critico  .vg-secao-titulo { color: #E24B4A; }
.parc-secao-atencao  .vg-secao-titulo { color: var(--amarelo); }

/* 280px é o mínimo que ainda mostra um nome longo de razão social em 2 linhas.
   Com auto-fill o grid escolhe sozinho: 3 colunas na tela normal, 4 na maior. */
.parc-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.parc-card {
  background: var(--branco); border: 1px solid var(--cinza-200); border-top: 3px solid var(--cinza-300);
  border-radius: 10px; padding: 13px 14px; display: flex; flex-direction: column;
}
.parc-card.nivel-iminente { border-top-color: var(--vermelho); }
.parc-card.nivel-critico  { border-top-color: #E24B4A; }
.parc-card.nivel-atencao  { border-top-color: #EF9F27; }

.parc-card-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 7px; }
.parc-card-topo strong {
  font-size: 12.5px; line-height: 1.35; color: var(--cinza-800);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.parc-card-selo {
  font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  white-space: nowrap; flex-shrink: 0;
}
.parc-card-selo.iminente { background: var(--vermelho); color: #fff; }
.parc-card-selo.critico  { background: var(--vermelho-claro); color: var(--vermelho); }
.parc-card-selo.atencao  { background: var(--amarelo-claro); color: var(--amarelo); }

.parc-card-meta { font-size: 11.5px; color: var(--cinza-600); line-height: 1.6; margin-bottom: 9px; }
.parc-card-chips { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 11px; }
.parc-chip { font-size: 10px; padding: 2px 7px; border-radius: 4px; white-space: nowrap; }
.parc-chip.ok     { background: var(--verde-claro);   color: var(--verde); }
.parc-chip.alerta { background: var(--amarelo-claro); color: var(--amarelo); }
.parc-chip.info   { background: var(--azul-claro);    color: var(--azul); }
.parc-chip.resp   { background: var(--azul-claro);    color: var(--azul); }
.parc-chip.neutro { background: var(--cinza-100);     color: var(--cinza-600); }

.parc-card-trat {
  font-size: 11px; color: var(--cinza-600); background: var(--cinza-50);
  border-radius: 6px; padding: 7px 9px; line-height: 1.5; margin-bottom: 11px;
}
.parc-card-trat.vencida { background: var(--amarelo-claro); }
.parc-card-trat b { display: block; color: var(--cinza-800); margin-bottom: 2px; font-size: 10.5px; }
.parc-card-trat i { display: block; margin-top: 3px; color: var(--amarelo); font-style: normal; font-weight: 600; }

.parc-card-acoes { display: flex; gap: 6px; margin-top: auto; }
.parc-card-btn {
  flex: 1; font-size: 11.5px; font-weight: 600; padding: 6px 8px; cursor: pointer;
  background: var(--azul); color: #fff; border: 1px solid var(--azul); border-radius: 6px;
}
.parc-card-btn:hover { background: var(--azul-escuro); border-color: var(--azul-escuro); }
.parc-card-btn.sec { background: transparent; color: var(--azul); }
.parc-card-btn.sec:hover { background: var(--azul-claro); }
.parc-card-btn-vazio { flex: 1; }
.parc-card-ico {
  width: 32px; font-size: 12px; padding: 6px 0; cursor: pointer;
  background: var(--branco); color: var(--cinza-600);
  border: 1px solid var(--cinza-300); border-radius: 6px;
}
.parc-card-ico:hover { background: var(--cinza-50); color: var(--cinza-800); }

.parc-urg-rodape { font-size: 11.5px; color: var(--cinza-500); margin-top: 12px; line-height: 1.55; }

.parc-trat-hist { display: grid; gap: 10px; max-height: 420px; overflow-y: auto; }
.parc-trat-item {
  background: var(--cinza-50); border-radius: 8px; padding: 10px 12px;
  font-size: 12.5px; line-height: 1.55;
}
.parc-trat-meta { font-size: 11px; font-weight: 600; color: var(--azul); margin-bottom: 3px; }

@media (max-width: 720px) {
  .parc-cards { grid-template-columns: 1fr; }
}



/* ── Dashboard operacional ─────────────────────────────────────────────────── */
.parc-pdo-topo {
  display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap;
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 14px 18px; margin-bottom: 18px; box-shadow: var(--sombra-sm);
}
.parc-pdo-escopo { font-size: 12px; color: var(--cinza-500); padding-bottom: 8px; }

/* Dois painéis lado a lado: distribuição e desfecho respondem perguntas
   diferentes e cabem na mesma linha sem competir. */
.parc-pdo-duplo { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.parc-pdo-duplo .painel { margin-bottom: 20px; }
.parc-pdo-corpo { padding: 16px 20px 18px; }

.parc-regua-barra { display: flex; height: 8px; border-radius: 4px; overflow: hidden; margin-bottom: 14px; }
.parc-regua-barra .seg.ok       { background: var(--verde); }
.parc-regua-barra .seg.atencao  { background: #EF9F27; }
.parc-regua-barra .seg.critico  { background: #F09595; }
.parc-regua-barra .seg.iminente { background: var(--vermelho); }

.parc-pdo-niveis, .parc-pdo-desf {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 8px; margin-bottom: 12px;
}
.parc-pdo-nivel {
  border-radius: 8px; padding: 9px 10px; background: var(--cinza-50);
  border-left: 3px solid var(--cinza-300);
}
.parc-pdo-nivel b { display: block; font-size: 19px; font-weight: 700; line-height: 1.2; }
.parc-pdo-nivel span { font-size: 11px; color: var(--cinza-600); }
.parc-pdo-nivel.ok       { background: var(--verde-claro);    border-left-color: var(--verde); }
.parc-pdo-nivel.ok b     { color: var(--verde); }
.parc-pdo-nivel.atencao  { background: var(--amarelo-claro);  border-left-color: #EF9F27; }
.parc-pdo-nivel.atencao b{ color: var(--amarelo); }
.parc-pdo-nivel.critico  { background: var(--vermelho-claro); border-left-color: #F09595; }
.parc-pdo-nivel.critico b{ color: var(--vermelho); }
.parc-pdo-nivel.iminente { background: var(--vermelho-claro); border-left-color: var(--vermelho); }
.parc-pdo-nivel.iminente b { color: var(--vermelho); }
.parc-pdo-nivel.neutro b { color: var(--cinza-600); }

.parc-pdo-taxa { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.parc-pdo-taxa b { font-size: 26px; font-weight: 700; color: var(--verde); line-height: 1; }
.parc-pdo-taxa span { font-size: 12px; color: var(--cinza-600); flex: 1; min-width: 140px; }
.parc-pdo-taxa.pequena b { font-size: 20px; color: var(--cinza-800); }

.parc-pdo-nota { font-size: 11.5px; color: var(--cinza-500); line-height: 1.55; margin: 0; }
.parc-pdo-nota b { color: var(--cinza-600); }

.parc-graf-legenda { display: flex; gap: 14px; font-size: 10.5px; color: var(--cinza-600); margin-bottom: 10px; flex-wrap: wrap; }
.parc-graf-legenda i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 4px; }
.parc-graf-legenda i.ok        { background: var(--verde); }
.parc-graf-legenda i.atencao   { background: #EF9F27; }
.parc-graf-legenda i.problema  { background: var(--vermelho); }
.parc-graf-legenda i.recalculo { background: #378ADD; }

/* ── Busca de cliente por nome ou CNPJ ─────────────────────────────────────── */
.cli-busca { position: relative; }
.cli-selecionado {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: var(--branco); border: 1px solid var(--cinza-300); border-radius: var(--raio);
  padding: 9px 12px; min-height: 42px;
}
.cli-selecionado.vazio { border-style: dashed; }
.cli-sel-txt strong { display: block; font-size: 13px; color: var(--cinza-800); }
.cli-selecionado.vazio .cli-sel-txt strong { color: var(--cinza-500); font-weight: 400; }
.cli-sel-txt span { display: block; font-size: 11.5px; color: var(--cinza-500); margin-top: 1px; }
.cli-btn-trocar {
  background: var(--azul-claro); color: var(--azul); border: none; border-radius: 6px;
  padding: 6px 12px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.cli-btn-trocar:hover { background: var(--azul); color: #fff; }

.cli-painel {
  margin-top: 8px; border: 1px solid var(--cinza-200); border-radius: var(--raio);
  background: var(--branco); box-shadow: var(--sombra-sm); overflow: hidden;
}
.cli-painel.oculto { display: none; }
.cli-painel input[type="search"] { border: none; border-bottom: 1px solid var(--cinza-100); border-radius: 0; }
.cli-painel input[type="search"]:focus { box-shadow: none; }
.cli-resultados { max-height: 260px; overflow-y: auto; }
.cli-op {
  display: block; width: 100%; text-align: left; background: none; border: none;
  border-bottom: 1px solid var(--cinza-100); padding: 9px 12px; cursor: pointer;
}
.cli-op:last-child { border-bottom: none; }
.cli-op:hover { background: var(--cinza-50); }
.cli-op.atual { background: var(--azul-claro); }
.cli-op strong { display: block; font-size: 12.5px; color: var(--cinza-800); }
.cli-op span   { display: block; font-size: 11px; color: var(--cinza-500); margin-top: 1px; }
.cli-vazio { padding: 16px 12px; font-size: 12px; color: var(--cinza-600); line-height: 1.5; }
.campo-dica { display: block; font-size: 11.5px; color: var(--cinza-500); margin-top: 5px; line-height: 1.5; }
.campo-dica-alerta { color: var(--amarelo); background: var(--amarelo-claro); border-radius: 6px; padding: 7px 10px; }

/* ── Módulo Comunicação ────────────────────────────────────────────────────── */
.com-busca { display: flex; gap: 10px; padding: 14px 20px 0; flex-wrap: wrap; }
.com-busca input { flex: 1; min-width: 220px; }
.com-busca select { min-width: 170px; }

.com-lista { padding: 14px 20px 18px; display: grid; gap: 8px; }
.com-item {
  display: flex; align-items: center; gap: 14px; cursor: pointer;
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-left: 3px solid var(--cinza-300); border-radius: 8px; padding: 10px 14px;
  transition: box-shadow .15s, border-color .15s;
}
.com-item:hover { box-shadow: var(--sombra-sm); border-color: var(--cinza-300); }
.com-item.st-enviado    { border-left-color: var(--verde); }
.com-item.st-falhou     { border-left-color: var(--vermelho); background: #FFFBFB; }
.com-item.st-descartado { border-left-color: var(--amarelo); }

.com-item-data { min-width: 78px; flex-shrink: 0; }
.com-item-data strong { display: block; font-size: 12px; color: var(--cinza-800); }
.com-item-data span   { font-size: 11px; color: var(--cinza-500); }
.com-item-corpo { flex: 1; min-width: 0; }
.com-item-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 2px; }
.com-item-topo strong { font-size: 12.5px; color: var(--cinza-800); }
.com-item-sub { font-size: 11.5px; color: var(--cinza-600); }
.com-item-motivo { font-size: 11px; color: var(--vermelho); margin-top: 3px; }
.com-item-seta { font-size: 20px; color: var(--cinza-300); flex-shrink: 0; }
.com-item:hover .com-item-seta { color: var(--azul); }

.com-selo {
  font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap;
}
.com-selo.enviado    { background: var(--verde-claro);    color: var(--verde); }
.com-selo.falhou     { background: var(--vermelho-claro); color: var(--vermelho); }
.com-selo.descartado { background: var(--amarelo-claro);  color: var(--amarelo); }
.com-selo.manual     { background: var(--azul-claro);     color: var(--azul); }
.com-selo.neutro     { background: var(--cinza-100);      color: var(--cinza-600); }

.com-tabela-meses { font-size: 12px; }
.com-tabela-meses td, .com-tabela-meses th { padding: 7px 10px; }

.com-modal-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.com-modal-motivo {
  background: var(--vermelho-claro); color: var(--vermelho); border-radius: 8px;
  padding: 9px 12px; font-size: 12px; margin-bottom: 12px; line-height: 1.5;
}
/* O texto sai exatamente como foi enviado — é a prova do que foi dito. */
.com-modal-msg {
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 10px;
  padding: 14px 16px; font-size: 12.5px; line-height: 1.65; color: var(--cinza-800);
  white-space: pre-wrap; max-height: 420px; overflow-y: auto;
}

/* Explicação da parcela isolada em aberto. Sem ela a equipe abre a grade, vê as
   parcelas seguintes verdes e conclui que o alerta é falso. */
.parc-card-lacuna {
  background: var(--amarelo-claro); border: 1px solid #F0D9AE; border-left: 3px solid var(--amarelo);
  border-radius: 7px; padding: 8px 11px; margin: 8px 0 2px;
  font-size: 11.5px; line-height: 1.5; color: var(--cinza-700, var(--cinza-600));
}
.parc-card-lacuna b { display: block; color: var(--amarelo); margin-bottom: 2px; }

/* ── Auditoria do cadastro ─────────────────────────────────────────────────── */
/* KPI clicável: só ganha afordância quando há o que filtrar. Card com zero fica
   esmaecido e inerte, porque clicar e receber lista vazia parece defeito. */
.stat-card.clicavel { cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.stat-card.clicavel:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(20,24,48,.09); }
.stat-card.clicavel.ativo { border-color: var(--azul); box-shadow: 0 0 0 2px var(--azul-claro); }
.stat-card.vazio { opacity: .55; }

/* ── Auditoria do cadastro: campos faltando ────────────────────────────────── */
/* Os cartões por campo são o protagonista: quando quase todo mundo tem o mesmo
   buraco, a lista individual não ajuda — o que resolve é mutirão de um campo
   por vez. Por isso são clicáveis e filtram a lista abaixo. */
.aud-campos {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: 11px; padding: 16px 20px 6px;
}
.aud-campo {
  text-align: left; background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: var(--raio); padding: 12px 14px; cursor: pointer; font: inherit;
  border-left-width: 4px;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.aud-campo:hover { transform: translateY(-2px); background: var(--branco); box-shadow: 0 5px 14px rgba(20,24,48,.08); }
.aud-campo.ativo { background: var(--azul-claro); border-color: var(--azul); }
.aud-campo.nv-essencial    { border-left-color: var(--bordo); }
.aud-campo.nv-importante   { border-left-color: var(--amarelo); }
.aud-campo.nv-complementar { border-left-color: var(--cinza-300); }
.aud-campo-num  { display: block; font-size: 24px; font-weight: 700; color: var(--cinza-800); line-height: 1.1; }
.aud-campo-nome { display: block; font-size: 12.5px; font-weight: 600; color: var(--cinza-800); margin-top: 2px; }
.aud-campo-nivel {
  display: inline-block; font-size: 9.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .4px; padding: 2px 7px; border-radius: 99px; margin-top: 5px;
  background: var(--cinza-200); color: var(--cinza-600);
}
.aud-campo.nv-essencial  .aud-campo-nivel { background: var(--bordo-claro);   color: var(--bordo); }
.aud-campo.nv-importante .aud-campo-nivel { background: var(--amarelo-claro); color: var(--amarelo); }
.aud-campo-porque {
  display: block; font-size: 11px; color: var(--cinza-500); margin-top: 6px; line-height: 1.45;
}

.aud-lista { display: grid; gap: 7px; padding: 16px 20px 4px; }
.aud-item {
  display: flex; align-items: center; gap: 12px; cursor: pointer;
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: var(--raio);
  padding: 10px 14px; border-left-width: 4px;
  transition: box-shadow .12s ease, border-color .12s ease;
}
.aud-item:hover { box-shadow: 0 4px 12px rgba(20,24,48,.08); border-color: var(--azul); }
.aud-item.critico { border-left-color: var(--bordo); }
.aud-item.atencao { border-left-color: var(--amarelo); }
.aud-item.leve    { border-left-color: var(--cinza-300); }
.aud-item-nome {
  flex: 1; min-width: 0; font-size: 12.5px; font-weight: 600; color: var(--cinza-800);
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
}
.aud-item-cidade { font-weight: 400; font-size: 11px; color: var(--cinza-500); }
.aud-item-faltas { display: flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; max-width: 55%; }
.aud-falta {
  font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 99px; white-space: nowrap;
  background: var(--cinza-100); color: var(--cinza-600);
}
.aud-falta.nv-essencial  { background: var(--bordo-claro);   color: var(--bordo); }
.aud-falta.nv-importante { background: var(--amarelo-claro); color: var(--amarelo); }

@media (max-width: 720px) {
  .aud-item { flex-direction: column; align-items: flex-start; }
  .aud-item-faltas { max-width: 100%; justify-content: flex-start; }
}

/* ── Análise de clientes duplicados ────────────────────────────────────────── */
.dup-resumo {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 10px; margin: 4px 0 16px;
}
.dup-resumo > div {
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: var(--raio); padding: 11px 12px; text-align: center;
}
.dup-resumo strong { display: block; font-size: 22px; color: var(--cinza-800); line-height: 1.1; }
.dup-resumo span   { display: block; font-size: 11px; color: var(--cinza-500); margin-top: 3px; }
.dup-resumo .grave  { background: var(--bordo-claro);   border-color: #EFC6D2; }
.dup-resumo .grave strong  { color: var(--bordo); }
.dup-resumo .alerta { background: var(--amarelo-claro); border-color: #F0D9AE; }
.dup-resumo .alerta strong { color: var(--amarelo); }

.dup-aviso {
  background: var(--azul-claro); border: 1px solid #CBD2F2; border-radius: var(--raio);
  padding: 11px 14px; font-size: 12px; color: var(--cinza-600);
  line-height: 1.55; margin-bottom: 16px;
}
.dup-aviso strong { color: var(--cinza-800); }

.dup-grupo {
  border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 14px 16px; margin-bottom: 14px; background: var(--branco);
  border-left-width: 4px;
}
.dup-grupo.nivel-confirmado { border-left-color: var(--bordo); }
.dup-grupo.nivel-provavel   { border-left-color: var(--amarelo); }
.dup-grupo.nivel-possivel   { border-left-color: var(--azul); }
.dup-grupo-cab { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.dup-nivel {
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
  padding: 3px 9px; border-radius: 99px;
}
.dup-nivel.bordo  { background: var(--bordo-claro);   color: var(--bordo); }
.dup-nivel.alerta { background: var(--amarelo-claro); color: var(--amarelo); }
.dup-nivel.azul   { background: var(--azul-claro);    color: var(--azul); }
.dup-grupo-motivo { font-size: 12px; color: var(--cinza-600); font-weight: 600; }
.dup-grupo-dica   { font-size: 11.5px; color: var(--cinza-500); margin: 6px 0 11px; line-height: 1.5; }

.dup-cli {
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: var(--raio); padding: 10px 12px; margin-bottom: 8px;
}
.dup-cli.manter { background: var(--verde-claro); border-color: #BFE3CB; }
.dup-cli.inativo { opacity: .72; }
.dup-cli-topo { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.dup-cli-topo strong { font-size: 13px; color: var(--cinza-800); }
.dup-tag {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px;
  padding: 2px 7px; border-radius: 99px;
}
.dup-tag.manter  { background: var(--verde); color: #fff; }
.dup-tag.inativo { background: var(--cinza-200); color: var(--cinza-600); }
.dup-cli-meta { font-size: 11.5px; color: var(--cinza-600); margin-top: 3px; }
.dup-cli-meta em { color: var(--cinza-500); }
.dup-cli-vinc { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 7px; }
.dup-cli-vinc span {
  font-size: 10.5px; background: var(--branco); border: 1px solid var(--cinza-200);
  color: var(--cinza-600); border-radius: 99px; padding: 2px 8px;
}
.dup-cli-vinc .dup-vazio {
  background: none; border: none; color: var(--cinza-500); font-style: italic; padding: 0;
}

/* Matriz/filial em verde: é resultado CERTO, não pendência. */
.dup-filial {
  background: var(--verde-claro); border: 1px solid #BFE3CB; border-radius: var(--raio-lg);
  padding: 13px 16px; margin-top: 6px;
}
.dup-filial-cab { font-size: 12.5px; color: var(--cinza-800); margin-bottom: 4px; }
.dup-filial p   { font-size: 11.5px; color: var(--cinza-600); margin: 0 0 10px; line-height: 1.5; }
.dup-filial-grupo { background: var(--branco); border-radius: 8px; padding: 9px 11px; margin-bottom: 7px; }
.dup-filial-motivo {
  display: block; font-size: 10.5px; color: var(--cinza-500);
  text-transform: uppercase; letter-spacing: .3px; margin-bottom: 5px;
}
.dup-filial-cli { font-size: 12px; color: var(--cinza-800); padding: 2px 0; }
.dup-filial-cli span { color: var(--cinza-500); font-size: 11px; margin-left: 6px; }

.dup-rodape {
  font-size: 11.5px; color: var(--cinza-600); line-height: 1.6;
  background: var(--cinza-50); border-radius: var(--raio); padding: 11px 14px; margin-top: 14px;
}

/* Diagnóstico de contatos — faixa antes dos números, porque explica o silêncio */
.com-contatos {
  display: flex; gap: 12px; align-items: flex-start;
  border-radius: var(--raio); padding: 13px 16px; margin-bottom: 16px;
  font-size: 12.5px; line-height: 1.55; border: 1px solid transparent;
}
.com-contatos.ok     { background: var(--verde-claro);    border-color: #BFE3CB; color: var(--cinza-800); }
.com-contatos.alerta { background: var(--amarelo-claro);  border-color: #F0D9AE; color: var(--cinza-800); }
.com-contatos.aviso  { background: var(--azul-claro);     border-color: #CBD2F2; color: var(--cinza-800); }
.com-contatos-icone { font-size: 16px; line-height: 1.3; }
.com-contatos strong { display: block; margin-bottom: 2px; }
.com-contatos span   { color: var(--cinza-600); font-size: 11.5px; }
.com-contatos-corpo { flex: 1; }
.com-ct-acoes {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px;
}
.com-ct-acoes .btn-secundario { font-size: 12px; padding: 6px 12px; }
.com-ct-dica { font-size: 11px; color: var(--cinza-600); flex: 1; min-width: 200px; }

.com-ct-det { margin-top: 8px; }
.com-ct-det summary {
  cursor: pointer; font-size: 11.5px; font-weight: 600; color: var(--azul);
  list-style: none; display: inline-block; padding: 3px 0;
}
.com-ct-det summary::-webkit-details-marker { display: none; }
.com-ct-det summary::before { content: '▸ '; }
.com-ct-det[open] summary::before { content: '▾ '; }
.com-ct-grupo {
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
  color: var(--cinza-500); margin: 10px 0 5px;
}
.com-ct-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.com-ct-item {
  background: var(--branco); border-radius: 7px; padding: 8px 11px;
  border-left: 3px solid var(--cinza-300);
}
.com-ct-item.invalido    { border-left-color: var(--amarelo); }
.com-ct-item.sem_contato { border-left-color: var(--cinza-300); }
.com-ct-nome { font-size: 12px; font-weight: 600; color: var(--cinza-800); }
.com-ct-campo {
  font-weight: 400; font-size: 10.5px; color: var(--cinza-500);
  background: var(--cinza-100); border-radius: 99px; padding: 1px 7px; margin-left: 6px;
}
.com-ct-motivo { font-size: 11.5px; color: var(--cinza-600); margin-top: 2px; }
.com-ct-onde   { font-size: 10.5px; color: var(--cinza-500); margin-top: 3px; }

/* Navegador de competência — o recorte é o mês, não uma janela móvel */
.com-mesnav {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px;
}
.com-mesnav-btn {
  width: 32px; height: 32px; border-radius: 8px; cursor: pointer;
  background: var(--branco); border: 1px solid var(--cinza-200);
  color: var(--cinza-800); font-size: 18px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s ease, border-color .12s ease;
}
.com-mesnav-btn:hover:not(.off) { background: var(--azul-claro); border-color: var(--azul); color: var(--azul); }
.com-mesnav-btn.off { opacity: .35; cursor: default; }
.com-mesnav-atual { min-width: 190px; }
.com-mesnav-atual strong { display: block; font-size: 15px; color: var(--cinza-800); line-height: 1.2; }
.com-mesnav-atual span   { display: block; font-size: 11px; color: var(--cinza-500); margin-top: 1px; }

/* ── Dashboard de Comunicação ──────────────────────────────────────────────── */

/* Seletor de público / janela: reaproveita .filtro-solicitacoes, só ganha
   respiro próprio por ficar solto entre a sub-aba e os cards. */
.com-publico { margin: 0 0 16px; }

/* PARA QUEM — dois cards lado a lado. Duas caixas, duas consequências. */
.com-publico-split {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px; margin-bottom: 18px;
}
.com-pub-card {
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 16px 18px; box-shadow: var(--sombra-sm); cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.com-pub-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(20,24,48,.09); }
.com-pub-cliente:hover { border-color: var(--bordo); }
.com-pub-equipe:hover  { border-color: var(--azul); }
.com-pub-topo { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.com-pub-icone { font-size: 20px; line-height: 1; }
.com-pub-topo strong { display: block; font-size: 13px; color: var(--cinza-800); }
.com-pub-topo span   { display: block; font-size: 11px; color: var(--cinza-500); margin-top: 1px; }
.com-pub-num { font-size: 30px; font-weight: 700; color: var(--cinza-800); line-height: 1.1; }
.com-pub-barra {
  height: 7px; background: var(--cinza-100); border-radius: 99px; overflow: hidden; margin: 10px 0 8px;
}
.com-pub-barra > div { height: 100%; border-radius: 99px; background: var(--cinza-300); }
.com-pub-cliente .com-pub-barra > div { background: var(--bordo); }
.com-pub-equipe  .com-pub-barra > div { background: var(--azul); }
.com-pub-rodape {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 11.5px; color: var(--cinza-500);
}
.com-pub-falha { color: var(--bordo); font-weight: 600; }

/* DE ONDE VEM — grid de módulos. minmax(200px) dá 4-5 por linha em tela larga
   e nunca quebra os rótulos longos ("Senhas e Acessos", "Controle de Ponto"). */
.com-mod-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px; padding: 16px 20px 4px;
}
.com-mod-card {
  background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: var(--raio);
  padding: 13px 14px; cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.com-mod-card:hover {
  transform: translateY(-2px); background: var(--branco);
  border-color: var(--azul); box-shadow: 0 5px 14px rgba(20,24,48,.08);
}
.com-mod-topo { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.com-mod-icone { font-size: 15px; line-height: 1; }
.com-mod-topo strong {
  font-size: 12px; color: var(--cinza-800); line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.com-mod-num { font-size: 24px; font-weight: 700; color: var(--azul); line-height: 1.1; }
.com-mod-barra {
  height: 5px; background: var(--cinza-200); border-radius: 99px; overflow: hidden; margin: 8px 0 9px;
}
.com-mod-barra > div { height: 100%; background: var(--azul); border-radius: 99px; }
.com-mod-split { display: flex; gap: 5px; flex-wrap: wrap; }
.com-mod-split span {
  font-size: 10.5px; font-weight: 600; padding: 2px 7px; border-radius: 99px; white-space: nowrap;
}
.com-chip-cli   { background: var(--bordo-claro); color: var(--bordo); }
.com-chip-eq    { background: var(--azul-claro);  color: var(--azul); }
.com-chip-falha { background: var(--vermelho-claro); color: var(--vermelho); }

/* QUANTO AO LONGO DO TEMPO — barras empilhadas COM o número em cima.
   Cor sozinha não é dado: o valor fica legível sem passar o mouse. */
.com-serie {
  display: flex; align-items: flex-end; gap: 6px;
  padding: 20px 20px 0; min-height: 190px; overflow-x: auto;
}
.com-serie-col { flex: 1; min-width: 40px; display: flex; flex-direction: column; align-items: center; }
.com-serie-valor {
  font-size: 11.5px; font-weight: 700; color: var(--cinza-800); margin-bottom: 5px; min-height: 15px;
}
.com-serie-barra {
  width: 100%; max-width: 46px; height: 120px; display: flex; flex-direction: column-reverse;
  background: var(--cinza-100); border-radius: 6px 6px 0 0; overflow: hidden;
}
.com-serie-cli { width: 100%; background: var(--bordo); }
.com-serie-eq  { width: 100%; background: var(--azul); }
/* O mês corrente é tracejado porque ainda não fechou — comparar o parcial com
   meses inteiros faria parecer queda onde só falta o mês terminar. */
.com-serie-col.corrente .com-serie-barra {
  border: 1px dashed var(--cinza-300); background: repeating-linear-gradient(
    45deg, var(--cinza-50), var(--cinza-50) 4px, var(--cinza-100) 4px, var(--cinza-100) 8px);
}
.com-serie-col.corrente .com-serie-mes { font-style: italic; color: var(--cinza-500); }
.com-serie-mes {
  font-size: 10.5px; color: var(--cinza-600); margin-top: 6px; white-space: nowrap;
}
.com-legenda {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 14px 20px 18px; font-size: 11.5px; color: var(--cinza-600);
}
.com-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; }
.com-legenda i.lg-cli { background: var(--bordo); }
.com-legenda i.lg-eq  { background: var(--azul); }
.com-legenda-nota { color: var(--cinza-500); font-size: 11px; }

@media (max-width: 720px) {
  .com-serie { min-height: 160px; }
  .com-serie-barra { height: 90px; }
  .com-serie-col { min-width: 34px; }
}

.parc-aviso-filtro {
  background: var(--azul-claro); border-radius: 8px; padding: 9px 14px;
  margin-bottom: 14px; font-size: 12px; color: var(--cinza-600);
}
.parc-aviso-filtro strong { color: var(--azul); }
.parc-aviso-filtro button {
  margin-left: 8px; background: none; border: none; color: var(--azul);
  font-size: 11.5px; text-decoration: underline; cursor: pointer; padding: 0;
}

/* Card do dashboard que abre a lista. A seta indica que dá para clicar sem
   precisar de instrução escrita; o card com zero não tem seta nem cursor. */
.parc-pdo-card { position: relative; cursor: pointer; transition: box-shadow .15s, border-color .15s; }
.parc-pdo-card:hover { box-shadow: var(--sombra-md); border-color: var(--cinza-300); }
.parc-pdo-seta {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  font-size: 20px; color: var(--cinza-300); line-height: 1;
}
.parc-pdo-card:hover .parc-pdo-seta { color: var(--azul); }
.stat-card-zero { opacity: .5; }

/* O número em cima da barra: cor mostra a proporção, o número diz quanto. */
.parc-graf { display: flex; align-items: flex-end; gap: 6px; height: 140px; }
.parc-graf-col { flex: 1; display: flex; align-items: flex-end; height: 100%; }
.parc-bar-wrap { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; }
.parc-bar-num {
  font-size: 10.5px; font-weight: 700; color: var(--cinza-600);
  text-align: center; margin-bottom: 3px;
}
.parc-graf-tabela { font-size: 12px; margin-top: 4px; }
.parc-graf-tabela td, .parc-graf-tabela th { padding: 6px 10px; }
.parc-graf-tabela .parc-tag-corrente {
  font-size: 9.5px; font-weight: 600; background: var(--cinza-100); color: var(--cinza-600);
  padding: 1px 6px; border-radius: 4px; margin-left: 4px;
}
.parc-linha-corrente { background: var(--cinza-50); }
.parc-linha-total { background: var(--cinza-50); border-top: 2px solid var(--cinza-200); }
.parc-linha-total small { display: block; font-size: 9.5px; color: var(--cinza-500); font-weight: 400; }
.parc-bar {
  width: 100%; display: flex; flex-direction: column; justify-content: flex-end;
  border-radius: 3px 3px 0 0; overflow: hidden; min-height: 2px;
}
.parc-bar.vazio { height: 3px !important; background: var(--cinza-200); }
.parc-bar.corrente { outline: 2px dashed var(--cinza-300); outline-offset: 1px; }
.parc-bar-seg.ok        { background: var(--verde); }
.parc-bar-seg.atencao   { background: #EF9F27; }
.parc-bar-seg.problema  { background: var(--vermelho); }
.parc-bar-seg.recalculo { background: #378ADD; }
.parc-graf-eixo { display: flex; gap: 6px; margin: 6px 0 12px; }
.parc-graf-eixo span { flex: 1; text-align: center; font-size: 10px; color: var(--cinza-500); }
.parc-graf-eixo span.corrente { color: var(--cinza-800); font-weight: 700; }

/* Demanda por cliente: lista curta, não tabela. Só quem concentra trabalho —
   dezenas de clientes com 1 parcelamento rodando liso são rotina, e a lista
   completa já existe na Grade. */
.parc-dem-lista { display: grid; gap: 8px; margin-bottom: 12px; }
.parc-dem-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: var(--cinza-50); border-radius: 8px; padding: 10px 12px;
}
.parc-dem-nome { font-size: 12.5px; font-weight: 600; color: var(--cinza-800); }
.parc-dem-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.parc-dem-chip {
  font-size: 10.5px; padding: 2px 8px; border-radius: 4px;
  background: var(--branco); color: var(--cinza-600); border: 1px solid var(--cinza-200);
}
.parc-dem-chip.info   { background: var(--azul-claro);    color: var(--azul);    border-color: transparent; }
.parc-dem-chip.alerta { background: var(--vermelho-claro); color: var(--vermelho); border-color: transparent; }

@media (max-width: 900px) {
  .parc-pdo-duplo { grid-template-columns: 1fr; }
}



/* ── Opt-in de aviso ao cliente na criação do parcelamento ─────────────────── */
.parc-avisar {
  display: flex; align-items: flex-start; gap: 10px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 10px; padding: 12px 14px; margin-bottom: 1rem;
  cursor: pointer;
}
.parc-avisar input { margin-top: 2px; flex-shrink: 0; }
.parc-avisar strong { display: block; font-size: 13px; margin-bottom: 3px; }
.parc-avisar small  { display: block; font-size: 11.5px; color: var(--cinza-600); line-height: 1.5; }

/* ── Diagnóstico das notificações ──────────────────────────────────────────── */
.parc-diag { border-radius: 10px; padding: 14px 16px; margin-bottom: 14px; font-size: 12.5px; }
.parc-diag-carregando { background: var(--cinza-100); color: var(--cinza-500); }
.parc-diag-ok        { background: var(--verde-claro);    border: 1px solid #BFE3CC; }
.parc-diag-bloqueado { background: var(--amarelo-claro);  border: 1px solid #F0D9AE; }
.parc-diag-erro      { background: var(--vermelho-claro); border: 1px solid #F5C6C6; }
.parc-diag-cab {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.parc-diag-selo { font-weight: 700; font-size: 13px; }
.parc-diag-num  { color: var(--cinza-600); font-size: 11.5px; }
.parc-diag-titulo {
  margin: 12px 0 6px; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: var(--cinza-600);
}
.parc-diag-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.parc-diag-item {
  background: var(--branco); border-radius: 8px; padding: 9px 12px;
  border-left: 3px solid var(--cinza-300);
}
.parc-diag-item.parc-diag-problema { border-left-color: var(--vermelho); }
.parc-diag-item.parc-diag-aviso    { border-left-color: var(--amarelo); }
.parc-diag-item strong { display: block; font-size: 12.5px; margin-bottom: 2px; }
.parc-diag-item span   { display: block; color: var(--cinza-600); line-height: 1.5; }
.parc-diag-item em     { display: block; margin-top: 4px; font-size: 11px; color: var(--azul); font-style: normal; font-weight: 600; }
.parc-diag-nota { margin: 10px 0 0; color: var(--cinza-600); line-height: 1.5; }

/* ── Notificações automáticas (dashboard de Parcelamentos) ─────────────────── */
.parc-notif {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
.parc-notif-item {
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-radius: 10px; padding: 14px 16px;
}
.parc-notif-cab {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 6px;
}
.parc-notif-cab strong { font-size: 13.5px; }
.parc-notif-quando {
  font-size: 11px; font-weight: 600; color: var(--azul);
  background: var(--azul-claro); border-radius: 999px; padding: 3px 10px;
  white-space: nowrap;
}
.parc-notif-item p {
  font-size: 12px; color: var(--cinza-600); line-height: 1.55; margin: 0 0 12px;
}
.parc-notif-item button { width: 100%; }
.parc-notif-nota {
  grid-column: 1 / -1;
  font-size: 11.5px; color: var(--cinza-500); line-height: 1.5; margin: 0;
}
@media (max-width: 900px) { .parc-notif { grid-template-columns: 1fr; } }

@media (max-width: 900px) {
  .parc-fin-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .parc-fin-cards { grid-template-columns: 1fr; }
  .parc-fin-esf-val { grid-template-columns: 1fr 1fr; }
}

/* Parcela lançada sem valor: risco diagonal discreto. Não grita, mas se vê. */
.parc-cel-sem-valor::after {
  content: '';
  position: absolute;
  top: 2px; right: 3px;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: rgba(255,255,255,.9);
  box-shadow: 0 0 0 1px rgba(0,0,0,.25);
}
.parc-cel { position: relative; }

/* Bloco financeiro da ficha */
.parc-ficha-fin { margin-bottom: 1.4rem; }
.parc-ffin-linha { display: grid; grid-template-columns: repeat(4, 1fr); gap: .7rem; margin-bottom: .7rem; }
.parc-ffin-linha > div { background: var(--cinza-50); border-radius: 8px; padding: .6rem .7rem; }
.parc-ffin-linha label {
  display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .3px;
  color: var(--cinza-500); font-weight: 700; margin-bottom: .15rem;
}
.parc-ffin-linha b { font-size: 14px; color: var(--cinza-800); }

.parc-ffin-pcts {
  display: flex; gap: 1rem; flex-wrap: wrap; align-items: baseline;
  font-size: 12px; color: var(--cinza-600); margin-bottom: .7rem;
}
.parc-ffin-pcts b { color: var(--cinza-800); font-size: 13.5px; }
.parc-ffin-pcts em { font-style: normal; font-size: 11px; color: var(--cinza-500); }

.parc-ffin-proj {
  background: var(--cinza-50); border: 1px dashed var(--cinza-300);
  border-radius: 8px; padding: .7rem .9rem;
  display: flex; gap: 1rem; align-items: flex-start; flex-wrap: wrap;
}
.parc-ffin-proj label { display: block; font-size: 10px; text-transform: uppercase; color: var(--cinza-500); font-weight: 700; }
.parc-ffin-proj b { font-size: 16px; color: var(--cinza-800); }
.parc-ffin-proj p { margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--cinza-600); flex: 1; min-width: 220px; }

.parc-ffin-diverg {
  margin-top: .6rem; padding: .65rem .9rem;
  background: #FAEEDA; border-left: 3px solid #BA7517; border-radius: 0 8px 8px 0;
}
.parc-ffin-diverg strong { font-size: 12.5px; color: #854F0B; }
.parc-ffin-diverg p { margin: .25rem 0 0; font-size: 11.5px; line-height: 1.5; color: var(--cinza-800); }

.parc-ffin-aviso { margin: .6rem 0 0; font-size: 11.5px; color: var(--amarelo); font-weight: 600; }

/* Aviso de divergência no dashboard */
.parc-fin-diverg {
  margin-top: .8rem; padding: .8rem 1.1rem;
  background: #FAEEDA; border: 1px solid #EF9F27;
  border-left: 4px solid #BA7517; border-radius: 0 var(--raio) var(--raio) 0;
}
.parc-fin-diverg strong { font-size: 13px; color: #854F0B; }
.parc-fin-diverg p { margin: .3rem 0 0; font-size: 12.5px; line-height: 1.55; color: var(--cinza-800); }

.parc-fc-parcelado { border-top-color: #7C3AED; }

@media (max-width: 700px) { .parc-ffin-linha { grid-template-columns: repeat(2, 1fr); } }

/* ── Dashboard de gestão do módulo Parcelamentos ─────────────────────────── */

.parc-kpi-sub { font-size: 10.5px; color: var(--cinza-500); margin-top: 2px; line-height: 1.3; }
.parc-kpi-ok  { border-color: var(--verde) !important; background: var(--verde-claro); }
.parc-dot-ok  { background: var(--verde); }

/* Valor exposto — o número que muda a ordem de prioridade da cobrança */
.parc-exposicao {
  display: flex; gap: 1.2rem; align-items: flex-start; flex-wrap: wrap;
  padding: .9rem 1.1rem; margin-bottom: 1.1rem;
  background: var(--vermelho-claro); border: 1px solid #f5b5b5;
  border-left: 4px solid var(--vermelho); border-radius: 0 var(--raio) var(--raio) 0;
}
.parc-exp-num label {
  display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px;
  color: var(--vermelho); font-weight: 700;
}
.parc-exp-num strong { font-size: 22px; font-weight: 800; color: var(--vermelho); line-height: 1.1; }
.parc-exposicao p { margin: 0; flex: 1; min-width: 260px; font-size: 12px; line-height: 1.55; color: var(--cinza-800); }

/* Blocos recolhíveis de gestão */
.parc-bloco-gestao {
  background: var(--branco); border: 1px solid var(--cinza-200);
  border-radius: var(--raio); margin-bottom: .8rem; overflow: hidden;
}
.parc-bloco-gestao summary {
  padding: .75rem 1.1rem; cursor: pointer; font-size: 13px; font-weight: 600;
  color: var(--cinza-800); user-select: none; list-style: none;
}
.parc-bloco-gestao summary::-webkit-details-marker { display: none; }
.parc-bloco-gestao summary::before { content: '▸ '; color: var(--cinza-500); }
.parc-bloco-gestao[open] summary::before { content: '▾ '; }
.parc-bloco-gestao summary:hover { background: var(--cinza-50); }
.parc-bloco-gestao summary span {
  font-weight: 400; color: var(--cinza-500); font-size: 11.5px; margin-left: .4rem;
}
.parc-bloco-gestao summary span::before { content: '· '; }

.parc-gestao-lista { border-top: 1px solid var(--cinza-200); }
.parc-gestao-item {
  display: grid; grid-template-columns: minmax(0,1fr) auto auto;
  gap: .8rem; align-items: center;
  padding: .6rem 1.1rem; border-bottom: 1px solid var(--cinza-100);
}
.parc-gestao-item:last-child { border-bottom: none; }
.parc-gestao-item:hover { background: var(--cinza-50); }
.parc-gestao-nome {
  font-size: 12.5px; font-weight: 600; color: var(--cinza-800);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.parc-gestao-chips { display: flex; gap: .3rem; flex-wrap: wrap; }
.parc-gc {
  padding: .15rem .5rem; border-radius: 999px; font-size: 10.5px; font-weight: 700;
  background: var(--cinza-100); color: var(--cinza-600); white-space: nowrap;
}
.parc-gc-iminente { background: var(--vermelho-claro); color: var(--vermelho); }
.parc-gc-critico  { background: #FAEEDA;               color: #854F0B; }
.parc-gc-atencao  { background: var(--amarelo-claro);  color: var(--amarelo); }
.parc-gestao-valor {
  font-size: 12.5px; font-weight: 700; color: var(--cinza-800);
  white-space: nowrap; text-align: right; min-width: 92px;
}
.parc-gestao-nota {
  margin: 0; padding: .6rem 1.1rem; font-size: 11.5px; line-height: 1.5;
  color: var(--cinza-600); background: var(--cinza-50); border-top: 1px solid var(--cinza-200);
}

@media (max-width: 640px) {
  .parc-gestao-item { grid-template-columns: 1fr; gap: .3rem; }
  .parc-gestao-valor { text-align: left; }
}

/* ---------- Tela de detalhamento dos cards do Dashboard Financeiro (fin_detalhe, 20/09) ---------- */
.fdet-header { display: flex; flex-direction: column; gap: 14px; margin-bottom: 26px; }
.fdet-voltar {
  align-self: flex-start; background: none; border: none; color: var(--azul); font-size: 13.5px;
  font-weight: 600; cursor: pointer; padding: 0;
}
.fdet-voltar:hover { text-decoration: underline; }
.fdet-titulo-bloco { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.fdet-titulo-linha { display: flex; align-items: center; gap: 12px; }
.fdet-titulo { margin: 0; font-size: 22px; font-weight: 700; color: var(--cinza-800); }
.fdet-subtitulo { margin: 4px 0 0 50px; color: var(--cinza-500); font-size: 13.5px; }
/* Só o rótulo de competência ("Setembro de 2026") é Title Case por natureza — o
   texto estático (frase explicando o card) não pode virar "Cada Palavra Maiúscula". */
.fdet-subtitulo-capitalize { text-transform: capitalize; }
.fdet-competencia-input { padding: 8px 12px; border: 1px solid var(--cinza-300); border-radius: 8px; font-size: 14px; font-family: inherit; }

.fdet-secao {
  background: white; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg);
  padding: 20px 22px; margin-bottom: 18px; box-shadow: var(--sombra-sm);
}
.fdet-secao-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.fdet-secao-cabecalho h3 { margin: 0; font-size: 15px; font-weight: 700; color: var(--cinza-800); }
.fdet-secao-total { font-size: 16px; font-weight: 800; color: var(--azul); }
.fdet-linha-risco td { color: var(--vermelho); }

.fdet-duas-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.fdet-coluna-titulo { font-size: 13px; font-weight: 700; color: var(--cinza-600); margin: 0 0 10px; }
.fdet-lista-simples { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.fdet-lista-simples li { font-size: 13.5px; color: var(--cinza-700); padding-bottom: 9px; border-bottom: 1px solid var(--cinza-100); }
.fdet-lista-simples li:last-child { border-bottom: none; padding-bottom: 0; }

@media (max-width: 720px) {
  .fdet-duas-colunas { grid-template-columns: 1fr; }
  .fdet-subtitulo { margin-left: 0; }
}

/* ══════ Plano de Contas — barra de busca e importação (20/09) ══════ */
/* A lista passou de 170 linhas depois da migração do plano de contas da Conexa, então
   busca e contagem deixaram de ser conforto e viraram requisito de uso. */
.fin-cat-barra { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 1rem; }
.fin-cat-barra #fin-cat-busca { flex: 1 1 260px; max-width: 360px; }
.fin-cat-contador { font-size: 12.5px; color: var(--cinza-600); font-weight: 600; }
.fin-cat-acoes { margin-left: auto; display: flex; gap: 8px; }

/* Prévia da importação — cada aviso tem cor por natureza: informação do que foi
   ajustado, atenção para o que não entra, verde para conclusão, vermelho para falha. */
.ic-aviso { border-radius: var(--raio); padding: 12px 14px; margin: 12px 0; font-size: 13px; line-height: 1.55; }
.ic-aviso strong { display: block; margin-bottom: 4px; }
.ic-aviso p strong, .ic-aviso li strong { display: inline; margin-bottom: 0; }   /* só o TÍTULO do aviso é bloco; negrito no meio do texto fica na linha */
.ic-aviso ul { margin: 6px 0 0; padding-left: 18px; }
.ic-aviso li { margin-bottom: 3px; }
.ic-aviso em { color: var(--cinza-600); font-style: normal; font-size: 12px; }
.ic-aviso-info { background: var(--azul-claro); color: var(--cinza-800); }
.ic-aviso-atencao { background: var(--amarelo-claro); color: var(--cinza-800); }
.ic-aviso-ok { background: var(--verde-claro); color: var(--cinza-800); }
.ic-aviso-erro { background: var(--vermelho-claro); color: var(--vermelho); }
.ic-de { color: var(--cinza-600); text-decoration: line-through; }

/* Grupos da prévia: a subcategoria aparece como chip para caber muita coisa sem virar
   uma lista de 160 linhas dentro do modal. */
.ic-grupos { max-height: 320px; overflow-y: auto; border: 1px solid var(--cinza-200); border-radius: var(--raio); padding: 4px; }
.ic-grupo { padding: 10px 12px; border-bottom: 1px solid var(--cinza-100); }
.ic-grupo:last-child { border-bottom: none; }
.ic-grupo-mae { font-weight: 700; font-size: 13px; color: var(--cinza-800); margin-bottom: 6px; }
.ic-grupo-qtd { font-weight: 500; font-size: 11.5px; color: var(--cinza-500); margin-left: 4px; }
.ic-tag-nova, .ic-tag-existe { font-size: 10px; font-weight: 700; text-transform: uppercase; padding: 1px 6px; border-radius: 20px; margin-left: 4px; }
.ic-tag-nova { background: var(--verde-claro); color: var(--verde); }
.ic-tag-existe { background: var(--cinza-100); color: var(--cinza-600); }
.ic-grupo-subs { display: flex; flex-wrap: wrap; gap: 5px; }
.ic-sub { font-size: 11.5px; background: var(--cinza-50); border: 1px solid var(--cinza-200); color: var(--cinza-600); padding: 2px 8px; border-radius: 20px; }

/* ══════ Importação de contratos — problemas agrupados por motivo (20/09) ══════ */
/* Cada motivo vira UMA linha com a contagem em destaque: "82 — falta o centro de custo" leva
   à ação (preencher Padrões); 82 linhas soltas, não. */
.ic-padroes { list-style: none; padding-left: 0; margin: 6px 0 0; }
.ic-padroes li { margin-bottom: 2px; }
.ic-problema { padding: 8px 0; border-top: 1px solid rgba(0,0,0,.08); }
.ic-problema:first-of-type { border-top: none; }
.ic-problema-topo { font-weight: 600; color: var(--cinza-800); }
.ic-problema-qtd { display: inline-block; min-width: 28px; text-align: center; background: var(--vermelho-claro); color: var(--vermelho); font-weight: 700; border-radius: 20px; padding: 1px 8px; margin-right: 6px; }
.ic-problema-ex { font-size: 12px; color: var(--cinza-600); margin: 3px 0 0 38px; line-height: 1.45; }

/* Lista completa de cada problema da importação: CNPJ, valor e o que fazer com a linha. */
.ic-detalhe { margin: 6px 0 0 38px; }
.ic-detalhe > summary { cursor: pointer; font-size: 12px; font-weight: 600; color: var(--azul); }
.ic-tabela { width: 100%; border-collapse: collapse; margin-top: 6px; font-size: 12px; }
.ic-tabela th { text-align: left; font-weight: 700; color: var(--cinza-600); padding: 4px 8px 4px 0; border-bottom: 1px solid rgba(0,0,0,.12); }
.ic-tabela td { padding: 6px 8px 6px 0; border-bottom: 1px solid rgba(0,0,0,.06); vertical-align: top; line-height: 1.4; }
.ic-tabela .num { text-align: right; }
.ic-nowrap { white-space: nowrap; }

/* ══════ Contratos — filtros e linhas de apoio (20/09) ══════ */
.fin-ctr-filtros [hidden] { display: none; }
.fin-ctr-campo-busca { min-width: 260px; max-width: 340px; flex: 1 1 260px; }
.fin-ctr-contador { font-size: 12.5px; color: var(--cinza-600); margin: -6px 2px 10px; }
.fin-ctr-filtrado { display: inline-block; background: var(--azul-claro); color: var(--azul); font-weight: 700; font-size: 10.5px; text-transform: uppercase; padding: 1px 7px; border-radius: 20px; margin-left: 4px; }
/* Linha de apoio sob o nome do cliente (CNPJ / endereço que casou com a busca). */
.fin-ctr-sub { font-size: 11.5px; color: var(--cinza-600); font-weight: 500; margin-top: 2px; line-height: 1.35; }
.fin-ctr-sem { color: var(--amarelo); font-weight: 600; }

/* Nome fantasia em destaque sob a razão social (lista e ficha de Contratos, 20/09). Azul + selo:
   é o nome pelo qual a equipe costuma reconhecer o cliente, então precisa saltar aos olhos sem
   competir com a razão social (que continua sendo o nome oficial, em negrito escuro). */
.fin-ctr-fantasia { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: 12.5px; font-weight: 700; color: var(--azul); line-height: 1.3; }
.fin-ctr-fantasia-rot { font-size: 9.5px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--azul); background: var(--azul-claro); border-radius: 20px; padding: 1px 7px; flex: none; }
.fin-ctr-ficha-cliente { margin: 0 0 2px; font-size: 14px; color: var(--cinza-800); }

/* Seletor de vários clientes do "Gerar faturamento do mês" (24/09) — busca + lista de
   caixas de seleção com rolagem própria, pra escolher só alguns clientes sem um
   <select multiple> (que exige Ctrl/Cmd e ninguém descobre). */
.frp-clientes { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.frp-clientes-cab { display: flex; align-items: center; justify-content: space-between; }
.frp-clientes-titulo { font-size: 13px; font-weight: 600; color: var(--cinza-800); }
.frp-clientes-titulo small { font-weight: 400; color: var(--cinza-500); margin-left: 4px; }
.frp-lista {
  max-height: 220px; overflow-y: auto; border: 1px solid var(--cinza-300);
  border-radius: 8px; background: var(--branco);
}
.form-fin label.frp-item {
  flex-direction: row; align-items: center; gap: 10px; padding: 8px 12px;
  font-weight: 500; border-bottom: 1px solid var(--cinza-100); cursor: pointer;
}
.form-fin label.frp-item:last-child { border-bottom: none; }
.form-fin label.frp-item:hover { background: var(--azul-claro); }
.form-fin label.frp-item input { width: auto; padding: 0; }
.frp-nome { flex: 1; font-size: 13px; color: var(--cinza-800); }
.frp-cnpj { font-size: 11px; color: var(--cinza-500); font-variant-numeric: tabular-nums; }
.frp-vazio { padding: 16px; text-align: center; font-size: 13px; color: var(--cinza-500); margin: 0; }

/* ── Recebimentos em CARDS por cobrança (24/09) ─────────────────────────────────────────
   Mesma linguagem de Certificados/Licenças (barra lateral colorida pelo status, fundo que
   acompanha), um card por linha. Uma linha só por cobrança: Cliente, Competência,
   Vencimento, Quitação, Valor e Status, depois 👁 (ler o detalhe) e ✏️ (agir). O cabeçalho
   de colunas usa a MESMA grade dos cards, então alinha sem repetir rótulos em cada um. */
.fin-cob-lista, .fin-cob-colunas {
  --fcl-cols: 24px minmax(170px, 1fr) 92px 96px 108px 124px 150px 36px 36px;
}
.fin-cob-colunas {
  display: grid; grid-template-columns: var(--fcl-cols); gap: 10px; align-items: center;
  padding: 0 13px 6px 17px; font-size: 11.5px; font-weight: 600; color: var(--cinza-500);
}
.fin-cob-lista { display: flex; flex-direction: column; gap: 8px; }
.fin-cob-card {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: var(--fcl-cols); gap: 10px; align-items: center;
  padding: 10px 13px 10px 17px; font-size: 13.5px; color: var(--cinza-800);
  background: var(--branco); border: 1px solid var(--cinza-200); border-radius: 10px;
  transition: box-shadow .12s;
}
.fin-cob-card:hover { box-shadow: var(--sombra-md); }
.fin-cob-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--cinza-300); }
.fin-cob-card.fcc-vencido { background: var(--vermelho-claro); border-color: #F1C3C3; }
.fin-cob-card.fcc-vencido::before { background: var(--vermelho); }
.fin-cob-card.fcc-aberto::before { background: var(--azul); }
.fin-cob-card.fcc-pago { background: var(--verde-claro); border-color: #BFE0CA; }
.fin-cob-card.fcc-pago::before { background: var(--verde); }
.fin-cob-card.fcc-cancelado { opacity: .62; }
.fin-cob-card.fcc-cancelado::before { background: var(--cinza-400); }

.fcl-chk { display: flex; align-items: center; justify-content: center; }
.fcl-chk input { margin: 0; }
.fcl-cliente { min-width: 0; display: flex; flex-direction: column; }
.fcl-cliente strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fcl-sub { display: block; font-size: 11px; font-weight: 400; color: var(--cinza-500); line-height: 1.3; }
.fcl-nowrap { white-space: nowrap; }
.fcl-valor { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fcl-sit { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.fcl-acoes { display: flex; justify-content: center; }

/* Modal 👁 Detalhe da cobrança (só leitura) */
.fdc-bloco { margin-top: 14px; }
.fdc-bloco h4 { margin: 0 0 6px; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--cinza-500); }
.fdc-linha { display: flex; justify-content: space-between; gap: 16px; padding: 5px 0; border-bottom: 1px solid var(--cinza-100); font-size: 13px; }
.fdc-linha:last-child { border-bottom: none; }
.fdc-linha span { color: var(--cinza-600); flex-shrink: 0; }
.fdc-linha strong { font-weight: 600; text-align: right; color: var(--cinza-800); word-break: break-word; }
.fdc-pago .fdc-linha strong { color: var(--verde); }
.fdc-itens { width: 100%; }
.fdc-itens td { padding: 6px 8px; font-size: 13px; }
.fdc-itens td.num { text-align: right; font-weight: 600; white-space: nowrap; }

@media (max-width: 1150px) {
  .fin-cob-lista, .fin-cob-colunas { --fcl-cols: 24px minmax(130px, 1fr) 84px 90px 100px 116px 136px 34px 34px; }
}

/* Contas a Pagar reaproveita os cards de Recebimentos SEM a coluna do checkbox (não há baixa
   em lote no lado Pagar). Especificidade maior que a da grade base pra vencer a variável. */
.fin-cob-lista.fin-cob-sem-chk, .fin-cob-colunas.fin-cob-sem-chk {
  --fcl-cols: minmax(170px, 1fr) 92px 96px 108px 124px 150px 36px 36px;
}
@media (max-width: 1150px) {
  .fin-cob-lista.fin-cob-sem-chk, .fin-cob-colunas.fin-cob-sem-chk { --fcl-cols: minmax(130px, 1fr) 84px 90px 100px 116px 136px 34px 34px; }
}

/* Gráficos dos Relatórios (24/09) — o SVG NÃO usa preserveAspectRatio:"none": esticar o
   viewBox deforma o texto junto e foi o que deixou os rótulos tortos na versão anterior. */
.rel-chart { overflow: visible; }
.rel-chart-nota { color: var(--cinza-500); font-size: 11.5px; }
.rel-chart-aviso {
  margin: 10px 0 0; padding: 9px 12px; border-radius: 8px;
  background: var(--amarelo-claro); color: #7A4E00; font-size: 12.5px; line-height: 1.45;
}

/* ── Fluxo de Caixa mensal ───────────────────────────────────────────────────────────
   Tabela larga (um mês por coluna + total): a 1ª coluna fica fixa na rolagem horizontal,
   senão ao arrastar para ver dezembro perde-se o nome da categoria e a linha vira uma
   fileira de números sem dono. */
.fcx-wrapper { overflow-x: auto; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg); background: var(--branco); }
.fcx-tabela { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.fcx-tabela th, .fcx-tabela td { padding: 7px 12px; white-space: nowrap; }
.fcx-tabela thead th { background: var(--cinza-50); color: var(--cinza-600); font-size: 11.5px; text-transform: uppercase; letter-spacing: .03em; text-align: right; border-bottom: 1px solid var(--cinza-200); }
.fcx-tabela th.fcx-desc, .fcx-tabela td.fcx-desc { text-align: left; position: sticky; left: 0; z-index: 2; background: var(--branco); min-width: 250px; }
.fcx-tabela thead th.fcx-desc { background: var(--cinza-50); z-index: 3; }
.fcx-tabela td { text-align: right; color: var(--cinza-800); }
.fcx-tabela th.fcx-total, .fcx-tabela td.fcx-total { border-left: 2px solid var(--cinza-200); font-weight: 600; }
.fcx-mes-corrente { color: var(--azul) !important; }

/* Hierarquia por peso, não por cor: grupo (categoria-mãe) forte, subcategoria recuada. */
.fcx-grupo td { font-weight: 600; background: var(--cinza-50); }
.fcx-grupo td.fcx-desc { background: var(--cinza-50); }
.fcx-sub td.fcx-desc { padding-left: 30px; color: var(--cinza-600); font-weight: 400; }
.fcx-sub td { color: var(--cinza-600); }
.fcx-secao td { font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; color: var(--cinza-500); background: var(--branco); padding-top: 16px; }
.fcx-entrada td.fcx-desc { border-left: 3px solid var(--verde); }
.fcx-saida td.fcx-desc { border-left: 3px solid var(--vermelho); }
.fcx-linha-total td { border-top: 2px solid var(--cinza-300); font-weight: 700; }
.fcx-entradas-total td { color: var(--verde); }
.fcx-saidas-total td { color: var(--vermelho); }
.fcx-resultado td { border-top: 2px solid var(--cinza-800); font-weight: 700; font-size: 14px; background: var(--cinza-50); }
.fcx-resultado td.fcx-desc { background: var(--cinza-50); }
.fcx-neg { color: var(--vermelho); }
.fcx-pos { color: var(--verde); }
.fcx-saldo td { color: var(--cinza-600); font-size: 12.5px; }
.fcx-saldo-fim td { font-weight: 600; color: var(--cinza-800); }
.fcx-zero { color: var(--cinza-300); }
.fcx-toggle {
  background: none; border: none; cursor: pointer; padding: 0 6px 0 0;
  color: var(--cinza-500); font-size: 11px; font-family: inherit;
}
.fcx-legenda { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 10px; font-size: 12px; color: var(--cinza-500); }

/* Filtro de período dos Relatórios (24/09) — intervalo de/até + atalhos, no lugar do
   "Últimos N meses". A barra usa .filtro-licencas, então só o que é novo entra aqui. */
/* `.campo-filtro-licencas` tem max-width 220px (bom para um select), que espremia tanto o
   par de meses quanto a fileira de atalhos — os botões vazavam por cima do campo "até". */
.rel-filtro { align-items: flex-end; flex-wrap: wrap; }
.rel-filtro .campo-filtro-licencas { max-width: none; }
.rel-periodo-par { display: flex; align-items: center; gap: 8px; }
.rel-periodo-par em { font-style: normal; font-size: 12px; color: var(--cinza-500); }
.rel-periodo-par input { font-family: inherit; font-size: 13.5px; padding: 7px 10px; border: 1px solid var(--cinza-300); border-radius: 8px; background: var(--branco); color: var(--cinza-800); }
.rel-periodo-par input:focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px var(--azul-claro); }
.rel-atalhos { display: flex; gap: 6px; flex-wrap: nowrap; }
.rel-atalho { padding: 6px 11px; font-size: 12.5px; }

/* Participação da unidade no MRR — barra proporcional em vez de gráfico próprio. */
.rel-uni-barra { height: 7px; border-radius: 999px; background: var(--cinza-200); overflow: hidden; margin-bottom: 3px; min-width: 90px; }
.rel-uni-barra span { display: block; height: 100%; border-radius: 999px; background: var(--verde); }
/* Faixa sem nenhum caso: fica apagada em vez de sumir — a ausência também informa. */
.rel-linha-vazia td { opacity: .5; }

/* Importar da Conexa — lista de campos da API (nomes, nunca valores). */
.imp-cx-campos { display: flex; flex-wrap: wrap; gap: 6px; }
.imp-cx-campos code {
  font-size: 12px; padding: 3px 8px; border-radius: 6px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200); color: var(--cinza-700, var(--cinza-600));
}
.imp-cx-campos.exige code { background: var(--azul-claro); border-color: #C9CFF0; color: var(--azul); }
/* Chips do diagnóstico da Conexa (status, meses). Antes usavam uma classe que não
   existia no CSS e saíam como texto corrido, um grudado no outro. */
.imp-cx-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.imp-cx-pills span {
  display: inline-block; padding: 3px 9px; border-radius: 999px;
  background: var(--cinza-100); border: 1px solid var(--cinza-200);
  font-size: 12px; color: var(--cinza-600);
}

/* Histórico de vigências da tolerância (Controle de Ponto > Cadastros). */
.ponto-vigencias {
  margin: 12px 0;
  padding: 10px 14px;
  background: var(--cinza-50);
  border-left: 3px solid var(--azul);
  border-radius: 6px;
}
.ponto-vigencias ul { margin: 6px 0 0; padding-left: 18px; }
.ponto-vigencias li { margin-bottom: 4px; font-size: 13px; }

/* Contador de lançamentos criados em sequência (Contas a Pagar > lançamento avulso). */
.fin-lote-contador {
  margin: -4px 0 12px;
  padding: 7px 12px;
  background: #EAF7EF;
  border-left: 3px solid #1B7F4B;
  border-radius: 6px;
  font-size: 13px;
  color: #145C36;
}

/* ── Seletor com busca para listas longas (categoria, cliente, fornecedor) ──
   O <select> real continua no DOM (name + required funcionando); some de vista
   por posicionamento, e NÃO por display:none — campo required escondido assim
   trava o submit com "not focusable". */
.fin-combo { position: relative; }
.fin-combo-nativo {
  position: absolute; opacity: 0; pointer-events: none;
  width: 1px; height: 1px; bottom: 0; left: 0; border: 0; padding: 0;
}
.fin-combo-btn {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 9px 12px; border: 1px solid var(--cinza-300); border-radius: 8px;
  background: #fff; font-size: 14px; color: var(--cinza-800); text-align: left; cursor: pointer;
}
.fin-combo-btn:hover { border-color: var(--azul); }
.fin-combo-btn.fin-combo-vazio .fin-combo-txt { color: var(--cinza-500); }
.fin-combo-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fin-combo-seta { color: var(--cinza-500); font-size: 11px; flex-shrink: 0; }
.fin-combo-pop {
  position: absolute; z-index: 60; top: calc(100% + 4px); left: 0; right: 0;
  background: #fff; border: 1px solid var(--cinza-200); border-radius: 10px;
  box-shadow: 0 10px 28px rgba(16, 24, 64, .16); padding: 8px;
}
.fin-combo-pop.oculto { display: none; }
.fin-combo-busca {
  width: 100%; padding: 8px 10px; border: 1px solid var(--cinza-300);
  border-radius: 7px; font-size: 13.5px; margin-bottom: 6px;
}
.fin-combo-busca:focus { outline: none; border-color: var(--azul); }
.fin-combo-lista { max-height: 260px; overflow-y: auto; }
.fin-combo-item {
  display: block; width: 100%; text-align: left; padding: 7px 10px;
  border: 0; background: none; border-radius: 6px; cursor: pointer;
  font-size: 13.5px; color: var(--cinza-800);
}
.fin-combo-item:hover { background: var(--cinza-50); }
.fin-combo-item.ativo { background: #EEF3FF; color: var(--azul); font-weight: 600; }
/* Subcategoria recuada: a hierarquia mãe → filha continua legível na busca. */
.fin-combo-filha { padding-left: 24px; }
.fin-combo-filha::before { content: '↳'; margin-left: -14px; margin-right: 6px; color: var(--cinza-500); }
.fin-combo-vazio-msg { padding: 10px; margin: 0; color: var(--cinza-600); font-size: 13px; text-align: center; }

/* Extrato da conta bancária (modal de conferência). */
.fin-extrato-filtros { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.fin-extrato-filtros label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--cinza-600); }
.fin-extrato-filtros input { padding: 7px 9px; border: 1px solid var(--cinza-300); border-radius: 7px; font-size: 13.5px; }
.fin-extrato-saldos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }
.fin-extrato-saldos > div { background: var(--cinza-50); border-radius: 8px; padding: 9px 12px; }
.fin-extrato-saldos span { display: block; font-size: 11px; color: var(--cinza-600); }
.fin-extrato-saldos strong { font-size: 15px; color: var(--azul); }
.fin-ext-ent { color: #1B7F4B; }
.fin-ext-sai { color: #A61C41; }
.fin-extrato-aviso {
  background: #FFF8E6; border-left: 3px solid #A61C41; border-radius: 6px;
  padding: 9px 12px; font-size: 12.5px; color: #5A4300; margin: 0 0 12px;
}

/* ── Conciliação bancária ────────────────────────────────────────────────── */
.concil-resumo { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 12px; }
.concil-resumo > div { background: var(--cinza-50); border-radius: 8px; padding: 9px 12px; }
.concil-resumo span { display: block; font-size: 11px; color: var(--cinza-600); }
.concil-resumo strong { font-size: 16px; color: var(--azul); }
.concil-resumo .concil-pend { color: #A61C41; }
.concil-barra-acoes { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.concil-toggle { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cinza-600); }
.concil-lista { display: flex; flex-direction: column; gap: 8px; }
.concil-card {
  border: 1px solid var(--cinza-200); border-left: 3px solid var(--cinza-300);
  border-radius: 8px; padding: 10px 14px; background: #fff;
}
.concil-card.concil-sugestao_unica { border-left-color: #1B7F4B; }
.concil-card.concil-sugestoes_multiplas { border-left-color: #8A6100; }
.concil-card.concil-confirmado, .concil-card.concil-ja_baixado { border-left-color: #1B7F4B; background: #F7FCF9; }
.concil-card.concil-ignorado { border-left-color: var(--cinza-300); background: var(--cinza-50); }
.concil-cab { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.concil-data { font-size: 12.5px; color: var(--cinza-600); min-width: 68px; }
.concil-desc { flex: 1; font-size: 13.5px; font-weight: 600; color: var(--cinza-800); min-width: 180px; }
.concil-valor { font-size: 14px; font-weight: 700; }
.concil-acoes { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 9px; padding-top: 9px; border-top: 1px dashed var(--cinza-200); }
.concil-acoes select { flex: 1; min-width: 220px; max-width: 480px; padding: 6px 9px; border: 1px solid var(--cinza-300); border-radius: 6px; font-size: 12.5px; }
/* Escolha manual de um candidato FRACO (nem valor exato nem nome batendo). Fica mais
   discreta que a linha de ações principal de propósito: é saída de exceção, não a
   recomendação do sistema. */
.concil-acoes-fraca { border-top: 0; margin-top: 2px; padding-top: 0; opacity: .85; }
/* O que o BANCO diz, no modal de criar lançamento: data, valor e descrição são fato e
   aparecem travados, separados dos campos que o usuário preenche. */
.concil-fato { display: flex; flex-wrap: wrap; gap: 18px; background: var(--cinza-50); border: 1px solid var(--cinza-200); border-radius: 8px; padding: 10px 14px; margin-bottom: 14px; }
.concil-fato > div { display: flex; flex-direction: column; gap: 2px; }
.concil-fato span { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--cinza-600); }
.concil-fato strong { font-size: 14px; }
.concil-fato-desc { flex: 1; min-width: 220px; }
.concil-fato-desc strong { font-size: 12.5px; font-weight: 500; }
.concil-selo { font-size: 12px; }
.concil-resolvido { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--cinza-200); font-size: 12.5px; color: var(--cinza-600); display: flex; align-items: center; gap: 10px; }

/* ── Consultor financeiro (IA) ────────────────────────────────────────────────
   Aviso amarelo: o mesmo bloco já aparecia inline em Faturamento (diagnóstico da
   automação). Virou classe aqui porque agora há dois usos — o terceiro seria o momento
   em que os três começariam a divergir. */
.fin-aviso-amarelo {
  background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px;
  padding: 10px 14px; margin-bottom: 12px; font-size: 13px; color: #92400e;
}
.fin-aviso-amarelo code {
  background: rgba(146, 64, 14, .1); padding: 1px 5px; border-radius: 4px; font-size: 12px;
}

/* Perguntas prontas: chat em branco não é usado, então elas são o conteúdo inicial da
   tela, não um detalhe de rodapé. */
.consultor-sugestoes {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px; margin-bottom: 16px;
}
.consultor-sugestao {
  text-align: left; background: var(--branco); border: 1px solid var(--cinza-200);
  border-radius: 10px; padding: 11px 13px; cursor: pointer; display: flex;
  flex-direction: column; gap: 3px; transition: border-color .15s, box-shadow .15s;
}
.consultor-sugestao:hover { border-color: var(--azul); box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.consultor-sugestao strong { font-size: 13px; color: var(--cinza-800); }
.consultor-sugestao span {
  font-size: 11.5px; color: var(--cinza-600); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.consultor-conversa { display: flex; flex-direction: column; gap: 12px; margin-bottom: 14px; }
.consultor-msg { border-radius: 12px; padding: 11px 15px; font-size: 13.5px; line-height: 1.6; }
.consultor-eu {
  align-self: flex-end; max-width: 75%; background: var(--azul); color: #fff;
  border-bottom-right-radius: 3px; white-space: pre-wrap;
}
.consultor-ia {
  align-self: flex-start; max-width: 92%; background: var(--cinza-50);
  border: 1px solid var(--cinza-200); border-bottom-left-radius: 3px; color: var(--cinza-800);
}
.consultor-ia h4 { margin: 12px 0 6px; font-size: 13.5px; color: var(--cinza-800); }
.consultor-ia h4:first-child { margin-top: 0; }
.consultor-ia p { margin: 0 0 8px; }
.consultor-ia p:last-child { margin-bottom: 0; }
.consultor-ia ul { margin: 0 0 8px; padding-left: 20px; }
.consultor-ia li { margin-bottom: 4px; }
.consultor-ia table { margin: 8px 0; font-size: 12.5px; }
.consultor-pensando { color: var(--cinza-600); font-style: italic; }

/* De onde a análise veio. Fica discreto, mas sempre presente: número financeiro sem
   origem rastreável não deveria embasar decisão. */
.consultor-fonte {
  margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--cinza-200);
  font-size: 11px; color: var(--cinza-600);
}

.consultor-barra { display: flex; gap: 8px; align-items: center; }
.consultor-barra input {
  flex: 1; padding: 10px 14px; border: 1px solid var(--cinza-300);
  border-radius: 8px; font-size: 13.5px;
}
.consultor-barra input:focus { outline: none; border-color: var(--azul); }

/* Consumo da IA — fica no topo da tela do Consultor, ao lado do botão que gera o gasto.
   Custo de API cresce sem ninguém notar justamente porque cada consulta é barata. */
.consultor-consumo {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  background: var(--cinza-50); border: 1px solid var(--cinza-200);
  border-radius: 10px; padding: 10px 16px; margin-bottom: 14px;
}
.consultor-consumo-alerta { background: #fffbeb; border-color: #fde68a; }
.consultor-consumo-vazio { font-size: 12.5px; color: var(--cinza-600); display: block; }
.cc-itens { display: flex; flex-wrap: wrap; gap: 22px; }
.cc-itens > div { display: flex; flex-direction: column; gap: 1px; }
.cc-itens span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--cinza-600); }
.cc-itens strong { font-size: 15px; color: var(--cinza-800); }

.cc-serie { display: flex; align-items: flex-end; gap: 10px; height: 110px; padding-top: 6px; }
.cc-barra-col { flex: 1; display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: flex-end; gap: 5px; }
.cc-barra { width: 100%; background: var(--azul); border-radius: 4px 4px 0 0; min-height: 3px; }
.cc-barra-corrente { background: repeating-linear-gradient(45deg, var(--azul), var(--azul) 4px, transparent 4px, transparent 8px); border: 1px dashed var(--azul); }
.cc-barra-col span { font-size: 10px; color: var(--cinza-600); }
.consultor-diag {
  margin-top: 8px; padding-top: 8px; border-top: 1px solid #fde68a;
  font-size: 12.5px; line-height: 1.5;
}

/* Histórico de conversas do consultor */
.conv-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.conv-todos { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--cinza-600); }
.conv-lista { display: flex; flex-direction: column; gap: 6px; max-height: 50vh; overflow-y: auto; }
.conv-item { display: flex; align-items: center; gap: 8px; border: 1px solid var(--cinza-200); border-radius: 8px; padding: 4px 10px; }
.conv-item:hover { border-color: var(--azul); }
.conv-sel { display: flex; align-items: center; }
.conv-abrir {
  flex: 1; display: flex; flex-direction: column; gap: 2px; text-align: left;
  background: none; border: 0; cursor: pointer; padding: 8px 2px;
}
.conv-abrir strong { font-size: 13px; color: var(--cinza-800); }
.conv-previa {
  font-size: 11.5px; color: var(--cinza-600); line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.conv-meta { font-size: 10.5px; color: var(--cinza-500, var(--cinza-600)); }
/* `.btn-perigo` já existe nos utilitários globais — aqui só o estado desabilitado, que
   faltava e é o que impede clicar em "excluir" sem nada selecionado. */
.btn-perigo:disabled { opacity: .45; cursor: not-allowed; }

/* Movimentação patrimonial */
.fin-aviso-azul {
  background: var(--azul-claro, #eff6ff); border: 1px solid var(--azul-borda, #bfdbfe);
  border-radius: 8px; padding: 11px 15px; margin-bottom: 14px;
  font-size: 13px; line-height: 1.55; color: var(--azul-escuro, #1e40af);
}
.mov-ajuda { font-size: 12px; color: var(--cinza-600); line-height: 1.5; margin: -4px 0 4px; }
.mov-ajuda:empty { display: none; }
/* Aviso dentro de um card do dashboard: o número está incompleto e há o que fazer. */
.fdash-nota-aviso {
  margin: 10px 0 0; padding: 8px 10px; border-radius: 6px;
  background: #fffbeb; border: 1px solid #fde68a; color: #92400e;
  font-size: 11.5px; line-height: 1.5;
}

.mov-cancelada { opacity: .5; }
.mov-cancelada td { text-decoration: line-through; }
.mov-cancelada td:last-child { text-decoration: none; }

/* Separação principal x rendimento no resgate: verde é o que virou receita, âmbar é o que
   ainda falta classificar — a cor já diz se há pendência, sem precisar ler a linha. */
.mov-rend-detalhe { font-size: 11.5px; color: var(--verde-escuro, #15803d); }
.mov-rend-falta { font-size: 11.5px; color: #b45309; }

/* Linha patrimonial no extrato: move o saldo e não é receita nem despesa. O fundo neutro
   distingue sem competir com as cores de entrada/saída, que seguem significando dinheiro. */
.ext-patrimonial > td { background: var(--cinza-50, #f8fafc); }
.ext-patrimonial > td:first-child { box-shadow: inset 3px 0 0 var(--cinza-300, #cbd5e1); }
.fin-extrato-nota {
  margin: 10px 0 0; padding: 10px 12px; border-radius: 8px;
  background: var(--cinza-50, #f8fafc); border: 1px solid var(--cinza-200, #e2e8f0);
  font-size: 12.5px; line-height: 1.55; color: var(--cinza-600);
}

/* ---------- Pesquisa de Satisfação (07/10/2026) ---------- */
.pq-abas { margin: 0 0 18px; flex-wrap: wrap; }
.pq-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 0 20px; }
.pq-aviso { background: var(--amarelo-claro); color: var(--amarelo); border-radius: var(--raio); padding: 10px 14px; font-size: 13px; margin: -12px 0 18px; }
.pq-nota { font-size: 12px; color: var(--cinza-500); margin: 10px 0 0; line-height: 1.5; }
.pq-barra-nps { display: flex; height: 18px; border-radius: 9px; overflow: hidden; background: var(--cinza-100); }
.pq-barra-nps span { display: block; height: 100%; }
.pq-legenda { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; font-size: 13px; color: var(--cinza-600); }
.pq-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 7px; vertical-align: middle; }
.pq-motivo { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 13px; }
.pq-motivo-nome { flex: 0 0 150px; color: var(--cinza-800); }
.pq-motivo-barra { flex: 1; height: 10px; background: var(--cinza-100); border-radius: 5px; overflow: hidden; }
.pq-motivo-barra span { display: block; height: 100%; background: var(--azul); border-radius: 5px; }
.pq-motivo-num { flex: 0 0 72px; text-align: right; font-weight: 600; color: var(--cinza-800); }
.pq-motivo-num em { font-style: normal; font-weight: 500; color: var(--vermelho); font-size: 12px; }
.pq-dist { display: inline-flex; align-items: flex-end; gap: 3px; height: 26px; }
.pq-dist span { width: 9px; border-radius: 2px 2px 0 0; }
.pq-tabela-areas td { vertical-align: middle; }
.pq-barra-filtros { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.pq-canal { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 10px; margin: 1px 4px 1px 0; }
.pq-canal.ok { background: var(--verde-claro); color: var(--verde); }
.pq-canal.falha { background: var(--vermelho-claro); color: var(--vermelho); }
.pq-nps-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; border-radius: 10px; color: #fff; font-weight: 700; font-size: 16px; flex-shrink: 0; }
.pq-respostas { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.pq-resp { background: #fff; border: 1px solid var(--cinza-200); border-left: 4px solid var(--cinza-300); border-radius: var(--raio-lg); padding: 14px 16px; box-shadow: var(--sombra-sm); }
.pq-resp.promotor { border-left-color: var(--verde); }
.pq-resp.neutro { border-left-color: #F59E0B; }
.pq-resp.detrator { border-left-color: var(--vermelho); }
.pq-resp-topo { display: flex; align-items: center; gap: 10px; }
.pq-resp-meta { font-size: 12px; color: var(--cinza-500); margin-top: 2px; }
.pq-resp-areas { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 14px; margin-top: 12px; font-size: 12.5px; color: var(--cinza-600); }
.pq-resp-areas div { display: flex; justify-content: space-between; gap: 6px; }
.pq-estrelas { color: #F59E0B; letter-spacing: 1px; white-space: nowrap; }
.pq-estrelas-off { color: var(--cinza-200); }
.pq-na { color: var(--cinza-500); font-size: 11.5px; font-style: italic; }
.pq-resp-motivos { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.pq-resp-motivos span { background: var(--azul-claro); color: var(--azul); font-size: 11.5px; padding: 2px 9px; border-radius: 10px; }
.pq-resp-coment { margin-top: 10px; font-size: 13.5px; color: var(--cinza-800); background: var(--cinza-50); border-radius: 8px; padding: 8px 10px; font-style: italic; }
.pq-trat-ctrl { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; font-size: 12.5px; color: var(--cinza-600); }
.pq-trat-ctrl label { display: flex; flex-direction: column; gap: 3px; }
.pq-trat-nota { display: flex; gap: 8px; margin-top: 10px; }
.pq-trat-nota input { flex: 1; border: 1px solid var(--cinza-300); border-radius: 8px; padding: 7px 10px; font: inherit; font-size: 13px; }
.pq-trat-hist { margin-top: 10px; font-size: 12.5px; color: var(--cinza-600); }
.pq-trat-hist div { padding: 3px 0; }
.pq-previa { display: flex; gap: 14px; margin: 6px 0 12px; }
.pq-previa div { flex: 1; background: var(--azul-claro); border-radius: var(--raio); padding: 12px; text-align: center; }
.pq-previa strong { display: block; font-size: 24px; color: var(--azul); }
.pq-previa span { font-size: 12px; color: var(--cinza-600); }
select.input-filtro, input.input-filtro { border: 1px solid var(--cinza-300); border-radius: 8px; padding: 7px 10px; font: inherit; font-size: 13px; background: #fff; color: var(--cinza-800); }
.pq-painel-risco { border-left: 4px solid var(--vermelho); }
.pq-risco-lista { padding: 6px 20px; max-height: 320px; overflow-y: auto; }
.pq-risco-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--cinza-100); }
.pq-risco-item:last-child { border-bottom: none; }
.pq-risco-coment { font-size: 12.5px; color: var(--cinza-600); font-style: italic; margin-top: 4px; }
.pq-mini-barra { display: inline-block; width: 90px; height: 8px; background: var(--cinza-100); border-radius: 4px; overflow: hidden; vertical-align: middle; margin-right: 6px; }
.pq-mini-barra span { display: block; height: 100%; border-radius: 4px; }
.pq-resp-atrib { border-top: 1px dashed var(--cinza-200); padding-top: 8px; }
.pq-resp-extra { margin-top: 8px; font-size: 12.5px; color: var(--cinza-600); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pq-resp-coment small { display: block; font-style: normal; font-size: 11px; color: var(--cinza-500); margin-bottom: 3px; }
.pq-dep-tag { display: block; font-style: normal; font-size: 11px; color: var(--verde); font-weight: 600; margin-top: 4px; }
.pq-trat-motivos { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.pq-trat-motivos span { background: var(--vermelho-claro); color: var(--vermelho); font-size: 11.5px; font-weight: 600; padding: 2px 9px; border-radius: 10px; }
.pq-trat-motivos span.risco { background: var(--vermelho); color: #fff; }
.pq-depoimentos { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; padding: 14px 20px; }
.pq-depoimentos blockquote { margin: 0; background: var(--verde-claro); border-radius: var(--raio); padding: 12px 14px; font-size: 13.5px; color: var(--cinza-800); font-style: italic; }
.pq-depoimentos cite { display: block; font-style: normal; font-size: 11.5px; color: var(--cinza-600); margin-top: 6px; }
.pq-grupos { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 20px; }
.fin-combo-mae { color: var(--cinza-500); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .2px; }
/* Pagamento agrupado na conciliação (08/10) */
.concil-agrupado { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--azul-claro); border: 1px solid var(--azul); border-radius: var(--raio); padding: 10px 14px; margin: 8px 0; font-size: 13px; color: var(--cinza-800); }
.concil-ag-lista { max-height: 340px; overflow-y: auto; border: 1px solid var(--cinza-200); border-radius: var(--raio); }
.concil-ag-item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--cinza-100); cursor: pointer; font-weight: 400 !important; }
.concil-ag-item:last-child { border-bottom: none; }
.concil-ag-item.sel { background: var(--azul-claro); }
.concil-ag-item input[type=checkbox] { width: auto !important; margin: 0; }
.concil-ag-info { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 13px; }
.concil-ag-info small { color: var(--cinza-500); font-size: 11.5px; }
.concil-ag-valor { white-space: nowrap; font-size: 13px; font-weight: 600; }
.concil-ag-valor input { width: 100px !important; padding: 4px 6px !important; display: inline-block !important; }
.concil-ag-total { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }
.concil-ag-total div { background: var(--cinza-50); border-radius: var(--raio); padding: 8px 12px; display: flex; flex-direction: column; font-size: 12px; color: var(--cinza-600); }
.concil-ag-total strong { font-size: 15px; color: var(--cinza-800); }
.concil-ag-total .ok { background: var(--verde-claro); } .concil-ag-total .ok strong { color: var(--verde); }
.concil-ag-total .falta { background: var(--amarelo-claro); } .concil-ag-total .falta strong { color: var(--amarelo); }
/* Botão desativado precisa PARECER desativado (08/10): sem isto o "Confirmar baixas" travado
   pela soma inexata parecia clicável e o clique "não fazia nada". Vale para o app todo. */
.btn-primario:disabled, .btn-secundario:disabled, .btn-mini:disabled { opacity: .45; cursor: not-allowed; }
.concil-ag-pago { color: var(--verde); font-weight: 600; }
.concil-ag-aberto { color: var(--azul); font-weight: 600; }
.fdash-alerta-sem-meio { margin: 8px 0 0; font-size: 11.5px; color: var(--amarelo); background: var(--amarelo-claro); border-radius: 8px; padding: 6px 8px; }
.cc-nome-anterior { font-style: italic; color: var(--cinza-500); }
.vcc-razao-hist { padding: 6px 0; border-bottom: 1px dashed var(--cinza-200); font-size: 13px; }
.vcc-razao-hist:last-of-type { border-bottom: none; }
.vcc-razao-hist small { color: var(--cinza-500); font-size: 11.5px; }

/* ── CRM funil v2 (08/10) ─────────────────────────────────────────────────── */
.kanban-board { grid-template-columns: repeat(4, minmax(175px, 1fr)) minmax(165px, .9fr) !important; }
.kanban-board .kanban-col { min-width: 0; }
@media (max-width: 900px) { .kanban-board { grid-template-columns: repeat(5, 78vw) !important; } }
.kanban-col-espera { background: var(--cinza-50); border-style: dashed !important; opacity: .95; }
.kanban-col-valor small { color: var(--cinza-500); font-weight: 400; }
.kanban-card-atencao { border-left: 3px solid var(--laranja) !important; }
.crm-acao { font-size: 11.5px; color: var(--cinza-600); background: var(--cinza-50); border-radius: 6px; padding: 4px 7px; margin: 6px 0 2px; line-height: 1.35; }
.crm-acao-hoje { background: var(--azul-claro); color: var(--azul); font-weight: 600; }
.crm-acao-vencida, .crm-acao-falta { background: var(--vermelho-claro); color: var(--vermelho); font-weight: 600; }
.crm-acao-espera { background: var(--cinza-100); }
.crm-acao-ganho { background: var(--verde-claro); color: var(--verde); font-weight: 600; }
.crm-atencao-txt { font-size: 11px; color: var(--laranja); margin-top: 2px; }
.crm-trans-secao { font-size: 12px; font-weight: 700; color: var(--azul); text-transform: uppercase; letter-spacing: .3px; margin: 14px 0 6px; }
.crm-trans-nota { font-size: 12.5px; color: var(--cinza-600); background: var(--cinza-50); border-radius: 8px; padding: 8px 10px; margin: 6px 0 10px; }
.crm-regua { margin: 10px 0 12px; padding: 12px; background: var(--cinza-50); border-radius: 10px; }
.crm-regua-passos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.crm-regua-passos.inativa { opacity: .5; }
.crm-regua-passo { display: flex; align-items: center; gap: 6px; border: 1px solid var(--cinza-200); background: #fff; border-radius: 8px; padding: 7px 8px; font-size: 12px; color: var(--cinza-600); cursor: pointer; text-align: left; }
.crm-regua-passo:disabled { cursor: default; }
.crm-regua-passo span { width: 20px; height: 20px; border-radius: 50%; background: var(--cinza-200); color: var(--cinza-600); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 11px; flex-shrink: 0; }
.crm-regua-passo.feito { border-color: var(--verde); color: var(--verde); }
.crm-regua-passo.feito span { background: var(--verde); color: #fff; }
.crm-regua-passo.atual { border-color: var(--azul); color: var(--azul); font-weight: 700; box-shadow: 0 0 0 1px var(--azul) inset; }
.crm-regua-passo.atual span { background: var(--azul); color: #fff; }
.crm-regua-resultado { margin-top: 8px; font-size: 13px; font-weight: 600; color: var(--cinza-800); }
.crm-regua-acoes { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.crm-btn-ganho { color: var(--verde) !important; border-color: var(--verde) !important; }
.crm-regua-acao .crm-acao { margin-top: 8px; }
.crm-periodo-bar { display: flex; align-items: center; justify-content: space-between; }
.crm-sec-titulo { font-size: 12px; font-weight: 700; color: var(--cinza-500); text-transform: uppercase; letter-spacing: .5px; margin: 18px 0 8px; }
.crm-kpis { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 12px; }
.crm-kpis:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .crm-kpis { grid-template-columns: 1fr 1fr; } }
.crm-kpi { background: #fff; border: 1px solid var(--cinza-200); border-radius: var(--raio-lg); padding: 14px 16px; display: flex; flex-direction: column; gap: 3px; box-shadow: var(--sombra-sm); }
.crm-kpi-principal { border-left: 4px solid var(--verde); }
.crm-kpi-rot { font-size: 12px; color: var(--cinza-500); font-weight: 600; }
.crm-kpi-num { font-size: 24px; font-weight: 700; color: var(--cinza-800); line-height: 1.15; }
.crm-kpi-principal .crm-kpi-num { color: var(--verde); font-size: 28px; }
.crm-kpi-num small { font-size: 13px; color: var(--cinza-500); font-weight: 500; }
.crm-kpi-sub { font-size: 11.5px; color: var(--cinza-500); }
.crm-up { color: var(--verde); font-weight: 600; } .crm-down { color: var(--vermelho); font-weight: 600; }
.crm-meta-barra { height: 6px; background: var(--cinza-100); border-radius: 3px; overflow: hidden; margin-top: 6px; }
.crm-meta-barra span { display: block; height: 100%; background: var(--verde); }
.crm-mini-kpis { display: flex; gap: 18px; flex-wrap: wrap; font-size: 12.5px; color: var(--cinza-600); margin: 10px 2px 0; }
.crm-mini-kpis strong { color: var(--cinza-800); }
.crm-funil-agora { display: flex; align-items: stretch; gap: 6px; margin: 12px 0 16px; }
.crm-funil-etapa { flex: 1; background: #fff; border: 1px solid var(--cinza-200); border-radius: 10px; padding: 10px 12px; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.crm-funil-etapa:hover { border-color: var(--azul); }
.crm-funil-nome { font-size: 11.5px; color: var(--cinza-500); font-weight: 600; }
.crm-funil-qtd { font-size: 22px; font-weight: 700; color: var(--azul); }
.crm-funil-val { font-size: 11.5px; color: var(--cinza-600); }
.crm-funil-seta { align-self: center; color: var(--cinza-300); font-size: 20px; }
.crm-at-linha { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--cinza-100); font-size: 13px; cursor: pointer; }
.crm-at-linha:last-child { border-bottom: none; }
.crm-at-linha small { color: var(--cinza-500); }
.crm-at-txt { color: var(--cinza-600); font-size: 12px; text-align: right; }
.crm-at-forte .crm-at-txt { color: var(--vermelho); font-weight: 600; }
.crm-at-media .crm-at-txt { color: var(--laranja); }
.crm-conv-linha { display: flex; align-items: center; gap: 10px; padding: 5px 0; font-size: 13px; }
.crm-conv-nome { flex: 0 0 120px; }
.crm-conv-barra { flex: 1; height: 10px; background: var(--cinza-100); border-radius: 5px; overflow: hidden; }
.crm-conv-barra span { display: block; height: 100%; background: var(--azul); border-radius: 5px; }
.crm-conv-num { flex: 0 0 70px; text-align: right; font-weight: 600; }
.crm-conv-num small { color: var(--cinza-500); font-weight: 500; }
.crm-nota { font-size: 11.5px; color: var(--cinza-500); margin: 8px 0 0; }
.crm-serie { display: flex; align-items: flex-end; gap: 8px; height: 130px; padding-top: 10px; }
.crm-serie-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; height: 100%; }
.crm-serie-barra { width: 70%; background: var(--verde); border-radius: 4px 4px 0 0; }
.crm-serie-val { font-size: 10.5px; color: var(--cinza-600); }
.crm-serie-mes { font-size: 11px; color: var(--cinza-500); }
.crm-tab-origem { width: 100%; font-size: 12.5px; border-collapse: collapse; }
.crm-tab-origem th { text-align: left; color: var(--cinza-500); font-weight: 600; padding: 4px; border-bottom: 1px solid var(--cinza-200); }
.crm-tab-origem td { padding: 5px 4px; border-bottom: 1px solid var(--cinza-100); }

/* CRM — link da proposta visual (08/10) */
.crm-prop-link{background:#F4F6FC;border:1px solid #E1E5F2;border-radius:10px;padding:10px 12px;margin:6px 0 4px;font-size:13px;color:#374151;display:flex;flex-direction:column;gap:4px}
.crm-prop-link-url{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:#6B7280;word-break:break-all}
.crm-prop-ok{color:#16834A;font-weight:600}
.crm-logo-linha{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.crm-logo-mini{height:44px;max-width:110px;object-fit:contain;border:1px solid #E1E5F2;border-radius:8px;background:#fff;padding:3px}

/* Relatório Evolução — movimentação do mês (08/10) */
.rel-evo-linha{cursor:pointer}
.rel-evo-linha:hover td{background:#F4F6FC}
.rel-evo-sel td{background:#EEF1FB!important;box-shadow:inset 0 -2px 0 #031895}
.rel-mov-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.rel-mov-sel{width:auto;min-width:190px}
.rel-mov-saldo{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border-radius:12px;padding:14px 18px;margin:6px 0 14px;background:#F4F6FC;border:1px solid #E1E5F2}
.rel-mov-saldo.pos{background:#ECF8F1;border-color:#BFE6CF}
.rel-mov-saldo.neg{background:#FDF0F2;border-color:#F3C9D2}
.rel-mov-saldo span{display:block;font-size:12px;font-weight:600;color:#6B7280;text-transform:uppercase;letter-spacing:.06em}
.rel-mov-saldo strong{font-size:26px;font-weight:800;color:#1D2238}
.rel-mov-saldo.pos strong{color:#16834A}.rel-mov-saldo.neg strong{color:#B42345}
.rel-mov-saldo strong small{font-size:12px;font-weight:500;color:#6B7280;margin-left:6px}
.rel-mov-gp{display:flex;gap:16px;font-size:13.5px;font-weight:600}
.rel-ponte{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:16px}
.rel-ponte-item{border:1px solid #E1E5F2;border-radius:10px;padding:10px 12px;background:#fff;display:flex;flex-direction:column;gap:2px}
.rel-ponte-item.base{background:#F4F6FC}
.rel-ponte-item.pos strong{color:#16834A}.rel-ponte-item.neg strong{color:#B42345}
.rel-ponte-rot{font-size:11.5px;color:#6B7280;font-weight:600}
.rel-ponte-item strong{font-size:15px}
.rel-ponte-item small{font-size:11px;color:#9CA3AF}
.rel-mov-tit{font-size:14px;margin:16px 0 8px;color:#1D2238}
.rel-mov-tit.pos{color:#16834A}.rel-mov-tit.neg{color:#B42345}
.rel-mov-nota{font-size:12px;color:#8A6D00;background:#FFF8E1;border-radius:8px;padding:8px 10px;margin:-6px 0 12px}
@media (max-width:900px){.rel-ponte{grid-template-columns:repeat(2,1fr)}}

/* Auditoria do faturamento (09/10) */
.aud-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.aud-nav{display:flex;align-items:center;gap:10px;font-size:17px}
.aud-nav strong{min-width:150px;text-align:center}
.aud-selo{font-size:13px;font-weight:600;border-radius:99px;padding:6px 12px}
.aud-selo.ok{background:#E7F6EE;color:#0F6B3A}.aud-selo.pronto{background:#EEF1FB;color:#031895}.aud-selo.pend{background:#FDECEF;color:#B42345}
.aud-barra-wrap{margin:4px 0 16px}
.aud-barra{height:10px;background:#EEF0F6;border-radius:99px;overflow:hidden}
.aud-barra span{display:block;height:100%;background:linear-gradient(90deg,#1FA463,#16834A);border-radius:99px}
.aud-barra-txt{font-size:13px;color:#4B5563;margin-top:6px}
.aud-barra-acoes{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.aud-barra-acoes #audf-faturar-todos{margin-left:auto}
.aud-tabela td{vertical-align:top}
.aud-linha.erro td:first-child{box-shadow:inset 3px 0 0 #D63A5E}
.aud-linha.atencao td:first-child{box-shadow:inset 3px 0 0 #E2A400}
.aud-sit{display:inline-block;font-size:12px;font-weight:700;border-radius:6px;padding:3px 8px}
.aud-sit.erro{background:#FDECEF;color:#B42345}.aud-sit.atencao{background:#FFF4E2;color:#8A4E00}.aud-sit.ok{background:#E7F6EE;color:#0F6B3A}
.aud-avisos{font-size:12px;color:#8A4E00;margin-top:4px}
.aud-prazo{font-size:12px;font-weight:600;color:#6B7280}.aud-prazo.urg{color:#C46A00}.aud-prazo.venc{color:#B42345}
.aud-tit{font-size:13px;margin-bottom:4px}
.aud-tit-sit{font-size:11px;font-weight:700;text-transform:uppercase;border-radius:4px;padding:1px 6px;background:#EEF0F6;color:#374151}
.aud-tit-sit.pago{background:#E7F6EE;color:#0F6B3A}.aud-tit-sit.vencido{background:#FDECEF;color:#B42345}
.aud-tit-flags{font-size:11.5px;margin-top:2px}.aud-tit-flags .ok{color:#16834A}.aud-tit-flags .nao{color:#B42345}
.aud-acao{white-space:nowrap}.aud-acao .btn-mini{margin:2px 0}
.aud-just{font-size:12.5px;color:#374151;white-space:normal;max-width:260px}.aud-just small{display:block;color:#9CA3AF}
.aud-sec summary{cursor:pointer;padding:4px 0}
.aud-sec-erro{border-left:3px solid #D63A5E}
.aud-concluir{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.aud-concluir p{margin:4px 0 0}
.aud-hist{font-size:12px;margin-top:6px}
.fin-aud-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:#FFF4E2;border:1px solid #F6DFA2;border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:13.5px;color:#6B4A00}
.fin-boleto-erro{font-size:11.5px;font-weight:600;color:#B42345;margin-top:3px;cursor:help}
.fin-vendas-fora{background:#EEF4FF;border:1px solid #C9D8F5;border-radius:10px;padding:10px 14px;margin:8px 0 12px;font-size:13px;color:#1D2A55}
.fin-vendas-fora ul{margin:6px 0 0 18px;padding:0}.fin-vendas-fora li{margin:3px 0}
.aud-abas{display:flex;gap:4px;border-bottom:1px solid #E1E5F2;margin-bottom:16px}
.aud-abas button{background:none;border:none;border-bottom:2px solid transparent;padding:9px 14px;font:600 14px Inter,system-ui,sans-serif;color:#6B7280;cursor:pointer}
.aud-abas button.ativa{color:#031895;border-bottom-color:#031895}
.aude-cards{grid-template-columns:repeat(5,minmax(0,1fr))}
.aude-card{cursor:pointer;text-align:left;font:inherit;border:1px solid transparent;transition:box-shadow .12s,border-color .12s}
.aude-card:hover:not([disabled]){box-shadow:0 4px 14px rgba(3,24,149,.12)}
.aude-card.ativo{border-color:#031895;box-shadow:0 0 0 2px rgba(3,24,149,.15)}
.aude-card.zero{opacity:.55;cursor:default}
.aude-card .label small{color:#9CA3AF;font-size:11px}
@media (max-width:1100px){.aude-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.aude-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.aud-cards .aude-card .label{line-height:1.35}
.aud-fc-link{font-size:inherit;padding:0;text-decoration:underline}
.dev-lista{max-height:340px;overflow:auto;border:1px solid #E1E5F2;border-radius:10px}
.dev-item{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border-bottom:1px solid #EEF0F6;cursor:pointer;font-size:13.5px}
.dev-item:hover{background:#F4F6FC}.dev-item input{margin-top:3px}
.fin-reaj-correcao td{color:#9CA3AF}
.fin-reaj-tag{font-size:11px;font-weight:600;color:#8A6D00;margin-top:2px}
.regua-topo{display:flex;justify-content:space-between;align-items:center;gap:12px;border-radius:12px;padding:14px 18px;margin-bottom:16px;border:1px solid #E1E5F2;background:#F4F6FC}
.regua-topo.on{background:#ECF8F1;border-color:#BFE6CF}.regua-topo small{display:block;color:#6B7280;margin-top:2px}
.regua-grid{display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:16px}
@media (max-width:900px){.regua-grid{grid-template-columns:1fr}}
.regua-etapas{margin:4px 0 10px 18px;padding:0}.regua-etapas li{margin:6px 0}.regua-etapas small{display:block;color:#6B7280}
.regua-ass{display:block;font-size:13px;font-weight:600;margin-top:8px}.regua-ass input{margin-top:4px}
.regua-msg{border:1px solid #E1E5F2;border-radius:10px;padding:8px 12px;margin-bottom:8px;background:#fff}
.regua-msg summary{cursor:pointer;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.regua-msg pre{white-space:pre-wrap;font:13px/1.5 Inter,system-ui,sans-serif;background:#ECE5DD;border-radius:8px;padding:10px 12px;margin:8px 0 0}

/* Fluxo de caixa projetado — emitido x previsto (12/10) */
.fdet-fluxo-tabela tr.fdet-fluxo-dia { cursor: pointer; }
.fdet-fluxo-tabela tr.fdet-fluxo-dia:hover td { background: var(--cinza-50); }
.fdet-fluxo-tabela tr.fdet-fluxo-itens td { background: var(--cinza-50); padding: 6px 14px 10px; }
.fdet-fluxo-lista { list-style: none; margin: 0; padding: 0; }
.fdet-fluxo-lista li { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px dashed var(--cinza-200); font-size: 13px; }
.fdet-fluxo-lista li:last-child { border-bottom: none; }
.fdet-fluxo-lista li.pos > strong { color: var(--verde); }
.fdet-fluxo-lista li.neg > strong { color: var(--vermelho); }
.fdash-fluxo-nota { margin: 8px 0 0; font-size: 12px; color: var(--cinza-500); }
.fdet-fluxo-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin-bottom: 14px; }
.fdet-fluxo-kpi { background: #fff; border: 1px solid var(--cinza-200); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.fdet-fluxo-kpi span { font-size: 12px; color: var(--cinza-500); }
.fdet-fluxo-kpi strong { font-size: 18px; }
.fdet-fluxo-kpi small { font-size: 11px; color: var(--cinza-500); }
.fdet-fluxo-kpi.pos strong { color: var(--verde); }
.fdet-fluxo-kpi.neg strong { color: var(--vermelho); }
.fdet-fluxo-alerta { background: #fff8e1; border: 1px solid #f3d27a; border-radius: 8px; padding: 9px 12px; margin-bottom: 10px; font-size: 13px; }
.fdet-fluxo-alerta.risco { background: #fdecec; border-color: #f0a8a8; }
.fdet-pos { color: var(--verde); }
.fdet-neg { color: var(--vermelho); }
.fdet-fluxo-abas { margin: 4px 0 12px; flex-wrap: wrap; }
.fdet-fluxo-grupo { margin: 6px 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--cinza-500); }

/* Card Fluxo de Caixa do dashboard (12/10) */
.fdash-card-full { flex: 1 1 100%; }
.fdash-fluxo-sub { margin: 2px 0 0; font-size: 12px; color: var(--cinza-500); }
.fdash-fluxo-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 10px 0 6px; }
.fdash-fluxo-kpi { border-radius: 10px; padding: 10px 12px; background: var(--cinza-50); border-left: 4px solid var(--cinza-300); display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fdash-fluxo-kpi span { font-size: 12px; color: var(--cinza-600); }
.fdash-fluxo-kpi strong { font-size: 19px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fdash-fluxo-kpi small { font-size: 11px; color: var(--cinza-500); }
.fdash-fluxo-kpi.pos { background: var(--verde-claro); border-left-color: var(--verde); }
.fdash-fluxo-kpi.pos strong { color: var(--verde); }
.fdash-fluxo-kpi.neg { background: var(--vermelho-claro); border-left-color: var(--vermelho); }
.fdash-fluxo-kpi.neg strong { color: var(--vermelho); }
.fdash-fluxo-kpi.azul { background: var(--azul-claro); border-left-color: var(--azul); }
.fdash-fluxo-kpi.azul strong { color: var(--azul); }
.fdash-fluxo-svg { width: 100%; height: 230px; display: block; margin-top: 6px; }
.fdash-fluxo-legenda { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--cinza-600); margin: 4px 0 10px; }
.fdash-fluxo-legenda i { display: inline-block; width: 12px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.fdash-fluxo-legenda .lg-ent { background: var(--verde); }
.fdash-fluxo-legenda .lg-sai { background: var(--vermelho); }
.fdash-fluxo-legenda .lg-saldo { height: 3px; background: var(--azul); vertical-align: 3px; }
.fdash-fluxo-legenda .lg-saldo-fut { height: 0; border-top: 3px dashed var(--azul); border-radius: 0; vertical-align: 3px; }
.fdash-fluxo-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.fdash-fluxo-chip { font-size: 12px; font-weight: 600; padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.fdash-fluxo-chip.verde { background: var(--verde-claro); color: var(--verde); }
.fdash-fluxo-chip.vermelho { background: var(--vermelho-claro); color: var(--vermelho); }
.fdash-fluxo-chip.vermelho-forte { background: var(--vermelho); color: #fff; }
.fdash-fluxo-chip.azul { background: var(--azul-claro); color: var(--azul); }
.fdash-fluxo-chip.amarelo { background: var(--amarelo-claro); color: var(--amarelo); }
.fdash-fluxo-chip.laranja { background: var(--laranja-claro); color: var(--laranja); }
@media (max-width: 900px) { .fdash-fluxo-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Pesquisa de Satisfação v4 (12/10) */
.pq4-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; margin: 14px 0; }
.pq4-card { background: #fff; border: 1px solid var(--cinza-200); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 3px; }
.pq4-card span { font-size: 12.5px; color: var(--cinza-600); }
.pq4-card strong { font-size: 28px; line-height: 1.1; }
.pq4-card strong small { font-size: 14px; color: var(--cinza-500); font-weight: 500; }
.pq4-card em { font-style: normal; font-size: 12px; color: var(--cinza-500); }
.pq4-mini { font-size: 11.5px; color: var(--cinza-500); margin-top: 2px; }
.pq4-tag { display: inline-block; background: var(--vermelho-claro); color: var(--vermelho); border-radius: 999px; padding: 2px 8px; font-size: 11.5px; margin: 1px 0; }
.pq4-resp { margin-top: 10px; display: grid; gap: 8px; }
.pq4-resp-linha { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pq4-setor { font-size: 13px; padding: 8px 10px; border-radius: 8px; }
.pq4-setor.bom { background: var(--verde-claro); }
.pq4-setor.ruim { background: var(--vermelho-claro); }
.pq4-setor-txt { margin-top: 4px; font-style: italic; color: var(--cinza-800); }
.pq4-op { font-size: 13px; padding: 8px 10px; border-radius: 8px; font-style: italic; }
.pq4-op small { display: block; font-style: normal; font-weight: 600; color: var(--cinza-600); margin-bottom: 2px; }
.pq4-op.valoriza { background: var(--azul-claro); }
.pq4-op.melhorar { background: var(--laranja-claro); }
.pq4-op-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 14px 20px; }
.pq4-op-col { border-radius: 12px; padding: 12px; }
.pq4-op-col.valoriza { background: var(--azul-claro); }
.pq4-op-col.melhorar { background: var(--laranja-claro); }
.pq4-op-col h4 { margin: 0 0 8px; font-size: 14px; display: flex; justify-content: space-between; }
.pq4-op-col h4 span { background: #fff; border-radius: 999px; padding: 0 9px; font-size: 12px; }
.pq4-op-item { background: #fff; border-radius: 8px; padding: 9px 11px; margin-bottom: 8px; font-size: 13px; }
.pq4-op-item small { display: block; color: var(--cinza-500); margin-top: 4px; font-size: 11.5px; }
@media (max-width: 800px) { .pq4-op-grid { grid-template-columns: 1fr; } }
.rp-atalhos { display: flex; gap: 6px; flex-wrap: wrap; margin: -4px 0 12px; }

/* Comunicados avulsos (13/10) */
.comu-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 20px; padding: 16px 20px; }
.comu-label { font-size: 12px; color: var(--cinza-600); margin: 0 0 8px; font-weight: 600; }
.comu-balao { background: #DCF8C6; border-radius: 12px 12px 12px 2px; padding: 12px 14px; font-size: 13.5px; line-height: 1.5; box-shadow: 0 1px 2px rgba(0,0,0,.08); max-width: 460px; }
.comu-nota { font-size: 12px; color: var(--cinza-500); margin: 8px 0 0; }
.comu-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.comu-kpis div { background: var(--azul-claro); border-radius: 10px; padding: 10px; text-align: center; }
.comu-kpis strong { display: block; font-size: 22px; color: var(--azul); }
.comu-kpis span { font-size: 11.5px; color: var(--cinza-600); }
.comu-regras { font-size: 12.5px; color: var(--cinza-600); padding-left: 18px; margin: 0 0 12px; line-height: 1.55; }
.comu-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.comu-progresso { padding: 0 20px 16px; }
.comu-barra { height: 10px; background: var(--cinza-100); border-radius: 999px; overflow: hidden; }
.comu-barra span { display: block; height: 100%; background: var(--verde); }
.comu-numeros { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px; margin-top: 8px; }
.comu-problemas { margin-top: 10px; font-size: 13px; }
@media (max-width: 900px) { .comu-grid { grid-template-columns: 1fr; } }
/* Fluxo de caixa v2 (14/10): saldo e semanas separados */
.fdash-fluxo-kpi.mov { background: #F3E8FF; border-left-color: #9333EA; }
.fdash-fluxo-kpi.mov strong { color: #7E22CE; }
.fx-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 18px; margin: 8px 0 12px; }
.fx-bloco { border: 1px solid var(--cinza-100); border-radius: 12px; padding: 10px 12px 6px; }
.fx-titulo { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--cinza-800); }
.fx-titulo span { font-weight: 400; font-size: 11.5px; color: var(--cinza-500); margin-left: 4px; }
.fx-leg { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin: 0 4px 0 8px; vertical-align: -1px; }
.fx-leg.ent, .fx-bar.ent { background: var(--verde); }
.fx-leg.sai, .fx-bar.sai { background: var(--vermelho); }
.fx-semanas { display: flex; gap: 10px; align-items: flex-end; height: 200px; padding-top: 6px; }
.fx-sem { flex: 1; display: flex; flex-direction: column; height: 100%; min-width: 0; }
.fx-sem-barras { flex: 1; display: flex; gap: 4px; align-items: flex-end; border-bottom: 1px solid var(--cinza-200); }
.fx-col { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; min-width: 0; }
.fx-bar { width: 100%; border-radius: 4px 4px 0 0; min-height: 2px; }
.fx-val { font-size: 10.5px; font-weight: 700; margin-bottom: 3px; white-space: nowrap; }
.fx-val.ent { color: var(--verde); } .fx-val.sai { color: var(--vermelho); }
.fx-sem.futuro .fx-bar { opacity: .45; background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.5) 0 4px, transparent 4px 8px); }
.fx-sem-rot { text-align: center; font-size: 11px; color: var(--cinza-600); margin-top: 5px; line-height: 1.25; }
.fx-sem-rot small { display: block; color: var(--cinza-500); font-size: 10px; }
.fx-sem.misto .fx-sem-rot { color: var(--azul); font-weight: 700; }
@media (max-width: 1100px) { .fx-grid { grid-template-columns: 1fr; } }
.fdash-fluxo-kpis { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.fx-svg { width: 100%; height: auto; display: block; }
/* Receber × pagar por mês (14/10) */
.fxm-leg { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11.5px; color: var(--cinza-600); margin: 2px 0 6px; }
.fxm-leg i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.fxm-leg i.rec, .fxm-seg.rec { background: #16A34A; }
.fxm-leg i.aberto-rec, .fxm-seg.aberto-rec { background: #5EEAD4; }
.fxm-leg i.pag, .fxm-seg.pag { background: #DC2626; }
.fxm-leg i.aberto-pag, .fxm-seg.aberto-pag { background: #F59E0B; }
.fxm-meses { display: flex; gap: 8px; height: 215px; align-items: stretch; }
.fxm-mes { flex: 1; display: flex; flex-direction: column; min-width: 0; border-radius: 8px; padding: 2px 2px 0; }
.fxm-mes.atual { background: var(--azul-claro); }
.fxm-cols { flex: 1; display: flex; gap: 3px; align-items: flex-end; border-bottom: 1px solid var(--cinza-200); padding-top: 16px; }
.fxm-col { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; min-width: 0; position: relative; }
.fxm-seg { width: 100%; min-height: 2px; }
.fxm-seg:first-of-type { border-radius: 4px 4px 0 0; }
.fxm-val { font-size: 10px; font-weight: 700; text-align: center; white-space: nowrap; margin-bottom: 2px; }
.fxm-val b { display: block; font-weight: 700; line-height: 1.25; }
.fxm-val .rec { color: #15803D; } .fxm-val .pag { color: #B91C1C; }
.fxm-val .aberto-rec { color: #0F9488; } .fxm-val .aberto-pag { color: #C2710C; }
.fxm-rot { text-align: center; font-size: 11.5px; color: var(--cinza-600); padding: 4px 0 2px; text-transform: capitalize; }
.fxm-rot small { display: block; font-size: 10px; color: var(--cinza-500); text-transform: none; }
.fxm-mes.atual .fxm-rot { color: var(--azul); font-weight: 700; }
.fxm-mes.futuro .fxm-seg { opacity: .8; }
.fx-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); align-items: stretch; }
.fx-bloco { min-width: 0; display: flex; flex-direction: column; }
.fx-bloco .fx-svg { margin-top: auto; margin-bottom: auto; }
.fx-grid.fx-grid-unico { grid-template-columns: 1fr; } .fx-grid-unico .fxm-meses { height: 240px; gap: 14px; }
.fx-grid-unico .fxm-meses { gap: 6px; overflow-x: auto; }
.fx-grid-unico .fxm-mes { min-width: 84px; }
.fx-grid-unico .fxm-cols { padding-top: 30px; }
.fx-grid-unico .fxm-val { font-size: 9.5px; }

/* Contrato — cobrança dividida no mês (15/10): linhas dia + % com o valor de cada parcela. */
.fin-divisao { border: 1px solid var(--cinza-200); border-radius: 10px; padding: 12px 14px; margin: 4px 0 12px; background: var(--cinza-50); }
.fin-divisao-titulo { font-weight: 600; font-size: 13.5px; margin-bottom: 8px; }
.fin-divisao-titulo small { font-weight: 400; color: var(--cinza-600); }
.fin-divisao-linha { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--cinza-200); }
.fin-divisao-linha label { display: flex; flex-direction: column; font-size: 12px; margin: 0; }
.fin-divisao-linha input { width: 96px; }
.fin-div-rot { font-weight: 600; font-size: 13px; min-width: 78px; padding-bottom: 8px; }
.fin-div-valor { font-weight: 600; color: var(--cinza-800); padding-bottom: 8px; min-width: 90px; }
.fin-divisao-linha .fin-div-rem { padding-bottom: 8px; }
.fin-divisao-resumo { font-size: 12.5px; margin-top: 8px; color: var(--cinza-800); }
.fin-desc-resumo { font-size: 14px; margin: 2px 0 10px; min-height: 18px; }

/* Acordos — caixinha "Concluído" (15/10) */
.agenda-acordo-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--cinza-700); padding: 4px 10px; border: 1px solid var(--cinza-200); border-radius: 6px; cursor: pointer; user-select: none; }
.agenda-acordo-check input { width: 15px; height: 15px; accent-color: #198754; cursor: pointer; margin: 0; }
.agenda-acordo-check:has(input:checked) { color: #198754; border-color: #19875455; background: #19875412; }
/* Conciliação — candidato cujo valor exato está em outra linha do extrato (15/10) */
.concil-alerta-outra { display: block; color: #B45309; font-weight: 600; margin-top: 2px; }

/* Envio manual da apresentação (16/10) */
.comu-manual { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--cinza-200); }
.envap-filtros { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; justify-content: space-between; margin-bottom: 10px; }
.envap-filtros .input-padrao { max-width: 320px; }
.envap-tabela td { vertical-align: middle; }
.envap-tabela tr.envap-ok td { opacity: .7; }
.envap-tabela .btn-sm { white-space: nowrap; text-decoration: none; display: inline-block; }

/* Licenças — linha do tempo do processo (19/10) */
.lic-registro { border: 1px dashed var(--cinza-200); border-radius: 8px; padding: 10px 12px 4px; margin: 10px 0 12px; }
.lic-registro legend { font-weight: 700; font-size: 13px; padding: 0 6px; color: var(--azul); }
.lic-registro-dica { font-size: 12px; color: var(--cinza-500); margin: 0 0 8px; }
.lic-aguarda { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 10px; white-space: nowrap; }
.lic-aguarda-escritorio { background: #DBEAFE; color: #1E40AF; }
.lic-aguarda-cliente { background: #FEF3C7; color: #92400E; }
.lic-aguarda-orgao { background: #EDE9FE; color: #5B21B6; }
.lic-timeline { margin-top: 12px; }
.lic-tl-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.lic-tl-topo h3 { margin: 0; font-size: 15px; }
.lic-tl-resumo { font-size: 13px; color: var(--cinza-600); margin: 6px 0 10px; }
.lic-tl-inicial { background: #FFFBEB; border: 1px solid #FCD34D; border-radius: 8px; padding: 10px 12px; margin: 8px 0 12px; font-size: 13px; }
.lic-tl-inicial p { margin: 4px 0 8px; color: var(--cinza-600); }
.lic-tl-novo { border: 1px solid var(--cinza-200); border-radius: 8px; padding: 8px 12px; margin: 8px 0 12px; }
.lic-tl-novo summary { cursor: pointer; font-weight: 700; color: var(--azul); font-size: 13px; }
.lic-tl-novo[open] summary { margin-bottom: 8px; }
.lic-tl-lista { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--cinza-200); }
.lic-tl-item { display: flex; gap: 12px; padding: 8px 0 8px 12px; position: relative; }
.lic-tl-item::before { content: ''; position: absolute; left: -6px; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--azul); }
.lic-tl-item.lic-tl-legado::before { background: var(--cinza-300, #cbd5e1); }
.lic-tl-item.lic-tl-travado::before, .lic-tl-item.lic-tl-exigencia::before { background: #DC2626; }
.lic-tl-data { font-weight: 700; font-size: 12.5px; min-width: 78px; color: var(--cinza-700); }
.lic-tl-corpo { flex: 1; min-width: 0; }
.lic-tl-desc { font-size: 13px; }
.lic-tl-obs { font-size: 12.5px; color: var(--cinza-600); margin-top: 2px; white-space: pre-wrap; }
.lic-tl-meta { font-size: 11px; color: var(--cinza-500); margin-top: 2px; }
.lic-tl-corrigido .lic-tl-desc { text-decoration: line-through; color: var(--cinza-500); }
.lic-tl-tag { font-size: 10.5px; background: var(--cinza-100); color: var(--cinza-600); padding: 1px 6px; border-radius: 8px; text-decoration: none; display: inline-block; }
/* Licenças — Fase 2: dias por responsável e cobrança ao cliente */
.lic-dias { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 6px 0; font-size: 12px; }
.lic-dias-item { padding: 2px 8px; border-radius: 10px; }
.lic-dias-atual { color: var(--cinza-600); font-size: 12px; }
.lcc-previas { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 10px 0; }
.lcc-previas .comu-balao { font-size: 12.5px; }

/* Licenças — cartão redesenhado (19/10) */
.lic-card { border: 1px solid var(--cinza-200); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; background: #fff; }
.lic-card-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.lic-card-titulo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.lic-card-titulo strong { font-size: 15px; color: var(--cinza-800); }
.lic-card-acoes { display: flex; gap: 6px; flex-wrap: wrap; }
.lic-card-acoes .btn-sm { padding: 5px 10px; font-size: 12.5px; }
.lic-card-corpo { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: center; margin-top: 10px; }
.lic-card-stepper { min-width: 0; }
.lic-card-stepper > * { margin: 0 !important; }
.lic-card-info { display: flex; flex-direction: column; gap: 4px; border-left: 1px solid var(--cinza-100); padding-left: 14px; }
.lic-card-info-linha { flex-direction: row; flex-wrap: wrap; gap: 6px 22px; border-left: 0; padding-left: 0; margin-top: 8px; }
.lic-info-linha { display: flex; flex-direction: column; font-size: 12.5px; line-height: 1.3; }
.lic-info-linha span { color: var(--cinza-500); font-size: 11px; text-transform: uppercase; letter-spacing: .3px; }
.lic-info-linha b { color: var(--cinza-800); font-weight: 600; }
.lic-falta { color: var(--cinza-500); font-weight: 400; font-style: italic; }
.lic-card-dias { margin-top: 10px; }
.lic-barra { display: flex; height: 8px; border-radius: 6px; overflow: hidden; background: var(--cinza-100); gap: 2px; }
.lic-barra-seg { display: block; min-width: 6px; }
.lic-barra-escritorio { background: #3B82F6; } .lic-barra-cliente { background: #F59E0B; } .lic-barra-orgao { background: #8B5CF6; }
.lic-barra-vazia { background: var(--cinza-100); }
.lic-barra-leg { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--cinza-600); margin-top: 5px; align-items: center; }
.lic-barra-leg i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.lic-barra-total { margin-left: auto; }
.lic-card .aviso-exigencia, .lic-aviso-cliente { margin-top: 8px; }
.lic-aviso-cliente { background: #FFFBEB; border: 1px solid #FCD34D; color: #92400E; border-radius: 6px; padding: 6px 10px; font-size: 12.5px; }
.lic-card-obs { margin-top: 8px; font-size: 12.5px; color: var(--cinza-600); white-space: pre-wrap; }
.lic-card-anexos { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--cinza-100); font-size: 12.5px; }
.lic-anexos-rot { color: var(--cinza-500); font-weight: 600; }
.lic-anexar { cursor: pointer; }
.lic-anexar.enviando { opacity: .6; pointer-events: none; }
@media (max-width: 640px) {
  .lic-card-corpo { grid-template-columns: 1fr; }
  .lic-card-info { border-left: 0; padding-left: 0; }
  .lic-barra-total { margin-left: 0; }
}

/* Pesquisa — acompanhamento de envios (20/10) */
.pq-funil { display: flex; align-items: stretch; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.pq-funil > div:not(.pq-funil-seta) { background: #fff; border: 1px solid var(--cinza-200); border-radius: 10px; padding: 10px 14px; min-width: 130px; display: flex; flex-direction: column; }
.pq-funil strong { font-size: 22px; color: var(--azul); line-height: 1.1; }
.pq-funil span { font-size: 12px; color: var(--cinza-600); }
.pq-funil small { font-size: 11px; color: var(--cinza-500); margin-top: 2px; }
.pq-funil-seta { align-self: center; font-size: 22px; color: var(--cinza-300, #cbd5e1); }
.pq-funil .pq-funil-fim { border-color: #86EFAC; background: #F0FDF4; }
.pq-funil .pq-funil-fim strong { color: #15803D; }
.pq-funil .pq-funil-alerta { margin-left: auto; border-color: #FCD34D; background: #FFFBEB; }
.pq-funil .pq-funil-alerta strong { color: #B45309; }
.pq-canais-filtro { display: flex; flex-wrap: wrap; gap: 4px; }
.pq-canais-filtro button { border: 1px solid var(--cinza-200); background: #fff; border-radius: 14px; padding: 3px 10px; font-size: 12px; color: var(--cinza-600); cursor: pointer; }
.pq-canais-filtro button b { color: var(--cinza-800); margin-left: 2px; }
.pq-canais-filtro button.ativo { background: var(--azul); border-color: var(--azul); color: #fff; }
.pq-canais-filtro button.ativo b { color: #fff; }
.pq-ch { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.pq-ch-ok { background: #DCFCE7; color: #15803D; }
.pq-ch-espera { background: #FEF3C7; color: #92400E; }
.pq-ch-falha { background: #FEE2E2; color: #B91C1C; }
.pq-ch-vazio { background: var(--cinza-100); color: var(--cinza-500); font-weight: 600; }
.pq-ch-det { display: block; font-size: 11px; color: var(--cinza-500); margin-top: 2px; }
.pq-tab-envios td { vertical-align: top; }