:root {
  --bg: #0f172a;
  --card: #1e293b;
  --card2: #273449;
  --text: #e2e8f0;
  --muted: #94a3b8;
  --primary: #2563eb;
  --primary-hover: #1d4ed8;
  --danger: #dc2626;
  --ok: #16a34a;
  --border: #334155;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
}

.hidden { display: none !important; }

/* Login */
.login-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  min-height: 100vh;
  padding: 1rem;
}
/* Logo ART centralizado acima do card de login. O arquivo original é enorme
   (1772×1182) e "1:1" estouraria a tela; então limitamos à largura do card,
   mantendo a proporção (largura auto). */
.login-logo { width: auto; height: auto; max-width: min(100%, 380px); display: block; }
.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2rem;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 10px 30px rgba(0,0,0,.3);
}
.card h1 { margin: 0 0 .25rem; font-size: 1.5rem; }
.card .sub { color: var(--muted); margin: 0 0 1.5rem; font-size: .9rem; }

label { display: block; font-size: .85rem; color: var(--muted); margin: .75rem 0 .25rem; }
input, select {
  width: 100%;
  padding: .6rem .75rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: var(--text);
  font-size: .95rem;
}
input:focus, select:focus { outline: 2px solid var(--primary); border-color: transparent; }

button {
  cursor: pointer;
  border: none;
  border-radius: 8px;
  padding: .6rem 1rem;
  font-size: .95rem;
  font-weight: 600;
  background: var(--primary);
  color: white;
  transition: background .15s;
}
button:hover { background: var(--primary-hover); }
button.secondary { background: var(--card2); color: var(--text); border: 1px solid var(--border); }
button.danger { background: var(--danger); }
button:disabled { opacity: .6; cursor: not-allowed; }

.btn-full { width: 100%; margin-top: 1.25rem; }

.erro { color: #fca5a5; font-size: .85rem; margin-top: .75rem; min-height: 1.2em; }
.ok-msg { color: #86efac; font-size: .85rem; margin-top: .75rem; }

/* App shell */
header.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 74px;
  padding: 0 1.5rem;
  background: var(--card);
  border-bottom: 1px solid var(--border);
}
header.topbar .brand { font-weight: 700; font-size: 1.1rem; display: flex; align-items: center; gap: .9rem; }
/* Logo ART: dobrado (96px), largura automática (mantém a proporção). A barra
   mantém a altura (74px); o logo transborda a linha sem aumentá-la. */
header.topbar .brand-logo { height: 96px; width: auto; display: block; }
header.topbar .right { display: flex; align-items: center; gap: 1rem; }
header.topbar .user { color: var(--muted); font-size: .9rem; }

/* Shell: sidebar + conteúdo.
   Header + menu ficam fixos; só o conteúdo rola (padrão app-shell). */
.shell { display: flex; align-items: stretch; height: calc(100vh - 74px); overflow: hidden; }

.sidebar {
  width: 200px;
  flex-shrink: 0;
  background: var(--card);
  border-right: 1px solid var(--border);
  padding: 1rem .75rem;
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 100%;
  text-align: left;
  background: transparent;
  color: var(--text);
  font-weight: 500;
  padding: .6rem .75rem;
  border-radius: 8px;
}
.nav-item:hover { background: var(--card2); }
.nav-item.active { background: var(--primary); color: #fff; }
.nav-ico { font-size: 1rem; }

main.content { flex: 1; padding: 1.5rem; min-width: 0; overflow-y: auto; }

@media (max-width: 720px) {
  /* No mobile volta a rolar a página inteira (menu vira linha no topo). */
  .shell { flex-direction: column; height: auto; overflow: visible; }
  .sidebar { width: auto; flex-direction: row; border-right: none; border-bottom: 1px solid var(--border); }
  main.content { overflow-y: visible; }
}

.panel {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.panel h2 { margin: 0 0 1rem; font-size: 1.2rem; }

table { width: 100%; border-collapse: collapse; font-size: .9rem; }
th, td { text-align: left; padding: .6rem .75rem; border-bottom: 1px solid var(--border); }
th { color: var(--muted); font-weight: 600; }
.actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.actions button { padding: .35rem .6rem; font-size: .8rem; }
.edit-input { padding: .3rem .4rem; font-size: .85rem; width: 100%; min-width: 120px; }

.badge { font-size: .75rem; padding: .15rem .5rem; border-radius: 999px; }
.badge.admin { background: #1e3a8a; color: #bfdbfe; }
.badge.viewer { background: #334155; color: #cbd5e1; }
.badge.off { background: #7f1d1d; color: #fecaca; }

.row-form { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr auto; gap: .75rem; align-items: end; }
.row-form label { margin-top: 0; }
@media (max-width: 800px) { .row-form { grid-template-columns: 1fr; } }

.muted { color: var(--muted); font-size: .85rem; }

/* Painel de fluxo */
.painel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.controls { display: flex; gap: 1rem; align-items: end; flex-wrap: wrap; }
.controls label { margin: 0 0 .25rem; }
.controls select { min-width: 130px; }
.control-atualizar { display: flex; flex-direction: column; gap: .25rem; }
#atualizado-em { white-space: nowrap; }

/* Tabela compacta: cabe os 12 meses sem rolagem horizontal */
.tabela-fluxo {
  width: 100%;
  table-layout: fixed;
  font-variant-numeric: tabular-nums;
  font-size: clamp(.62rem, .9vw, .82rem);
}
.tabela-fluxo th, .tabela-fluxo td {
  text-align: right;
  white-space: nowrap;
  padding: .45rem .3rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tabela-fluxo th:first-child, .tabela-fluxo td:first-child {
  text-align: left;
  width: 78px;
  font-weight: 600;
}
.tabela-fluxo thead th { color: var(--muted); font-weight: 600; }
.tabela-fluxo .linha-rotulo { color: var(--text); }
.tabela-fluxo .neg { color: #fca5a5; }
.tabela-fluxo tbody tr:not(:last-child) td { border-bottom: 1px solid var(--border); }
.tabela-fluxo tr.row-saldoac td { border-top: 2px solid var(--border); font-weight: 700; }
.tabela-fluxo .mes-proj { background: rgba(37, 99, 235, .10); }
.tabela-fluxo .mes-misto { background: rgba(37, 99, 235, .05); }
.tabela-fluxo th.mes-proj, .tabela-fluxo th.mes-misto { color: #93c5fd; }
.proj-tag { font-size: .6rem; display: block; color: #93c5fd; }
.tabela-nota { margin: .5rem 0 0; }

.grafico-wrap { margin-top: 1.5rem; position: relative; height: 380px; width: 100%; }
.grafico-wrap canvas { width: 100% !important; height: 100% !important; }

/* Tabela: Entradas por cliente × mês */
.clientes-bloco { margin-top: 2rem; }
.clientes-titulo {
  font-size: .8rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 .75rem;
}
.clientes-scroll { max-height: 460px; overflow: auto; border: 1px solid var(--border); border-radius: 8px; }
.tabela-clientes {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-variant-numeric: tabular-nums;
  font-size: .82rem;
}
.tabela-clientes th, .tabela-clientes td {
  text-align: right;
  white-space: nowrap;
  padding: .5rem .7rem;
  border-bottom: 1px solid var(--border);
}
.tabela-clientes thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--card2);
  color: var(--muted);
  font-weight: 600;
}
.tabela-clientes .col-cliente {
  text-align: left;
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--card);
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
}
.tabela-clientes thead th.col-cliente { z-index: 3; background: var(--card2); }
.tabela-clientes thead th.col-total, .tabela-clientes td.col-total {
  color: #4ade80;
  font-weight: 700;
}
.tabela-clientes tbody tr:hover td { background: rgba(148, 163, 184, .06); }
.tabela-clientes tbody tr:hover td.col-cliente { background: #243044; }
.tabela-clientes .cell-zero { color: #64748b; background: rgba(234, 179, 8, .07); }

/* Saídas por categoria → subcategoria → fornecedor (árvore expansível) */
.tabela-saidas .saida-val, .tabela-saidas .saida-total { color: #fca5a5; }
.tabela-saidas .expansivel { cursor: pointer; }
.tabela-saidas .seta, .tabela-saidas .seta-vazia {
  display: inline-block; width: 1em; margin-right: .35rem; color: var(--muted); font-size: .7rem;
}
.tabela-saidas .expansivel:hover td { background: rgba(148, 163, 184, .1); }
/* Profundidade: 0 = categoria (forte), 1 = subcategoria, 2+ = fornecedor (folha) */
.tabela-saidas .col-cliente.nivel-0 { font-weight: 600; }
.tabela-saidas .col-cliente.nivel-1 { font-weight: 500; }
.tabela-saidas .col-cliente.nivel-2, .tabela-saidas .col-cliente.nivel-3 { font-weight: 400; color: var(--muted); }

/* Previsto × Realizado por cliente × mês (monitor de acurácia) */
.prevreal-sub { font-size: .78rem; color: var(--muted); margin: -.35rem 0 .75rem; }
.pr-tag { padding: .05rem .4rem; border-radius: 5px; font-weight: 600; font-size: .72rem; }
.pr-tag.pr-prev { color: #bfdbfe; background: rgba(59, 130, 246, .18); }
.pr-tag.pr-real { color: #bbf7d0; background: rgba(16, 185, 129, .18); }
/* Coluna Cliente com largura fixa para a coluna de tipo poder fixar logo após ela. */
.tabela-prevreal .col-cliente { width: 200px; min-width: 200px; max-width: 200px; }
.tabela-prevreal .col-tipo {
  text-align: left; position: sticky; left: 200px; z-index: 1; background: var(--card);
  min-width: 96px;
  font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
}
.tabela-prevreal thead th.col-tipo { z-index: 3; background: var(--card2); }
.tabela-prevreal td.col-tipo.pr-prev { color: #93c5fd; }
.tabela-prevreal td.col-tipo.pr-real { color: #6ee7b7; }
/* Colunas fixas opacas no hover e na linha de totais (senão o conteúdo passa por baixo) */
.tabela-prevreal tbody tr:hover td.col-tipo { background: #243044; }
.tabela-prevreal .pr-total-linha td.col-tipo { background: #243044; }
/* Como a 1ª coluna (cliente) tem rowspan, a coluna de tipo é a "sticky" da 2ª linha */
.tabela-prevreal .pr-prev-val { color: #93c5fd; }         /* previsto: azul suave */
.tabela-prevreal .pr-real-val { color: #cbd5e1; }         /* realizado sem previsão: neutro */
.tabela-prevreal td.pr-ok { color: #4ade80; }             /* alcançou/superou a previsão */
.tabela-prevreal td.pr-abaixo { color: #fbbf24; background: rgba(234, 179, 8, .09); } /* abaixo */
/* Override do verde padrão de col-total para refletir a acurácia */
.tabela-prevreal td.col-total.pr-abaixo { color: #fbbf24; }
.tabela-prevreal td.col-total.pr-prev-val { color: #93c5fd; }
.tabela-prevreal .pr-total-linha td { background: rgba(148, 163, 184, .10); font-weight: 700; }
.tabela-prevreal .pr-total-linha td.col-cliente { background: #243044; }

/* Visão por dia (extrato diário consolidado) */
.diario-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: .5rem; }
.diario-filtros { display: flex; gap: .75rem; align-items: center; }
.diario-filtros label { font-size: .8rem; color: var(--muted); display: flex; align-items: center; gap: .4rem; }
.diario-filtros select { background: var(--card2); color: var(--text); border: 1px solid var(--border); border-radius: 6px; padding: .35rem .5rem; }
.tabela-diario .col-dia {
  text-align: left; position: sticky; left: 0; z-index: 1; background: var(--card);
  width: 64px; min-width: 64px; font-variant-numeric: tabular-nums;
}
.tabela-diario thead th.col-dia { z-index: 3; background: var(--card2); }
/* Alinha o cabeçalho com as células: textuais à esquerda, Valor/Saldo à direita. */
.tabela-diario thead th { text-align: left; }
.tabela-diario thead th.col-total { text-align: right; }
.tabela-diario td.di-cat { text-align: left; font-weight: 400; color: var(--text); max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
.tabela-diario .col-tipo { text-align: left; }
.di-tag { padding: .08rem .45rem; border-radius: 5px; font-size: .72rem; font-weight: 600; white-space: nowrap; }
.di-tag.di-ent { color: #bbf7d0; background: rgba(16, 185, 129, .18); }
.di-tag.di-sai { color: #fecaca; background: rgba(239, 68, 68, .16); }
.di-tag.di-prev { color: #bfdbfe; background: rgba(59, 130, 246, .18); }
.di-prev-res { font-size: .68rem; color: var(--muted); margin-left: .35rem; }
.tabela-diario td.col-total.di-ent-val { color: #4ade80; }
.tabela-diario td.col-total.di-sai-val { color: #fca5a5; }
.tabela-diario td.col-total.di-prev-val { color: #93c5fd; }

/* Cards "Saúde do caixa" */
.saude-cards { display: flex; gap: .75rem; flex-wrap: wrap; margin: .25rem 0 1.25rem; }
.saude-card {
  flex: 1 1 180px; min-width: 180px; background: var(--card2); border: 1px solid var(--border);
  border-left: 4px solid var(--muted); border-radius: 10px; padding: .8rem .9rem;
}
.saude-card.cor-verde { border-left-color: #4ade80; }
.saude-card.cor-ambar { border-left-color: #fbbf24; }
.saude-card.cor-vermelho { border-left-color: #f87171; }
.saude-card.cor-neutro { border-left-color: #64748b; }
.sc-titulo { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.sc-valor { font-size: 1.5rem; font-weight: 700; margin: .2rem 0; font-variant-numeric: tabular-nums; }
.saude-card.cor-verde .sc-valor { color: #4ade80; }
.saude-card.cor-ambar .sc-valor { color: #fbbf24; }
.saude-card.cor-vermelho .sc-valor { color: #f87171; }
.sc-sub { font-size: .74rem; color: var(--muted); }
.sc-badges { margin-top: .5rem; display: flex; flex-direction: column; gap: .25rem; }
.sc-badge.alerta { font-size: .68rem; color: #fecaca; background: rgba(239, 68, 68, .16); padding: .12rem .4rem; border-radius: 5px; }
.sc-spark { margin-top: .4rem; height: 22px; color: #64748b; }
.sc-spark.cor-verde { color: #4ade80; } .sc-spark.cor-ambar { color: #fbbf24; } .sc-spark.cor-vermelho { color: #f87171; }
.sc-spark .spark { display: block; width: 100%; }

/* Aging de recebíveis */
.tabela-aging td.col-total { color: var(--text); font-weight: 500; }
.tabela-aging td.col-total.ag-avencer { color: #94a3b8; }
.tabela-aging td.col-total.ag-60 { color: #f87171; font-weight: 700; }
.tabela-aging thead th.col-total { text-align: right; }
.tabela-aging .col-cliente { max-width: 280px; }

/* Concentração de entradas (barras horizontais) */
.conc-barras { display: flex; flex-direction: column; gap: .35rem; }
.conc-linha { display: grid; grid-template-columns: minmax(120px, 1.6fr) 3fr minmax(90px, auto) 48px 88px; gap: .6rem; align-items: center; font-size: .82rem; }
.conc-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conc-barra-wrap { background: rgba(148, 163, 184, .12); border-radius: 5px; height: 16px; overflow: hidden; }
.conc-barra { height: 100%; background: linear-gradient(90deg, #3b82f6, #60a5fa); border-radius: 5px; }
.conc-val { text-align: right; font-variant-numeric: tabular-nums; color: #4ade80; }
.conc-pct { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.conc-acum { text-align: right; font-size: .72rem; color: var(--muted); }
.conc-demais .conc-nome { color: var(--muted); font-style: italic; }
.conc-demais .conc-barra { background: #475569; }
@media (max-width: 720px) {
  .conc-acum { display: none; }
  .conc-linha { grid-template-columns: minmax(90px, 1.4fr) 2fr minmax(80px, auto) 44px; }
}
.tabela-diario td.col-total.di-saldo { color: var(--text); font-weight: 700; }
.tabela-diario td.col-total.di-saldo.di-neg { color: #fca5a5; }
.tabela-saidas .sub-row td { background: rgba(0, 0, 0, .12); }

/* Pipeline */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .85rem; margin-bottom: 1.75rem; }
.kpi-card {
  position: relative;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem 1.1rem 1.05rem 1.25rem;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,.18);
  transition: transform .12s ease, box-shadow .12s ease;
}
.kpi-card::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
  background: var(--kpi-cor, #2563EB);
}
.kpi-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.28); }
.kpi-topo { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.kpi-ico {
  width: 26px; height: 26px; border-radius: 7px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: .9rem;
  background: color-mix(in srgb, var(--kpi-cor, #2563EB) 22%, transparent);
}
.kpi-label { font-size: .74rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; font-weight: 600; line-height: 1.15; }
.kpi-valor { font-size: 2rem; font-weight: 800; color: #f1f5f9; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.kpi-card:has(.kpi-sub) .kpi-valor { font-size: 1.5rem; }
.kpi-sub { margin-top: .3rem; font-size: .72rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.pipe-sep { margin-top: 2.2rem; }
.pipe-graf2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: .5rem; }
@media (max-width: 820px) { .pipe-graf2 { grid-template-columns: 1fr; } }
.grafico-card { background: var(--card2); border: 1px solid var(--border); border-radius: 10px; padding: .9rem 1rem 1.1rem; }
.grafico-titulo { margin: 0 0 .6rem; font-size: .92rem; font-weight: 600; color: #cbd5e1; }
.grafico-box { position: relative; height: 300px; width: 100%; margin-bottom: 1rem; }
.grafico-box.grafico-box-alto { height: 360px; }
.grafico-box canvas { width: 100% !important; height: 100% !important; }
.grafico-sub { font-weight: 400; font-size: .82rem; }

/* Projetos: painel de conciliação */
.conc-bloco { border: 1px solid var(--border); border-radius: 8px; margin-bottom: .5rem; background: var(--card2); }
.conc-bloco > summary { cursor: pointer; padding: .6rem .8rem; font-size: .9rem; color: #cbd5e1; list-style: none; }
.conc-bloco > summary b { float: right; color: #94a3b8; }
.conc-bloco.conc-alerta > summary { color: #fca5a5; }
.conc-bloco.conc-alerta > summary b { color: #ef4444; }
.conc-lista { max-height: 260px; overflow: auto; border-top: 1px solid var(--border); }
.conc-row { display: flex; justify-content: space-between; gap: 1rem; padding: 4px 12px; font-size: .82rem; color: #cbd5e1; border-bottom: 1px solid var(--border); font-variant-numeric: tabular-nums; }
.conc-row span:last-child { white-space: nowrap; color: #e2e8f0; }

/* Carteira de clientes: mini-lista de new logos + churn */
.newlogo-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; align-items: center; }
@media (max-width: 820px) { .newlogo-wrap { grid-template-columns: 1fr; } }
.newlogo-wrap .mini-lista { margin-top: 0; max-height: 300px; }
.mini-lista { margin-top: .6rem; max-height: 160px; overflow: auto; }
.mini-row { display: flex; justify-content: space-between; gap: .5rem; font-size: .8rem; padding: 4px 6px; border-bottom: 1px solid var(--border); color: #cbd5e1; }
.mini-row span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-row span:last-child { font-variant-numeric: tabular-nums; color: #4ade80; font-weight: 700; white-space: nowrap; }
.churn-scroll { max-height: 320px; }

/* Análise de Perdas: filtros + heatmap */
.perdas-filtros { display: flex; flex-wrap: wrap; gap: 1rem; margin: .3rem 0 1rem; }
.perdas-filtros > div { display: flex; flex-direction: column; gap: .25rem; }
.perdas-filtros label { font-size: .72rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.perdas-filtros select { min-width: 170px; }
.heatmap { overflow: auto; max-height: 360px; border: 1px solid var(--border); border-radius: 8px; }
.heatmap table { border-collapse: separate; border-spacing: 0; width: 100%; font-size: .74rem; font-variant-numeric: tabular-nums; }
.heatmap th, .heatmap td { padding: 5px 8px; text-align: center; white-space: nowrap; border-bottom: 1px solid var(--border); }
.heatmap thead th { position: sticky; top: 0; background: var(--card2); color: var(--muted); font-weight: 600; z-index: 2; }
.heatmap td.motivo, .heatmap th.motivo { position: sticky; left: 0; background: var(--card2); text-align: left; color: #cbd5e1; font-weight: 600; z-index: 1; }
.heatmap thead th.motivo { z-index: 3; }
.heatmap td.cell { color: #e2e8f0; }
.heatmap td.tot { font-weight: 700; background: rgba(148,163,184,.10); }
.badge-fase { display: inline-block; font-size: .72rem; padding: .15rem .5rem; border-radius: 999px; background: #1e3a5f; color: #bfdbfe; white-space: nowrap; }
.tabela-ops th.th-esq { text-align: left; }
.tabela-ops th { white-space: nowrap; }
/* Vagas: box de alerta (vagas sem CV) */
.alerta-box { border: 1px solid rgba(239, 68, 68, .4); background: rgba(239, 68, 68, .08); border-radius: 10px; padding: .9rem 1rem 1rem; }
.alerta-titulo { font-weight: 700; color: #fca5a5; margin-bottom: .5rem; }
/* Vagas: linha sem currículo anexado (alerta) */
.tabela-ops tr.sem-cv td { background: rgba(245, 158, 11, .10); }
.tabela-ops tr.sem-cv td:first-child { box-shadow: inset 3px 0 0 #f59e0b; }
/* Tabela de oportunidades: linhas mais altas e área maior (≥20 itens antes de rolar). */
.ops-scroll { max-height: 940px; }
.tabela-ops td { padding-top: .72rem; padding-bottom: .72rem; }

/* Estado de carregamento */
.loading { display: flex; align-items: center; gap: .5rem; color: var(--muted); padding: .75rem 0; }
.spinner {
  width: 16px; height: 16px;
  border: 2px solid var(--border);
  border-top-color: var(--primary);
  border-radius: 50%;
  display: inline-block;
  animation: girar .7s linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }

/* Tabela: no desktop cabe tudo; no mobile rola horizontalmente em vez de truncar */
.tabela-scroll { width: 100%; }
@media (max-width: 720px) {
  .tabela-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* colunas se ajustam ao conteúdo e a tabela rola, sem cortar números */
  .tabela-fluxo { table-layout: auto; width: auto; min-width: 100%; font-size: .74rem; }
  .tabela-fluxo th, .tabela-fluxo td { overflow: visible; text-overflow: clip; padding: .45rem .5rem; }
}
.note {
  background: var(--card2);
  border-left: 3px solid var(--primary);
  padding: .75rem 1rem;
  border-radius: 6px;
  font-size: .88rem;
  color: var(--muted);
}
/* Grupo C — linha do tempo (timeline) da vaga */
.c-timeline {
  display: flex;
  width: 100%;
  height: 34px;
  border-radius: 6px;
  overflow: hidden;
  margin: .4rem 0 .8rem;
  background: rgba(148, 163, 184, .1);
}
.c-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2px;
  font-size: 10px;
  font-weight: 700;
  color: #0b1220;
  overflow: hidden;
  white-space: nowrap;
  border-right: 1px solid rgba(15, 23, 42, .45);
}
.c-seg:last-child { border-right: 0; }
.c-amostra { margin-bottom: 1.1rem; }
.c-amostra-tit { font-size: .82rem; color: var(--muted); margin: .2rem 0; }
.c-amostra-tit b { color: #e2e8f0; }
/* Contábil — alertas e toggle de modo da DRE */
.ct-alertas { display: flex; flex-wrap: wrap; gap: 8px; margin: .3rem 0 1rem; }
.ct-alerta-badge { background: #7f1d1d; color: #fecaca; border: 1px solid #b91c1c; border-radius: 20px; padding: 4px 12px; font-size: .85rem; font-weight: 700; }
.ct-toggle { display: inline-flex; gap: 4px; }
.ct-toggle button { background: var(--card2); color: var(--muted); border: 1px solid var(--border); border-radius: 6px; padding: 5px 10px; cursor: pointer; font-size: .85rem; }
.ct-toggle button.ativo { background: var(--primary); color: #fff; border-color: var(--primary); }
.ct-grupo-lbl td { background: rgba(148,163,184,.12); font-weight: 700; color: #cbd5e1; }