/* ==========================================================================
   Recrutamento Peroba — folha de estilo
   Tema industrial: grafite, azul de máquina e laranja de sinalização.
   ========================================================================== */

:root{
  color-scheme: light;

  --ground:#EDEFF1;
  --surface:#FFFFFF;
  --surface-2:#F5F7F8;
  --surface-3:#E9EDEF;
  --ink:#1A1F24;
  --ink-2:#3C464F;
  --muted:#5F6B75;
  --faint:#8A959E;
  --line:#D6DBE0;
  --line-forte:#BFC7CE;

  --brand:#1F3A5F;
  --brand-2:#2C5180;
  --brand-fraco:#E6ECF4;
  --sobre-brand:#FFFFFF;

  --signal:#E4571A;
  --signal-2:#C4460F;
  --signal-fraco:#FDEDE4;

  --ok:#15704A;
  --ok-fraco:#E2F2EB;
  --warn:#96600A;
  --warn-fraco:#FBF0DC;
  --crit:#AC2A20;
  --crit-fraco:#FBE7E5;
  --info:#1F5E8C;
  --info-fraco:#E4EFF7;
  --roxo:#5B3E8E;
  --roxo-fraco:#EDE7F6;

  --r-sm:5px;
  --r:8px;
  --r-lg:12px;

  --sombra:0 1px 2px rgba(20,28,36,.06), 0 2px 8px rgba(20,28,36,.05);
  --sombra-alta:0 8px 30px rgba(20,28,36,.18);

  --f-titulo:"Archivo", "Segoe UI", system-ui, sans-serif;
  --f-texto:"IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, "Cascadia Mono", monospace;

  --topo:58px;
  --rail:210px;
}

*{ box-sizing:border-box; }

html,body{ height:100%; }

body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--f-texto);
  font-size:14px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  overflow:hidden;
}

h1,h2,h3,h4{ font-family:var(--f-titulo); margin:0; text-wrap:balance; }
h1{ font-size:20px; font-weight:600; letter-spacing:-.01em; }
h2{ font-size:15px; font-weight:600; }
h3{ font-size:13px; font-weight:600; }
p{ margin:0; }
[hidden]{ display:none !important; }

button,input,select,textarea{ font:inherit; color:inherit; }
:focus-visible{ outline:2px solid var(--brand-2); outline-offset:2px; border-radius:3px; }

/* ==========================================================================
   BOTÕES
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  border:1px solid var(--line-forte); background:var(--surface); color:var(--ink);
  border-radius:var(--r); padding:0 14px; height:40px;
  font-family:var(--f-titulo); font-weight:600; font-size:13.5px;
  cursor:pointer; white-space:nowrap; transition:background .12s, border-color .12s, transform .04s;
}
.btn:hover{ background:var(--surface-2); border-color:var(--faint); }
.btn:active{ transform:translateY(1px); }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.btn svg{ width:17px; height:17px; flex:none; }

.btn-signal{ background:var(--signal); border-color:var(--signal); color:#fff; }
.btn-signal:hover{ background:var(--signal-2); border-color:var(--signal-2); }
.btn-brand{ background:var(--brand); border-color:var(--brand); color:#fff; }
.btn-brand:hover{ background:var(--brand-2); border-color:var(--brand-2); }
.btn-ghost{ background:transparent; border-color:transparent; color:var(--ink-2); }
.btn-ghost:hover{ background:var(--surface-3); border-color:transparent; }
.btn-perigo{ background:var(--crit); border-color:var(--crit); color:#fff; }
.btn-perigo:hover{ background:#8F221A; border-color:#8F221A; }
.btn-sm{ height:34px; padding:0 11px; font-size:12.5px; }
.btn-lg{ height:48px; padding:0 20px; font-size:15px; }
.btn-icon{ width:36px; padding:0; }
.btn-bloco{ width:100%; }

/* ==========================================================================
   CAMPOS
   ========================================================================== */
.campo{
  width:100%; height:40px; padding:0 11px;
  border:1px solid var(--line-forte); border-radius:var(--r);
  background:var(--surface); color:var(--ink); font-size:14px;
}
.campo:hover{ border-color:var(--faint); }
.campo:focus{ outline:none; border-color:var(--brand-2); box-shadow:0 0 0 3px var(--brand-fraco); }
textarea.campo{ height:auto; min-height:74px; padding:9px 11px; resize:vertical; line-height:1.45; }
select.campo{ appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%235F6B75' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center; background-size:18px; padding-right:30px; }
.campo-busca{ width:230px; max-width:100%; }

.rotulo{
  display:block; font-family:var(--f-titulo); font-size:11px; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:5px;
}
.campo-grupo{ min-width:0; }
.campo-ajuda{ font-size:11.5px; color:var(--faint); margin-top:4px; }
.campo-erro{ border-color:var(--crit) !important; }

/* caixas de marcar */
.marcaveis{ display:flex; flex-wrap:wrap; gap:7px; }
.marcavel{
  display:inline-flex; align-items:center; gap:7px;
  border:1px solid var(--line-forte); border-radius:var(--r);
  padding:8px 12px; background:var(--surface); cursor:pointer;
  font-size:13.5px; user-select:none; transition:border-color .12s, background .12s;
}
.marcavel:hover{ border-color:var(--faint); background:var(--surface-2); }
.marcavel input{ width:17px; height:17px; margin:0; accent-color:var(--brand); cursor:pointer; flex:none; }
.marcavel.is-marcado{ border-color:var(--brand); background:var(--brand-fraco); color:var(--brand); font-weight:500; }

.sim-nao{ display:inline-flex; border:1px solid var(--line-forte); border-radius:var(--r); overflow:hidden; }
.sim-nao button{
  border:0; background:var(--surface); padding:0 16px; height:38px; cursor:pointer;
  font-family:var(--f-titulo); font-weight:600; font-size:13px; color:var(--muted);
}
.sim-nao button + button{ border-left:1px solid var(--line); }
.sim-nao button.is-ativo{ background:var(--brand); color:#fff; }
.sim-nao button.is-ativo[data-v="nao"]{ background:var(--ink-2); }

/* ==========================================================================
   LOGIN
   ========================================================================== */
.login{
  position:fixed; inset:0; z-index:60; display:grid; place-items:center;
  background:
    radial-gradient(1100px 620px at 12% -10%, #2A4A75 0%, transparent 62%),
    linear-gradient(168deg, #1F3A5F 0%, #16222F 100%);
  padding:20px;
}
.login-cartao{
  width:100%; max-width:390px; background:var(--surface);
  border-radius:var(--r-lg); padding:28px 26px 24px;
  box-shadow:var(--sombra-alta);
}
.login-marca{ display:flex; align-items:center; gap:10px; margin-bottom:22px; }
.login-marca svg{ width:30px; height:30px; color:var(--brand); flex:none; }
.login-marca span{ font-family:var(--f-titulo); font-size:18px; font-weight:500; color:var(--ink); letter-spacing:-.01em; }
.login-marca b{ font-weight:700; }
.login h1{ font-size:17px; margin-bottom:3px; }
.login-sub{ color:var(--muted); font-size:13px; margin-bottom:20px; }
.login-campos{ display:flex; flex-direction:column; gap:14px; }
.login .btn-lg{ margin-top:6px; }
.login-aviso{
  margin-top:14px; padding:10px 12px; border-radius:var(--r);
  background:var(--crit-fraco); color:var(--crit); font-size:13px; border:1px solid #F2C9C5;
}
.login-nota{
  margin-top:18px; padding-top:16px; border-top:1px solid var(--line);
  font-size:12px; color:var(--faint); line-height:1.55;
}

/* ==========================================================================
   ESTRUTURA
   ========================================================================== */
#app{ height:100%; display:flex; flex-direction:column; }

.topbar{
  height:var(--topo); flex:none; display:flex; align-items:center; gap:14px;
  padding:0 14px; background:var(--brand); color:var(--sobre-brand);
}
.brand{ display:flex; align-items:center; gap:9px; flex:none; }
.brand-mark{ width:24px; height:24px; color:#fff; }
.brand-name{ font-family:var(--f-titulo); font-size:15px; font-weight:500; letter-spacing:-.01em; white-space:nowrap; }
.brand-name b{ font-weight:700; }

.topbar-search{ flex:1; max-width:440px; position:relative; display:flex; align-items:center; }
.topbar-search svg{ position:absolute; left:10px; width:17px; height:17px; color:rgba(255,255,255,.65); pointer-events:none; }
.topbar-search input{
  width:100%; height:36px; padding:0 12px 0 33px;
  border:1px solid rgba(255,255,255,.22); border-radius:var(--r);
  background:rgba(255,255,255,.12); color:#fff; font-size:13.5px;
}
.topbar-search input::placeholder{ color:rgba(255,255,255,.62); }
.topbar-search input:focus{ outline:none; background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.5); }

.topbar-right{ margin-left:auto; display:flex; align-items:center; gap:10px; flex:none; }
.perfil-chip{
  display:flex; flex-direction:column; align-items:flex-end; line-height:1.2;
  padding-left:10px; border-left:1px solid rgba(255,255,255,.2); cursor:pointer;
}
#perfil-nome{ font-size:12.5px; font-weight:500; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.perfil-papel{ font-family:var(--f-titulo); font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.7); }

.shell{ flex:1; min-height:0; display:flex; }

.rail{
  width:var(--rail); flex:none; background:var(--surface); border-right:1px solid var(--line);
  padding:10px 9px; display:flex; flex-direction:column; gap:2px;
}
.rail-item{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:9px 11px; border:0; border-radius:var(--r); background:transparent;
  color:var(--ink-2); font-family:var(--f-titulo); font-size:13.5px; font-weight:500;
  cursor:pointer; text-align:left; transition:background .12s, color .12s;
}
.rail-item svg{ width:19px; height:19px; flex:none; color:var(--muted); }
.rail-item:hover{ background:var(--surface-2); }
.rail-item.is-active{ background:var(--brand-fraco); color:var(--brand); font-weight:600; }
.rail-item.is-active svg{ color:var(--brand); }
.rail-sep{ height:1px; background:var(--line); margin:9px 6px; }
.rail-rodape{ margin-top:auto; }

.content{ flex:1; min-width:0; min-height:0; display:flex; flex-direction:column; }
.screen{ flex:1; min-height:0; display:flex; flex-direction:column; }
.screen[hidden]{ display:none !important; }

.screen-head{
  flex:none; display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:14px 18px; border-bottom:1px solid var(--line); background:var(--surface);
}
.head-back{ display:flex; align-items:center; gap:10px; min-width:0; }
.screen-sub{ font-size:12.5px; color:var(--muted); margin-top:2px; }
.screen-actions{ margin-left:auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.screen-body{ flex:1; min-height:0; display:flex; flex-direction:column; padding:16px 18px; gap:14px; overflow:hidden; }

/* ==========================================================================
   CARDS DE INDICADOR
   ========================================================================== */
.cards{ flex:none; display:grid; gap:10px; grid-template-columns:repeat(auto-fill, minmax(158px,1fr)); }
.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:12px 13px; cursor:pointer; text-align:left; position:relative;
  transition:border-color .12s, box-shadow .12s, transform .06s;
}
.card:hover{ border-color:var(--line-forte); box-shadow:var(--sombra); transform:translateY(-1px); }
.card-rotulo{
  font-family:var(--f-titulo); font-size:10.5px; font-weight:600; letter-spacing:.07em;
  text-transform:uppercase; color:var(--muted); display:block; margin-bottom:7px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.card-valor{ font-family:var(--f-titulo); font-size:29px; font-weight:700; line-height:1; font-variant-numeric:tabular-nums; }
.card-nota{ font-size:11.5px; color:var(--faint); margin-top:5px; }
.card::after{ content:""; position:absolute; left:0; top:11px; bottom:11px; width:3px; border-radius:0 3px 3px 0; background:var(--line-forte); }
.card[data-tom="brand"]::after{ background:var(--brand); }
.card[data-tom="signal"]::after{ background:var(--signal); }
.card[data-tom="ok"]::after{ background:var(--ok); }
.card[data-tom="warn"]::after{ background:var(--warn); }
.card[data-tom="crit"]::after{ background:var(--crit); }
.card[data-tom="info"]::after{ background:var(--info); }
.card[data-tom="roxo"]::after{ background:var(--roxo); }
.card[data-tom="brand"] .card-valor{ color:var(--brand); }
.card[data-tom="signal"] .card-valor{ color:var(--signal-2); }
.card[data-tom="ok"] .card-valor{ color:var(--ok); }
.card[data-tom="warn"] .card-valor{ color:var(--warn); }
.card[data-tom="crit"] .card-valor{ color:var(--crit); }
.card[data-tom="info"] .card-valor{ color:var(--info); }
.card[data-tom="roxo"] .card-valor{ color:var(--roxo); }

/* ==========================================================================
   PAINÉIS
   ========================================================================== */
.painel-grid{ flex:1; min-height:0; display:grid; gap:12px; grid-template-columns:1fr 1fr; }
.panel{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  display:flex; flex-direction:column; min-height:0; overflow:hidden;
}
.panel-head{
  flex:none; display:flex; align-items:center; gap:10px;
  padding:11px 14px; border-bottom:1px solid var(--line); background:var(--surface-2);
}
.panel-tag{
  margin-left:auto; font-family:var(--f-mono); font-size:11.5px; color:var(--muted);
}
.panel-body{ flex:1; min-height:0; overflow:auto; }

.linha-lista{
  display:flex; align-items:center; gap:11px; padding:10px 14px;
  border-bottom:1px solid var(--line); cursor:pointer; transition:background .1s;
}
.linha-lista:last-child{ border-bottom:0; }
.linha-lista:hover{ background:var(--surface-2); }
.linha-info{ min-width:0; flex:1; }
.linha-nome{ font-weight:500; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.linha-meta{ font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.linha-hora{ font-family:var(--f-mono); font-size:13px; font-weight:500; color:var(--brand); flex:none; }

/* ==========================================================================
   AVATAR / FOTO
   ========================================================================== */
.avatar{
  width:36px; height:36px; border-radius:50%; flex:none; object-fit:cover;
  background:var(--surface-3); display:grid; place-items:center;
  font-family:var(--f-titulo); font-size:13px; font-weight:600; color:var(--muted);
  border:1px solid var(--line); overflow:hidden;
}
.avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.avatar-g{ width:84px; height:84px; font-size:28px; }

/* ==========================================================================
   TABELA
   ========================================================================== */
.tabela-wrap{ flex:1; min-height:0; overflow:auto; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); }
table.tabela{ width:100%; border-collapse:collapse; }
.tabela thead th{
  position:sticky; top:0; z-index:1; background:var(--surface-2);
  font-family:var(--f-titulo); font-size:10.5px; font-weight:600; letter-spacing:.07em;
  text-transform:uppercase; color:var(--muted); text-align:left;
  padding:9px 12px; border-bottom:1px solid var(--line); white-space:nowrap;
}
.tabela tbody td{ padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:middle; }
.tabela tbody tr:last-child td{ border-bottom:0; }
.tabela tbody tr{ cursor:pointer; }
.tabela tbody tr:hover{ background:var(--surface-2); }
.td-nome{ font-weight:500; }
.td-sub{ font-size:11.5px; color:var(--muted); }
.td-mono{ font-family:var(--f-mono); font-size:12.5px; white-space:nowrap; }
.td-acoes{ text-align:right; white-space:nowrap; }
.td-acoes .btn{ margin-left:4px; }
.col-estreita{ width:1%; }

.paginacao{
  flex:none; display:flex; align-items:center; gap:10px; justify-content:flex-end;
  font-size:12.5px; color:var(--muted);
}
.paginacao b{ color:var(--ink); font-variant-numeric:tabular-nums; }

/* ==========================================================================
   SITUAÇÕES (chips)
   ========================================================================== */
.chip{
  display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:100px;
  font-family:var(--f-titulo); font-size:10.5px; font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; white-space:nowrap; border:1px solid transparent;
}
.chip::before{ content:""; width:5px; height:5px; border-radius:50%; background:currentColor; flex:none; }
.chip-NOVO{ background:var(--surface-3); color:var(--ink-2); border-color:var(--line-forte); }
.chip-EM_ANALISE{ background:var(--warn-fraco); color:var(--warn); border-color:#EBD7AE; }
.chip-ENTREVISTA_AGENDADA{ background:var(--info-fraco); color:var(--info); border-color:#BFD9EC; }
.chip-ENTREVISTA_REALIZADA{ background:var(--brand-fraco); color:var(--brand); border-color:#C4D3E6; }
.chip-APROVADO{ background:var(--ok-fraco); color:var(--ok); border-color:#B9DECC; }
.chip-DIARIA_TESTE{ background:var(--signal-fraco); color:var(--signal-2); border-color:#F5CDB7; }
.chip-CONTRATADO{ background:var(--ok-fraco); color:var(--ok); border-color:#8FCBAF; }
.chip-ADMITIDO{ background:#D8EFE3; color:#0E5537; border-color:#8FCBAF; }
.chip-REPROVADO{ background:var(--crit-fraco); color:var(--crit); border-color:#EFC4C0; }
.chip-NAO_COMPARECEU{ background:var(--crit-fraco); color:#8F221A; border-color:#EFC4C0; }
.chip-BANCO_TALENTOS{ background:var(--roxo-fraco); color:var(--roxo); border-color:#D3C6E8; }
.chip-ativo{ background:var(--ok-fraco); color:var(--ok); border-color:#B9DECC; }
.chip-inativo{ background:var(--surface-3); color:var(--faint); border-color:var(--line-forte); }
.chip-papel{ background:var(--brand-fraco); color:var(--brand); border-color:#C4D3E6; }

.etiqueta{
  display:inline-block; padding:2px 8px; border-radius:var(--r-sm); margin:2px 3px 2px 0;
  background:var(--surface-3); border:1px solid var(--line); font-size:12px; color:var(--ink-2);
}

/* ==========================================================================
   FILTROS
   ========================================================================== */
.filtros{
  flex:none; display:grid; gap:10px; padding:12px 18px;
  grid-template-columns:repeat(auto-fill, minmax(168px,1fr));
  background:var(--surface-2); border-bottom:1px solid var(--line);
}
.filtros-acoes{ display:flex; align-items:flex-end; gap:8px; }

/* ==========================================================================
   PASSOS DO CADASTRO
   ========================================================================== */
.passos{
  flex:none; display:flex; gap:4px; padding:9px 18px; overflow-x:auto;
  background:var(--surface-2); border-bottom:1px solid var(--line);
}
.passo{
  display:flex; align-items:center; gap:7px; padding:7px 13px; border-radius:100px;
  border:1px solid var(--line-forte); background:var(--surface); cursor:pointer;
  font-family:var(--f-titulo); font-size:12.5px; font-weight:600; color:var(--muted);
  white-space:nowrap; flex:none;
}
.passo span.n{
  width:19px; height:19px; border-radius:50%; background:var(--surface-3); color:var(--muted);
  display:grid; place-items:center; font-size:10.5px; flex:none;
}
.passo.is-ativo{ background:var(--brand); border-color:var(--brand); color:#fff; }
.passo.is-ativo span.n{ background:rgba(255,255,255,.22); color:#fff; }
.passo.is-ok span.n{ background:var(--ok); color:#fff; }

.form{ flex:1; min-height:0; overflow:auto; }
.form-bloco{ display:none; }
.form-bloco.is-ativo{ display:block; }
.form-secao{ margin-bottom:20px; }
.form-secao > h3{
  font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--muted);
  padding-bottom:7px; margin-bottom:12px; border-bottom:1px solid var(--line);
}
.grade{ display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(196px,1fr)); }
.grade-2{ grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); }
.col-total{ grid-column:1 / -1; }

.form-rodape{
  flex:none; display:flex; align-items:center; gap:8px; padding-top:12px; margin-top:4px;
  border-top:1px solid var(--line);
}
.form-rodape .direita{ margin-left:auto; display:flex; gap:8px; }

/* foto do candidato */
.foto-area{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.foto-previa{
  width:104px; height:104px; border-radius:var(--r); border:1px dashed var(--line-forte);
  background:var(--surface-2); display:grid; place-items:center; overflow:hidden; flex:none;
  color:var(--faint); text-align:center; font-size:11.5px; padding:8px;
}
.foto-previa img{ width:100%; height:100%; object-fit:cover; }
.foto-botoes{ display:flex; flex-direction:column; gap:8px; }

/* ==========================================================================
   PIPELINE
   ========================================================================== */
.pipeline{
  flex:1; min-height:0; display:flex; gap:10px; overflow-x:auto; padding-bottom:4px;
}
.coluna{
  width:232px; flex:none; display:flex; flex-direction:column; min-height:0;
  background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r);
}
.coluna-head{
  flex:none; padding:9px 11px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:7px;
}
.coluna-head h3{ font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.coluna-qtd{
  margin-left:auto; font-family:var(--f-titulo); font-size:12px; font-weight:700;
  background:var(--surface); border:1px solid var(--line); border-radius:100px;
  min-width:24px; height:20px; display:grid; place-items:center; padding:0 6px;
  font-variant-numeric:tabular-nums;
}
.coluna-body{ flex:1; min-height:0; overflow:auto; padding:8px; display:flex; flex-direction:column; gap:7px; }
.cartao{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:9px 10px; cursor:pointer; transition:border-color .12s, box-shadow .12s;
}
.cartao:hover{ border-color:var(--brand); box-shadow:var(--sombra); }
.cartao-nome{ font-weight:500; font-size:13px; margin-bottom:3px; }
.cartao-meta{ font-size:11.5px; color:var(--muted); }
.cartao-pe{ display:flex; align-items:center; gap:6px; margin-top:7px; }
.cartao-mover{
  margin-left:auto; border:1px solid var(--line-forte); background:var(--surface);
  border-radius:var(--r-sm); width:26px; height:24px; display:grid; place-items:center; cursor:pointer;
}
.cartao-mover:hover{ background:var(--brand); border-color:var(--brand); color:#fff; }
.cartao-mover svg{ width:15px; height:15px; }

/* ==========================================================================
   FICHA DO CANDIDATO
   ========================================================================== */
.ficha{ flex:1; min-height:0; overflow:auto; display:grid; gap:12px; grid-template-columns:300px 1fr; align-items:start; }
.ficha-lado{ display:flex; flex-direction:column; gap:12px; }
.bloco{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden;
}
.bloco-head{ padding:10px 14px; border-bottom:1px solid var(--line); background:var(--surface-2); }
.bloco-head h2{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.bloco-body{ padding:13px 14px; }
.identidade{ display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.identidade h2{ font-size:17px; }

.dados{ display:grid; gap:10px; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); }
.dado dt{
  font-family:var(--f-titulo); font-size:10px; font-weight:600; letter-spacing:.07em;
  text-transform:uppercase; color:var(--faint); margin-bottom:2px;
}
.dado dd{ margin:0; font-size:13.5px; }
.dado dd.vazio{ color:var(--faint); }

.linha-tempo{ display:flex; flex-direction:column; }
.evento{ display:flex; gap:11px; padding:9px 0; border-bottom:1px solid var(--line); }
.evento:last-child{ border-bottom:0; }
.evento-marca{ width:9px; height:9px; border-radius:50%; background:var(--brand); margin-top:5px; flex:none; }
.evento-texto{ font-size:13px; min-width:0; }
.evento-quando{ font-family:var(--f-mono); font-size:11px; color:var(--faint); margin-top:2px; }

/* ==========================================================================
   MODAL
   ========================================================================== */
.modal-fundo{
  position:fixed; inset:0; z-index:70; background:rgba(16,22,28,.55);
  display:grid; place-items:center; padding:18px; backdrop-filter:blur(2px);
}
.modal{
  width:100%; max-width:520px; max-height:88vh; background:var(--surface);
  border-radius:var(--r-lg); box-shadow:var(--sombra-alta); display:flex; flex-direction:column; overflow:hidden;
}
.modal-largo{ max-width:760px; }
.modal-head{ flex:none; display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--line); }
.modal-head h2{ font-size:15.5px; }
.modal-head .btn{ margin-left:auto; }
.modal-body{ flex:1; min-height:0; overflow:auto; padding:16px; }
.modal-pe{ flex:none; display:flex; gap:8px; justify-content:flex-end; padding:12px 16px; border-top:1px solid var(--line); background:var(--surface-2); }

/* ==========================================================================
   AVISOS
   ========================================================================== */
.avisos{ position:fixed; right:16px; bottom:16px; z-index:90; display:flex; flex-direction:column; gap:8px; max-width:min(380px, calc(100vw - 32px)); }
.aviso{
  display:flex; align-items:flex-start; gap:9px; padding:11px 13px; border-radius:var(--r);
  background:var(--ink); color:#fff; font-size:13.5px; box-shadow:var(--sombra-alta);
  animation:sobe .18s ease-out;
}
.aviso svg{ width:17px; height:17px; flex:none; margin-top:1px; }
.aviso-ok{ background:var(--ok); }
.aviso-erro{ background:var(--crit); }
.aviso-info{ background:var(--brand); }
@keyframes sobe{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

/* ==========================================================================
   VAZIO / CARREGANDO
   ========================================================================== */
.vazio{ display:grid; place-items:center; padding:36px 20px; text-align:center; gap:9px; color:var(--muted); height:100%; }
.vazio svg{ width:34px; height:34px; color:var(--line-forte); }
.vazio h3{ font-size:14px; color:var(--ink-2); }
.vazio p{ font-size:13px; max-width:340px; }

.cortina{ position:fixed; inset:0; z-index:80; display:grid; place-items:center; background:var(--ground); }
.cortina-box{ display:flex; flex-direction:column; align-items:center; gap:14px; color:var(--muted); font-size:13.5px; }
.cortina-spin{
  width:30px; height:30px; border-radius:50%;
  border:3px solid var(--line-forte); border-top-color:var(--brand); animation:gira .8s linear infinite;
}
@keyframes gira{ to{ transform:rotate(360deg); } }

.faixa-alerta{
  flex:none; display:flex; align-items:center; gap:10px; padding:9px 18px;
  background:var(--warn-fraco); border-bottom:1px solid #EBD7AE; color:var(--warn); font-size:13px;
}
.faixa-alerta svg{ width:17px; height:17px; flex:none; }
.faixa-alerta .btn{ margin-left:auto; }

/* ==========================================================================
   BARRA INFERIOR (celular)
   ========================================================================== */
.tabbar{ display:none; }

/* ==========================================================================
   TELAS MENORES
   ========================================================================== */
@media (max-width:1100px){
  .ficha{ grid-template-columns:1fr; }
  .painel-grid{ grid-template-columns:1fr; }
}

@media (max-width:860px){
  :root{ --topo:52px; }
  body{ font-size:15px; }

  .rail{ display:none; }
  .topbar-search{ display:none; }
  .topbar-right .btn{ display:none; }

  .tabbar{
    display:flex; flex:none; align-items:stretch; justify-content:space-around;
    background:var(--surface); border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom, 0px);
  }
  .tab-item{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    border:0; background:transparent; padding:8px 2px 7px; cursor:pointer;
    font-family:var(--f-titulo); font-size:10px; font-weight:600; color:var(--muted);
  }
  .tab-item svg{ width:21px; height:21px; }
  .tab-item.is-active{ color:var(--brand); }
  .tab-novo{ flex:0 0 62px; }
  .tab-novo svg{
    width:40px; height:40px; padding:9px; border-radius:50%;
    background:var(--signal); color:#fff; box-shadow:var(--sombra);
  }

  .screen-head{ padding:11px 14px; gap:10px; }
  .screen-head h1{ font-size:17px; }
  .screen-body{ padding:13px 14px; gap:12px; }
  .filtros{ padding:12px 14px; grid-template-columns:1fr 1fr; }
  .passos{ padding:8px 14px; }

  .cards{ grid-template-columns:repeat(auto-fill, minmax(140px,1fr)); gap:8px; }
  .card-valor{ font-size:26px; }

  .btn{ height:44px; }
  .btn-sm{ height:38px; }
  .campo{ height:46px; font-size:16px; }   /* 16px evita o zoom automático do iOS */
  select.campo{ font-size:16px; }
  .marcavel{ padding:11px 13px; font-size:14.5px; }
  .campo-busca{ width:100%; }

  .grade{ grid-template-columns:1fr; }
  .grade-2{ grid-template-columns:1fr; }
  .coluna{ width:190px; }

  .avisos{ left:14px; right:14px; bottom:14px; max-width:none; }
  .modal{ max-height:92vh; }
}

@media (max-width:420px){
  .brand-name{ display:none; }
  .cards{ grid-template-columns:1fr 1fr; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

@media print{
  .topbar,.rail,.tabbar,.screen-actions,.filtros,.paginacao{ display:none !important; }
  body,.screen-body,.tabela-wrap{ overflow:visible !important; height:auto !important; }
}

/* ===========================================================================
   IMPORTACAO DE CURRICULOS DO DRIVE
   =========================================================================== */

.sinc-progresso{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; padding:48px 16px; text-align:center;
}
.sinc-progresso p{ margin:0; color:var(--ink-2); font-size:14px; }

.sinc-barra{
  width:min(360px,100%); height:6px; border-radius:99px;
  background:var(--surface-3); overflow:hidden;
}
.sinc-barra-fill{
  height:100%; width:0%; border-radius:99px;
  background:var(--brand); transition:width .25s ease;
}

.sinc-resumo{
  padding:12px 14px; margin-bottom:12px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
}
.sinc-resumo p{ margin:0; font-size:14px; color:var(--ink); }
.sinc-resumo .sinc-dica{ margin-top:6px; font-size:12.5px; color:var(--muted); }

.sinc-alerta{
  margin-top:4px; font-size:12px; font-weight:600;
  color:var(--warn);
}
.sinc-nota{ margin-top:4px; font-size:12px; color:var(--muted); }

.campo-linha{
  height:34px; padding:4px 8px; font-size:13.5px; width:100%; min-width:130px;
}

.col-check{ width:40px; text-align:center; }
.col-check input{ width:17px; height:17px; accent-color:var(--brand); cursor:pointer; }
.col-achados{ font-size:12.5px; color:var(--ink-2); line-height:1.5; max-width:340px; }
.col-arquivo{ font-size:12px; max-width:230px; }
.col-arquivo a{ color:var(--brand-2); word-break:break-word; }
.col-arquivo .fraco{ display:block; margin-top:2px; }

.fraco{ color:var(--faint); }

@media (max-width:860px){
  .col-achados, .col-arquivo{ display:none; }
}

/* Indicador de curriculos novos no item "Drive" do menu */
.menu-badge{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:19px; height:19px; padding:0 5px; margin-left:auto;
  border-radius:99px; background:var(--signal); color:#fff;
  font-family:var(--f-texto); font-size:11px; font-weight:700;
  line-height:1; font-variant-numeric:tabular-nums;
}

.tab-item .menu-badge{
  position:absolute; top:3px; left:50%; margin-left:4px;
}
.tab-item{ position:relative; }

/* As tres etapas da tela do Drive precisam ocupar a altura disponivel para
   que a tabela de revisao tenha rolagem propria, em vez de ser cortada. */
#sinc-inicio, #sinc-trabalhando, #sinc-revisao{
  flex:1; min-height:0; display:flex; flex-direction:column; gap:12px;
}
#sinc-revisao .sinc-resumo{ flex:none; }
#sinc-revisao .tabela-wrap{ flex:1; min-height:0; overflow:auto; }

.sinc-erro{
  flex:none; padding:11px 13px; border-radius:var(--r);
  background:var(--crit-fraco); border:1px solid var(--crit);
  color:var(--crit); font-size:13px; line-height:1.5; font-weight:500;
}

/* ===========================================================================
   AGENDA DE ENTREVISTAS
   =========================================================================== */

.agenda-dia{ margin-bottom:18px; }
.agenda-dia:last-child{ margin-bottom:0; }

.agenda-dia-titulo{
  margin:0 0 8px; font-family:var(--f-titulo); font-size:12px; font-weight:600;
  text-transform:uppercase; letter-spacing:.05em; color:var(--muted);
}

.agenda-item{
  display:grid; align-items:center; gap:12px;
  grid-template-columns:62px 1fr auto auto;
  padding:11px 13px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface); margin-bottom:7px;
}
.agenda-item:last-child{ margin-bottom:0; }

.agenda-hora{
  font-family:var(--f-mono); font-size:15px; font-weight:500;
  color:var(--brand); font-variant-numeric:tabular-nums;
}

.agenda-info{ min-width:0; }

.agenda-nome{
  display:block; padding:0; border:0; background:none; cursor:pointer;
  font-family:var(--f-titulo); font-size:14.5px; font-weight:600;
  color:var(--ink); text-align:left;
}
.agenda-nome:hover{ color:var(--brand-2); text-decoration:underline; }

.agenda-meta{ font-size:12.5px; color:var(--muted); margin-top:2px; }
.agenda-obs{ font-size:12.5px; color:var(--ink-2); margin-top:4px; font-style:italic; }

.agenda-acoes{ display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }

@media (max-width:860px){
  .agenda-item{ grid-template-columns:52px 1fr; }
  .agenda-situacao{ grid-column:2; }
  .agenda-acoes{ grid-column:1/-1; justify-content:flex-start; }
}

/* ===========================================================================
   EMPRESAS ONDE O CANDIDATO JA TRABALHOU
   =========================================================================== */

.exp-lista{ display:flex; flex-direction:column; gap:10px; }

.exp-vazio{
  margin:0; padding:12px; border:1px dashed var(--line-forte); border-radius:var(--r);
  font-size:13px; color:var(--muted); text-align:center;
}

.exp-item{
  padding:12px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface-2);
}
.exp-item .grade{ margin-bottom:8px; }

.exp-vinculo{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; padding-top:5px; }
.exp-vinculo .marcavel{ margin:0; }

.exp-remover{ color:var(--crit); }

/* ===========================================================================
   NAVEGADOR DE PASTAS DO GOOGLE DRIVE
   =========================================================================== */

.drive-caminho{
  display:flex; align-items:center; gap:4px; flex-wrap:wrap;
  padding-bottom:9px; margin-bottom:9px; border-bottom:1px solid var(--line);
}
.drive-migalha{
  padding:3px 7px; border:0; border-radius:var(--r-sm); background:none; cursor:pointer;
  font-family:var(--f-texto); font-size:13px; font-weight:500; color:var(--brand-2);
}
.drive-migalha:hover{ background:var(--brand-fraco); }
.drive-migalha:last-child{ color:var(--ink); font-weight:600; }
.drive-sep{ color:var(--faint); font-size:12px; }

.drive-navegador{
  max-height:46vh; overflow-y:auto;
  border:1px solid var(--line); border-radius:var(--r); background:var(--surface);
}

.drive-carregando{ margin:0; padding:22px; text-align:center; font-size:13px; color:var(--muted); }

.drive-linha{
  display:flex; align-items:center; gap:9px; width:100%;
  padding:9px 12px; border:0; border-bottom:1px solid var(--line);
  background:none; text-align:left; font-family:var(--f-texto); font-size:13.5px;
  color:var(--ink); cursor:pointer;
}
.drive-linha:last-child{ border-bottom:0; }
.drive-linha:hover{ background:var(--surface-2); }
.drive-linha svg{ width:18px; height:18px; flex:none; color:var(--brand); }
.drive-linha span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.drive-pasta{ font-weight:500; }
.drive-arquivo input{ width:16px; height:16px; accent-color:var(--brand); flex:none; }

.drive-arquivo.esta-importado{ color:var(--faint); cursor:default; }
.drive-marca{
  margin-left:auto; flex:none; font-size:10.5px; font-weight:600; text-transform:uppercase;
  letter-spacing:.04em; color:var(--ok);
}

/* Navegacao entre candidatos, na ficha */
.ficha-navegacao{
  flex:none; display:flex; align-items:center; gap:7px; flex-wrap:wrap;
  padding:8px 18px; border-bottom:1px solid var(--line); background:var(--surface-2);
}
.ficha-contador{
  font-family:var(--f-mono); font-size:12px; color:var(--muted);
  font-variant-numeric:tabular-nums; padding:0 5px;
}
.ficha-navegacao .btn[disabled]{ opacity:.4; cursor:default; }

/* Rotulo com botao ao lado (ver curriculo) */
.rotulo-linha{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  flex-wrap:wrap; margin-bottom:4px;
}
.rotulo-linha .rotulo{ margin:0; }

@media (max-width:860px){
  .ficha-navegacao{ padding:8px 14px; }
  .ficha-navegacao .btn{ flex:1; min-width:0; }
}

/* ===========================================================================
   CADASTROS REPETIDOS E CANDIDATOS REPROVADOS
   =========================================================================== */

.selo-repetido{
  display:inline-block; margin-left:6px; padding:1px 6px; border-radius:100px;
  background:var(--warn-fraco); color:var(--warn); border:1px solid #EBD7AE;
  font-family:var(--f-titulo); font-size:9.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.03em; vertical-align:middle;
}

.linha-reprovado td{ background:var(--crit-fraco); }
.linha-reprovado .td-nome{ color:var(--crit); }
.linha-reprovado:hover td{ background:#F7DAD7; }

.motivo-reprovacao{ color:var(--crit); font-weight:500; }

.ficha-repetido, .ficha-reprovado{
  flex:none; display:flex; align-items:flex-start; gap:9px; flex-wrap:wrap;
  padding:10px 18px; font-size:13px; line-height:1.5;
}
.ficha-repetido svg, .ficha-reprovado svg{ flex:none; margin-top:1px; }

.ficha-repetido{
  background:var(--warn-fraco); color:var(--warn);
  border-bottom:1px solid #EBD7AE;
}
.ficha-reprovado{
  background:var(--crit-fraco); color:var(--crit);
  border-bottom:1px solid #E9BDB8;
}

.ficha-repetido span{ flex:1; min-width:180px; }
.ficha-repetido-links{ display:flex; gap:6px; flex-wrap:wrap; flex:none !important; }

@media (max-width:860px){
  .ficha-repetido, .ficha-reprovado{ padding:10px 14px; }
}

/* ===========================================================================
   PAINEL DA DIRETORIA E GRAFICOS
   =========================================================================== */

.ger-rolagem{ flex:1; min-height:0; overflow-y:auto; padding-right:4px; }

.ger-cards{
  display:grid; gap:10px; margin-bottom:18px;
  grid-template-columns:repeat(auto-fit,minmax(158px,1fr));
}

.ger-card{
  display:flex; flex-direction:column; gap:3px; align-items:flex-start;
  padding:13px 14px; border:1px solid var(--line); border-left-width:3px;
  border-radius:var(--r); background:var(--surface); cursor:pointer;
  font-family:var(--f-texto); text-align:left; transition:border-color .15s, transform .12s;
}
.ger-card:hover{ transform:translateY(-1px); border-color:var(--line-forte); }
.ger-card[data-ir]{ cursor:pointer; }
.ger-card:not([data-ir]){ cursor:default; }

.ger-card-rotulo{
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.05em;
  color:var(--muted);
}
.ger-card-valor{
  font-family:var(--f-titulo); font-size:27px; font-weight:700; line-height:1.05;
  color:var(--ink); font-variant-numeric:tabular-nums;
}
.ger-card-detalhe{ font-size:11.5px; color:var(--faint); }

.ger-card-ok{ border-left-color:var(--ok); } .ger-card-ok .ger-card-valor{ color:var(--ok); }
.ger-card-crit{ border-left-color:var(--crit); } .ger-card-crit .ger-card-valor{ color:var(--crit); }
.ger-card-warn{ border-left-color:var(--warn); } .ger-card-warn .ger-card-valor{ color:var(--warn); }
.ger-card-info{ border-left-color:var(--info); } .ger-card-info .ger-card-valor{ color:var(--info); }
.ger-card-brand{ border-left-color:var(--brand); } .ger-card-brand .ger-card-valor{ color:var(--brand); }
.ger-card-roxo{ border-left-color:var(--roxo); } .ger-card-roxo .ger-card-valor{ color:var(--roxo); }

.ger-secao{ margin-bottom:18px; }
.ger-colunas{ display:grid; gap:14px; grid-template-columns:1fr 1fr; }
.ger-colunas > .ger-secao{ min-width:0; }

.ger-cabeca{ margin-bottom:9px; }
.ger-cabeca h2{
  margin:0; font-family:var(--f-titulo); font-size:15px; font-weight:600; color:var(--ink);
}
.ger-cabeca p{ margin:2px 0 0; font-size:12.5px; color:var(--muted); }

.ger-cartao{
  padding:15px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface);
}

.ger-prazos{
  display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.ger-prazo{
  display:flex; flex-direction:column; gap:3px; padding:11px 13px;
  background:var(--surface-2); border-radius:var(--r);
}
.ger-prazo-valor{
  font-family:var(--f-titulo); font-size:25px; font-weight:700; color:var(--brand);
  font-variant-numeric:tabular-nums;
}
.ger-prazo-valor small{ font-size:12px; font-weight:500; color:var(--muted); margin-left:4px; }
.ger-prazo-rotulo{ font-size:12px; color:var(--ink-2); line-height:1.35; }

/* --- graficos --- */

.gr{ width:100%; height:auto; display:block; }
.gr-vazio{ margin:0; padding:26px 12px; text-align:center; font-size:13px; color:var(--muted); }

.gr-grade{ stroke:var(--line); stroke-width:1; }
.gr-eixo-linha{ stroke:var(--line-forte); stroke-width:1; }
.gr-eixo{ fill:var(--faint); font-size:9.5px; font-family:var(--f-mono); }
.gr-rotulo{ fill:var(--muted); font-size:10px; font-family:var(--f-texto); }
.gr-valor{ fill:var(--ink); font-size:10.5px; font-weight:600; font-family:var(--f-mono); }
.gr-barra{ transition:opacity .15s; }
.gr-hover{ fill:transparent; }
.gr-col.tem-clique{ cursor:pointer; }
.gr-col.tem-clique:hover .gr-hover{ fill:var(--surface-3); }
.gr-col.tem-clique:hover .gr-barra{ opacity:.82; }

.gr-titulo{
  display:flex; align-items:center; gap:6px; margin-bottom:6px;
  font-size:12px; font-weight:600; color:var(--ink-2);
}
.gr-ponto{ width:9px; height:9px; border-radius:50%; flex:none; display:inline-block; }

.gr-duplo{ display:grid; gap:16px; grid-template-columns:1fr 1fr; }

.gr-linhas{ display:flex; flex-direction:column; gap:9px; }
.gr-linha{ display:grid; grid-template-columns:minmax(90px,34%) 1fr auto; gap:9px; align-items:center; }
.gr-linha.tem-clique{ cursor:pointer; }
.gr-linha.tem-clique:hover .gr-linha-rotulo{ color:var(--brand-2); }
.gr-linha-rotulo{
  font-size:12.5px; color:var(--ink-2); overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap;
}
.gr-linha-trilho{ height:17px; background:var(--surface-3); border-radius:var(--r-sm); overflow:hidden; }
.gr-linha-barra{ display:block; height:100%; border-radius:var(--r-sm); transition:width .3s; }
.gr-linha-valor{
  font-family:var(--f-mono); font-size:12.5px; font-weight:600; color:var(--ink);
  font-variant-numeric:tabular-nums; min-width:52px; text-align:right;
}
.gr-linha-valor small{ color:var(--faint); font-weight:400; margin-left:4px; }

.gr-rosca-caixa{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.gr-rosca{ width:156px; height:156px; flex:none; }
.gr-rosca-total{
  fill:var(--ink); font-family:var(--f-titulo); font-size:25px; font-weight:700;
}
.gr-rosca-legenda{ fill:var(--muted); font-size:9.5px; text-transform:uppercase; letter-spacing:.05em; }
.gr-fatia{ transition:opacity .15s; }
.gr-fatia.tem-clique{ cursor:pointer; }
.gr-fatia.tem-clique:hover{ opacity:.8; }

.gr-legenda{ display:flex; flex-direction:column; gap:6px; flex:1; min-width:140px; }
.gr-legenda-item{ display:flex; align-items:center; gap:7px; font-size:12.5px; }
.gr-legenda-item.tem-clique{ cursor:pointer; }
.gr-legenda-item.tem-clique:hover .gr-legenda-nome{ color:var(--brand-2); }
.gr-legenda-nome{ flex:1; color:var(--ink-2); }
.gr-legenda-valor{ font-family:var(--f-mono); font-weight:600; color:var(--ink); }

.gr-funil{ display:flex; flex-direction:column; gap:11px; }
.gr-funil-etapa.tem-clique{ cursor:pointer; }
.gr-funil-topo{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:3px; }
.gr-funil-nome{ font-size:12.5px; font-weight:500; color:var(--ink-2); }
.gr-funil-numero{
  font-family:var(--f-titulo); font-size:15px; font-weight:700; color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.gr-funil-trilho{ height:12px; background:var(--surface-3); border-radius:var(--r-sm); overflow:hidden; }
.gr-funil-barra{ height:100%; border-radius:var(--r-sm); transition:width .35s; }
.gr-funil-pe{ margin-top:3px; font-size:11px; color:var(--faint); }
.gr-funil-etapa.tem-clique:hover .gr-funil-nome{ color:var(--brand-2); }

/* --- modo apresentacao (TV ou projetor) --- */

body.modo-apresentacao .rail,
body.modo-apresentacao .tabbar,
body.modo-apresentacao .topbar-search,
body.modo-apresentacao .topbar-right{ display:none !important; }

body.modo-apresentacao .ger-card-valor{ font-size:38px; }
body.modo-apresentacao .ger-cabeca h2{ font-size:19px; }
body.modo-apresentacao .ger-cartao{ padding:20px; }

@media (max-width:1100px){
  .ger-colunas, .gr-duplo{ grid-template-columns:1fr; }
}
@media (max-width:860px){
  .ger-cards{ grid-template-columns:repeat(auto-fit,minmax(135px,1fr)); }
  .ger-card-valor{ font-size:23px; }
  .gr-linha{ grid-template-columns:minmax(72px,40%) 1fr auto; }
}

/* Coluna de departamento na lista de candidatos */
.col-depto{ display:flex; flex-direction:column; gap:2px; }
.col-depto-nome{ color:var(--ink-2); font-weight:500; }
.etapa-depto{
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.03em;
}
.etapa-diaria{ color:var(--signal); }
.etapa-contratado{ color:var(--info); }
.etapa-admitido{ color:var(--ok); }

/* Camera do computador, para a foto do candidato */
.camera-caixa{ display:flex; flex-direction:column; gap:9px; align-items:center; }
.camera-caixa video{
  width:100%; max-width:430px; border-radius:var(--r); background:#000;
  aspect-ratio:4/3; object-fit:cover;
}
.camera-aviso{ margin:0; font-size:12.5px; color:var(--muted); text-align:center; }

/* Envios repetidos de curriculo pelo mesmo candidato */
.ficha-envios{
  flex:none; display:flex; align-items:flex-start; gap:9px; flex-wrap:wrap;
  padding:10px 18px; font-size:13px; line-height:1.5;
  background:var(--info-fraco); color:var(--info);
  border-bottom:1px solid #BFD9EC;
}
.ficha-envios svg{ flex:none; margin-top:1px; }
.ficha-envios > span:first-of-type{ flex:1; min-width:180px; }
.ficha-envios-datas{ display:flex; gap:5px; flex-wrap:wrap; }
.envio-marca{
  padding:2px 8px; border-radius:100px; background:var(--surface);
  border:1px solid #BFD9EC; font-family:var(--f-mono); font-size:11.5px; font-weight:500;
}

/* Curriculo que sera anexado a um cadastro existente */
.sinc-unificar{
  margin-top:4px; font-size:12px; font-weight:600; color:var(--info);
}
.sinc-unificar-texto{ color:var(--info); font-weight:600; }

/* Vagas em aberto no painel do RH */
.vaga-qtd{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; flex:none; border-radius:var(--r-sm);
  background:var(--signal-fraco); color:var(--signal);
  font-family:var(--f-titulo); font-size:14px; font-weight:700;
}

@media (max-width:860px){
  .ficha-envios{ padding:10px 14px; }
}

/* Resumo da contratacao na ficha do candidato */
.ct-resumo{ display:flex; flex-direction:column; gap:7px; }
.ct-topo{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:3px; }
.ct-topo b{ font-family:var(--f-titulo); font-size:14px; color:var(--ink); }
.ct-linha{
  display:flex; justify-content:space-between; gap:12px; align-items:baseline;
  font-size:13px; padding-bottom:5px; border-bottom:1px solid var(--line);
}
.ct-linha:last-child{ border-bottom:0; padding-bottom:0; }
.ct-linha span{ color:var(--muted); }
.ct-linha b{ color:var(--ink); text-align:right; font-weight:600; }

/* Quadro de colaboradores por departamento */
.ger-quadro-cartao{ display:grid; gap:16px; grid-template-columns:1.55fr 1fr; align-items:start; }
.ger-quadro-grafico{ min-width:0; }

.gr-quadro-legenda{
  display:flex; gap:16px; flex-wrap:wrap; margin-bottom:8px;
  font-size:12px; color:var(--ink-2);
}
.gr-quadro-legenda span{ display:inline-flex; align-items:center; gap:5px; }

.gr-rotulo-forte{ font-weight:600; fill:var(--ink-2); font-size:11px; }
.gr-saldo{ font-family:var(--f-titulo); font-size:13px; font-weight:700; }
.gr-valor-meta{ fill:var(--ok); }

.ger-quadro-total{
  display:flex; gap:14px; flex-wrap:wrap; align-items:center;
  margin-top:10px; padding-top:9px; border-top:1px solid var(--line);
  font-size:13px; color:var(--ink-2);
}
.ger-quadro-total b{ color:var(--ink); font-family:var(--f-titulo); }
.ger-quadro-falta{ color:var(--crit); font-weight:600; }

/* Movimentacoes do periodo, ao lado do quadro */
.ger-quadro-mov{
  display:flex; flex-direction:column; gap:9px;
  max-height:330px; overflow-y:auto;
}
.mov-bloco{
  padding:9px 11px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface-2);
}
.mov-depto{
  font-family:var(--f-titulo); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:5px;
}
.mov-linha{ font-size:12.5px; line-height:1.45; color:var(--ink-2); margin-bottom:3px; }
.mov-linha:last-child{ margin-bottom:0; }
.mov-linha b{ font-weight:700; }
.mov-admissao b{ color:var(--ink); }
.mov-demissao b, .mov-saida b{ color:var(--crit); }
.mov-entrada b{ color:var(--info); }

@media (max-width:1100px){
  .ger-quadro-cartao{ grid-template-columns:1fr; }
  .ger-quadro-mov{ max-height:none; }
}

/* ===========================================================================
   VISAO EXECUTIVA
   =========================================================================== */

.ex-kpis{
  display:grid; gap:11px; margin-bottom:18px;
  grid-template-columns:repeat(auto-fit,minmax(172px,1fr));
}

.ex-card{
  display:flex; flex-direction:column; gap:4px; align-items:flex-start;
  padding:14px 15px; border:1px solid var(--line); border-top-width:3px;
  border-radius:var(--r); background:var(--surface);
  font-family:var(--f-texto); text-align:left; cursor:default;
  transition:transform .12s, box-shadow .12s;
}
.ex-card.tem-detalhe{ cursor:pointer; }
.ex-card.tem-detalhe:hover{ transform:translateY(-2px); box-shadow:var(--sombra); }

.ex-card-nome{
  font-size:10.5px; font-weight:600; text-transform:uppercase;
  letter-spacing:.055em; color:var(--muted);
}
.ex-card-valor{
  font-family:var(--f-titulo); font-size:31px; font-weight:700; line-height:1;
  color:var(--ink); font-variant-numeric:tabular-nums;
}
.ex-card-detalhe{ font-size:11.5px; color:var(--faint); }
.ex-card-var{ font-size:11.5px; font-weight:600; display:flex; align-items:baseline; gap:4px; }
.ex-card-var small{ font-weight:400; color:var(--faint); }
.var-sobe{ color:var(--ok); }
.var-desce{ color:var(--crit); }
.var-igual{ color:var(--muted); }

/* Estados de cor - regra documentada em js/kpis.js */
.ex-card.estado-neutro{ border-top-color:var(--line-forte); }
.ex-card.estado-favoravel{ border-top-color:var(--ok); }
.ex-card.estado-favoravel .ex-card-valor{ color:var(--ok); }
.ex-card.estado-atencao{ border-top-color:var(--warn); }
.ex-card.estado-atencao .ex-card-valor{ color:var(--warn); }
.ex-card.estado-desfavoravel{ border-top-color:var(--crit); }
.ex-card.estado-desfavoravel .ex-card-valor{ color:var(--crit); }

/* filtros ativos */
.ex-ativos{
  display:flex; align-items:center; gap:7px; flex-wrap:wrap;
  padding:9px 0 3px; font-size:12.5px;
}
.ex-ativos-titulo{ color:var(--muted); font-weight:600; }
.ex-chip-filtro{
  display:inline-flex; align-items:center; gap:5px; padding:3px 9px;
  border:1px solid var(--brand-fraco); border-radius:100px;
  background:var(--brand-fraco); color:var(--brand);
  font-family:var(--f-texto); font-size:12px; cursor:pointer;
}
.ex-chip-filtro:hover{ border-color:var(--brand); }
.ex-chip-filtro span{ opacity:.6; font-weight:700; }

/* tabela do quadro */
.tabela-quadro th.num, .tabela-quadro td.num{ text-align:right; }
.tabela-quadro td.num{ font-family:var(--f-mono); font-variant-numeric:tabular-nums; }
.tabela-quadro tr.tem-detalhe{ cursor:pointer; }
.tabela-quadro .td-nome .td-sub{ display:block; font-weight:400; }

.num-critico{ color:var(--crit); font-weight:600; }
.num-atencao{ color:var(--warn); font-weight:600; }
.num-ok{ color:var(--ok); font-weight:600; }

.ex-ordenar{
  border:0; background:none; padding:0; cursor:pointer; color:inherit;
  font:inherit; text-transform:inherit; letter-spacing:inherit;
}
.ex-ordenar:hover{ color:var(--brand-2); }
.ex-ordenar.is-ativo{ color:var(--brand); }

/* movimentacoes em tres colunas */
.ex-mov{ display:grid; gap:16px; grid-template-columns:repeat(3,1fr); }
.ex-mov-coluna h3{
  margin:0 0 8px; font-family:var(--f-titulo); font-size:12.5px; font-weight:600;
  text-transform:uppercase; letter-spacing:.04em; color:var(--muted);
  display:flex; align-items:center; gap:7px;
}
.ex-mov-coluna h3 span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:21px; height:21px; padding:0 6px; border-radius:100px;
  background:var(--surface-3); color:var(--ink); font-size:11.5px;
}
.ex-mov-lista{ display:flex; flex-direction:column; gap:5px; max-height:270px; overflow-y:auto; }
.ex-mov-item{
  padding:7px 9px; border-radius:var(--r-sm); background:var(--surface-2);
  font-size:12.5px; cursor:pointer;
}
.ex-mov-item:hover{ background:var(--surface-3); }
.ex-mov-item b{ display:block; color:var(--ink); }
.ex-mov-item span{ color:var(--muted); font-size:11.5px; }
.ex-mov-item small{ display:block; color:var(--faint); font-size:11px; margin-top:1px; }
.ex-mov-mais{ margin:2px 0 0; font-size:11.5px; color:var(--faint); text-align:center; }

/* detalhe do departamento */
.ex-det-numeros{
  display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(104px,1fr));
  margin-bottom:14px;
}
.ex-det-numeros > div{
  padding:10px 12px; background:var(--surface-2); border-radius:var(--r);
  display:flex; flex-direction:column; gap:2px;
}
.ex-det-numeros span{ font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.ex-det-numeros b{ font-family:var(--f-titulo); font-size:21px; color:var(--ink); }
.ex-det-numeros .num-critico b{ color:var(--crit); }
.ex-det-numeros .num-ok b{ color:var(--ok); }

.ex-det-bloco{ margin-bottom:13px; }
.ex-det-bloco h4{
  margin:0 0 6px; font-size:11.5px; font-weight:600; text-transform:uppercase;
  letter-spacing:.04em; color:var(--muted); display:flex; align-items:center; gap:6px;
}
.ex-det-bloco h4 span{
  padding:1px 7px; border-radius:100px; background:var(--surface-3);
  color:var(--ink); font-size:11px;
}
.ex-det-item{
  display:flex; align-items:baseline; gap:9px; flex-wrap:wrap;
  padding:6px 9px; border-radius:var(--r-sm); background:var(--surface-2);
  margin-bottom:4px; font-size:12.5px;
}
.ex-det-item b{ color:var(--ink); }
.ex-det-item span{ color:var(--muted); font-size:11.5px; }
.ex-det-item small{ margin-left:auto; color:var(--faint); font-size:11px; }
.ex-det-vazio{ margin:0; font-size:12px; color:var(--faint); }

@media (max-width:1100px){
  .ex-mov{ grid-template-columns:1fr; }
}
@media (max-width:860px){
  .ex-kpis{ grid-template-columns:repeat(auto-fit,minmax(142px,1fr)); }
  .ex-card-valor{ font-size:26px; }
}

.ex-card-indisponivel{ border-top-color:var(--line-forte); background:var(--surface-2); }
.ex-card-indisponivel .ex-card-valor{ color:var(--faint); }
.ex-card-falta{ font-size:11px; color:var(--muted); line-height:1.4; }

/* ===========================================================================
   IMPORTACAO DE COLABORADORES
   =========================================================================== */

.imp-passos{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.imp-passo{
  display:flex; align-items:center; gap:7px; padding:6px 12px;
  border:1px solid var(--line); border-radius:100px;
  font-size:12.5px; color:var(--muted); background:var(--surface);
}
.imp-passo span{
  display:inline-flex; align-items:center; justify-content:center;
  width:19px; height:19px; border-radius:50%;
  background:var(--surface-3); color:var(--muted);
  font-size:11px; font-weight:700;
}
.imp-passo.is-atual{ border-color:var(--brand); color:var(--brand); font-weight:600; }
.imp-passo.is-atual span{ background:var(--brand); color:#fff; }
.imp-passo.is-feito{ color:var(--ok); border-color:#B9DECC; }
.imp-passo.is-feito span{ background:var(--ok); color:#fff; }

.imp-area{
  display:flex; flex-direction:column; align-items:center; gap:11px;
  padding:48px 20px; text-align:center;
  border:2px dashed var(--line-forte); border-radius:var(--r-lg);
  background:var(--surface);
}
.imp-area svg{ color:var(--brand); }
.imp-area h3{ margin:0; font-family:var(--f-titulo); font-size:17px; color:var(--ink); }
.imp-area p{ margin:0; font-size:13.5px; color:var(--muted); max-width:460px; }

.imp-nota{ font-size:12.5px; color:var(--muted); line-height:1.5; }

.imp-resumo{
  padding:12px 14px; margin-bottom:12px; border-radius:var(--r);
  background:var(--brand-fraco); border:1px solid #C4D3E6;
}
.imp-resumo p{ margin:0 0 5px; font-size:13.5px; color:var(--ink); }
.imp-resumo p:last-child{ margin-bottom:0; }

.imp-revisar td{ background:var(--warn-fraco); }
.imp-grafias{ max-width:360px; }
.imp-grafia{
  display:inline-flex; align-items:center; gap:4px; margin:2px 3px 2px 0;
  padding:2px 7px; border-radius:100px;
  background:var(--surface-3); color:var(--ink-2); font-size:11.5px;
}
.imp-grafia.tem-variacao{ background:var(--warn-fraco); color:var(--warn); }
.imp-grafia small{ opacity:.65; font-weight:600; }

.imp-criar{ display:grid; gap:11px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.imp-criar-item{
  padding:11px 13px; background:var(--surface-2); border-radius:var(--r);
  display:flex; flex-direction:column; gap:2px;
}
.imp-criar-item b{ font-family:var(--f-titulo); font-size:23px; color:var(--brand); }
.imp-criar-item span{ font-size:12.5px; color:var(--ink-2); font-weight:500; }
.imp-criar-item small{ font-size:11px; color:var(--faint); line-height:1.45; }

.imp-pendencias{ display:flex; flex-direction:column; gap:5px; }
.imp-pend-linha{
  display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;
  padding:7px 10px; background:var(--warn-fraco); border-radius:var(--r-sm);
  font-size:12.5px; color:var(--warn);
}
.imp-pend-linha b{ font-family:var(--f-titulo); font-size:14px; }
.imp-pend-linha span{ color:var(--muted); font-size:11.5px; }
.imp-pend-linha.erro{ background:var(--crit-fraco); color:var(--crit); }

.imp-relatorio{ display:flex; flex-direction:column; gap:1px; }
.imp-rel-linha{
  display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  padding:9px 2px; border-bottom:1px solid var(--line); font-size:13.5px;
}
.imp-rel-linha:last-child{ border-bottom:0; }
.imp-rel-linha span{ color:var(--ink-2); }
.imp-rel-linha b{ font-family:var(--f-titulo); font-size:17px; color:var(--ink); }
.imp-rel-linha.ok b{ color:var(--ok); }
.imp-rel-linha.aviso b{ color:var(--warn); }
.imp-rel-linha.erro b{ color:var(--crit); }

/* ===========================================================================
   BUSCA DE FUNCIONALIDADES
   =========================================================================== */

.busca-campo{
  display:flex; align-items:center; gap:9px; padding:10px 13px;
  border:1px solid var(--line-forte); border-radius:var(--r);
  background:var(--surface); margin-bottom:12px;
}
.busca-campo:focus-within{ border-color:var(--brand); }
.busca-campo svg{ color:var(--muted); flex:none; }
.busca-campo input{
  flex:1; border:0; outline:0; background:none; min-width:0;
  font-family:var(--f-texto); font-size:15px; color:var(--ink);
}
.busca-campo input::placeholder{ color:var(--faint); }

.busca-resultados{ max-height:50vh; overflow-y:auto; }

.busca-grupo{ margin-bottom:12px; }
.busca-grupo:last-child{ margin-bottom:0; }
.busca-grupo h4{
  margin:0 0 5px; font-family:var(--f-titulo); font-size:10.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; color:var(--muted);
}

.busca-item{
  display:flex; flex-direction:column; gap:1px; width:100%;
  padding:9px 11px; border:0; border-radius:var(--r-sm);
  background:none; text-align:left; cursor:pointer; font-family:var(--f-texto);
}
.busca-item:hover{ background:var(--surface-2); }
.busca-item.is-ativo{ background:var(--brand-fraco); }
.busca-item-nome{ font-size:14px; font-weight:500; color:var(--ink); }
.busca-item.is-ativo .busca-item-nome{ color:var(--brand); font-weight:600; }
.busca-item-desc{ font-size:12px; color:var(--muted); }

.busca-vazio{ margin:0; padding:22px; text-align:center; font-size:13px; color:var(--muted); }
.busca-dica{ margin:10px 0 0; font-size:11.5px; color:var(--faint); text-align:center; }

/* ===========================================================================
   AUDITORIA
   =========================================================================== */

.aud-dia{ margin-bottom:16px; }
.aud-dia h3{
  margin:0 0 7px; font-family:var(--f-titulo); font-size:12px; font-weight:600;
  text-transform:uppercase; letter-spacing:.05em; color:var(--muted);
}

.aud-item{
  display:grid; align-items:center; gap:11px; width:100%;
  grid-template-columns:48px 72px 1fr auto;
  padding:9px 12px; margin-bottom:4px;
  border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface); text-align:left; cursor:pointer;
  font-family:var(--f-texto);
}
.aud-item:hover{ border-color:var(--line-forte); background:var(--surface-2); }

.aud-hora{
  font-family:var(--f-mono); font-size:12px; color:var(--faint);
  font-variant-numeric:tabular-nums;
}
.aud-acao{
  display:inline-flex; align-items:center; justify-content:center;
  padding:2px 8px; border-radius:100px;
  font-family:var(--f-titulo); font-size:10px; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em;
}
.aud-criou{ background:var(--ok-fraco); color:var(--ok); }
.aud-alterou{ background:var(--info-fraco); color:var(--info); }
.aud-excluiu{ background:var(--crit-fraco); color:var(--crit); }

.aud-texto{ font-size:13px; color:var(--ink-2); min-width:0; overflow:hidden; text-overflow:ellipsis; }
.aud-texto b{ color:var(--ink); }
.aud-texto small{
  margin-left:6px; padding:1px 6px; border-radius:100px;
  background:var(--surface-3); color:var(--muted); font-size:10.5px;
}
.aud-quem{ font-size:12px; color:var(--muted); white-space:nowrap; }

.aud-cabeca{
  display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  margin-bottom:14px; padding:12px; background:var(--surface-2); border-radius:var(--r);
}
.aud-cabeca > div{ display:flex; flex-direction:column; gap:2px; }
.aud-cabeca span{
  font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted);
}
.aud-cabeca b{ font-size:13.5px; color:var(--ink); }

.aud-antes{ color:var(--crit); text-decoration:line-through; opacity:.75; }
.aud-depois{ color:var(--ok); font-weight:500; }

@media (max-width:860px){
  .aud-item{ grid-template-columns:auto auto 1fr; }
  .aud-quem{ grid-column:1/-1; }
}

.busca-futuro{
  display:flex; flex-direction:column; gap:4px;
  padding:16px; border-radius:var(--r);
  background:var(--warn-fraco); border:1px solid #EBD7AE;
}
.busca-futuro b{ font-family:var(--f-titulo); font-size:14.5px; color:var(--warn); }
.busca-futuro span{ font-size:12.5px; color:var(--ink-2); line-height:1.5; }

/* ===========================================================================
   COLABORADORES
   =========================================================================== */

.col-resumo{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.col-card{
  display:flex; flex-direction:column; gap:1px; align-items:flex-start;
  padding:8px 14px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface); cursor:pointer; font-family:var(--f-texto);
  transition:border-color .12s;
}
.col-card:hover{ border-color:var(--line-forte); }
.col-card.is-ativo{ border-color:var(--brand); background:var(--brand-fraco); }
.col-card span{
  font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted);
}
.col-card b{
  font-family:var(--f-titulo); font-size:19px; color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.col-card.is-ativo b{ color:var(--brand); }

.col-pessoa{ display:flex; align-items:center; gap:9px; }

/* Coluna "Tempo": quem ja trabalhou aqui antes mostra os dois tempos.
   O total fica em destaque porque e ele que vale para ferias e beneficios. */
.col-tempo{ display:flex; flex-direction:column; gap:1px; }
.col-tempo-total{ color:var(--ink); font-weight:600; }
.col-tempo-atual{ font-size:11.5px; color:var(--muted); }

/* --- ficha completa --- */

.fc-topo{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid var(--line);
}
.fc-identidade h3{ margin:0; font-family:var(--f-titulo); font-size:19px; color:var(--ink); }
.fc-codigo{ font-family:var(--f-mono); font-size:12px; color:var(--muted); margin-top:2px; }
.fc-chips{ display:flex; gap:5px; flex-wrap:wrap; margin-top:7px; }

.fc-secao{ margin-bottom:16px; }
.fc-secao h4{
  margin:0 0 8px; font-family:var(--f-titulo); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; color:var(--muted);
}

.fc-grade{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(148px,1fr)); }
.fc-dado{
  display:flex; flex-direction:column; gap:1px;
  padding:9px 11px; background:var(--surface-2); border-radius:var(--r);
}
.fc-dado span{ font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.fc-dado b{ font-size:13.5px; color:var(--ink); font-weight:600; word-break:break-word; }

/* Tempo total de empresa de quem retornou: informacao que muda calculo de
   ferias, aviso previo e beneficios, entao nao pode passar despercebida. */
.fc-dado-forte{ background:var(--brand-fraco); border:1px solid var(--brand); }
.fc-dado-forte span{ color:var(--brand); }
.fc-dado-forte b{ color:var(--brand); }

.fc-aviso-retorno{
  margin-top:10px; padding:10px 13px; border-radius:var(--r);
  background:var(--brand-fraco); border-left:3px solid var(--brand);
  font-size:12.5px; color:var(--ink-2); line-height:1.6;
}
.fc-aviso-retorno b{ color:var(--brand); font-weight:600; }

/* Campo que a planilha nao trouxe: fica visivel como pendencia, nunca
   preenchido por conta do sistema. */
.fc-aviso-pendente{
  margin-top:10px; padding:10px 13px; border-radius:var(--r);
  background:var(--warn-fraco); border-left:3px solid var(--warn);
  font-size:12.5px; color:var(--ink-2); line-height:1.6;
}
.fc-aviso-pendente b{ color:var(--warn); font-weight:600; }

/* linha do tempo do historico */
.fc-timeline{ display:flex; flex-direction:column; gap:0; }
.fc-tl-item{
  display:grid; grid-template-columns:118px 1fr; gap:13px;
  padding:11px 0; border-bottom:1px solid var(--line); position:relative;
}
.fc-tl-item:last-child{ border-bottom:0; }
.fc-tl-data{
  font-family:var(--f-mono); font-size:12px; color:var(--ink-2);
  display:flex; flex-direction:column; gap:1px;
}
.fc-tl-data small{ color:var(--faint); font-size:11px; }
.fc-tl-corpo{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.fc-tl-corpo b{ font-size:13.5px; color:var(--ink); }
.fc-tl-corpo span{ font-size:12.5px; color:var(--ink-2); }
.fc-tl-corpo small{ font-size:11.5px; color:var(--faint); font-style:italic; }
.fc-tl-item.is-atual .fc-tl-corpo b{ color:var(--brand); }
.fc-tl-item.is-atual .fc-tl-data{ color:var(--brand); font-weight:600; }

@media (max-width:860px){
  .fc-tl-item{ grid-template-columns:1fr; gap:3px; }
  .col-resumo{ overflow-x:auto; flex-wrap:nowrap; padding-bottom:3px; }
  .col-card{ flex:none; }
}

/* Cartao de pendencia na lista de colaboradores */
.col-card-pendente{ border-color:#EBD7AE; background:var(--warn-fraco); cursor:default; }
.col-card-pendente span{ color:var(--warn); }
.col-card-pendente b{ color:var(--warn); }

/* Soma de quadro + diaria: leitura, nao filtro. */
.col-card-total{ border-style:dashed; cursor:default; }

/* ---------------------------------------------------------------------------
   FORMULARIO DE CADASTRO DO COLABORADOR
   Tres blocos que espelham as tres tabelas do banco: pessoa, vinculo, posicao.
   --------------------------------------------------------------------------- */

.cf-form{ display:flex; flex-direction:column; gap:16px; }

.cf-bloco{
  padding:13px 15px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface);
}
.cf-bloco h4{
  margin:0 0 11px; font-family:var(--f-titulo); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; color:var(--muted);
}

.cf-grade{ display:grid; gap:11px; grid-template-columns:repeat(auto-fit,minmax(186px,1fr)); }

.cf-dica{ display:block; margin-top:3px; font-size:11.5px; color:var(--faint); line-height:1.45; }

.cf-explica{
  margin:0 0 11px; font-size:13px; color:var(--ink-2); line-height:1.6;
}
.cf-explica b{ color:var(--ink); font-weight:600; }

.cf-alerta{
  margin-top:11px; padding:9px 12px; border-radius:var(--r);
  background:var(--warn-fraco); border-left:3px solid var(--warn);
  font-size:12.5px; color:var(--ink-2); line-height:1.55;
}
.cf-alerta b{ color:var(--ink); font-weight:600; }

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

/* ===========================================================================
   INDICADORES DE RH
   =========================================================================== */

.ind-memoria{
  margin-top:12px; padding:10px 13px; border-radius:var(--r);
  background:var(--surface-2); font-size:12.5px; color:var(--ink-2); line-height:1.6;
}
.ind-memoria b{ color:var(--ink); }

.ind-turnover{ display:grid; gap:16px; grid-template-columns:minmax(180px,1fr) 2fr; align-items:start; }

.ind-tx{
  display:flex; flex-direction:column; gap:3px; padding:16px;
  border-radius:var(--r); border:1px solid var(--line); background:var(--surface-2);
}
.ind-tx span{
  font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted);
}
.ind-tx b{
  font-family:var(--f-titulo); font-size:34px; font-weight:700; line-height:1;
  font-variant-numeric:tabular-nums; color:var(--ink);
}
.ind-tx.estado-favoravel{ border-color:#B9DECC; background:var(--ok-fraco); }
.ind-tx.estado-favoravel b{ color:var(--ok); }
.ind-tx.estado-atencao{ border-color:#EBD7AE; background:var(--warn-fraco); }
.ind-tx.estado-atencao b{ color:var(--warn); }
.ind-tx.estado-desfavoravel{ border-color:#E9BDB8; background:var(--crit-fraco); }
.ind-tx.estado-desfavoravel b{ color:var(--crit); }

.ind-conta-titulo{
  font-family:var(--f-titulo); font-size:10.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:6px;
}
.ind-tabela td{ padding:7px 9px; font-size:13px; }
.ind-tabela td.num{ text-align:right; font-family:var(--f-mono); font-variant-numeric:tabular-nums; }
.ind-tabela th.num{ text-align:right; }
.ind-destaque td{ font-weight:600; background:var(--surface-2); }

.ind-formula{
  margin:9px 0 0; padding:9px 11px; border-radius:var(--r-sm);
  background:var(--brand-fraco); color:var(--brand);
  font-family:var(--f-mono); font-size:12.5px;
}
.ind-nota{ margin:8px 0 0; font-size:11.5px; color:var(--muted); line-height:1.55; }

.ind-retencao{ display:grid; gap:11px; grid-template-columns:repeat(auto-fit,minmax(158px,1fr)); }
.ind-ret-item{
  padding:13px; border-radius:var(--r); border:1px solid var(--line);
  background:var(--surface-2); display:flex; flex-direction:column; gap:3px;
}
.ind-ret-prazo{
  font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted);
}
.ind-ret-valor{
  font-family:var(--f-titulo); font-size:27px; font-weight:700; line-height:1;
  color:var(--ink); font-variant-numeric:tabular-nums;
}
.ind-ret-conta{ font-size:12px; color:var(--ink-2); }
.ind-ret-conta span{ display:block; color:var(--muted); font-size:11.5px; }
.ind-ret-item.estado-favoravel{ border-color:#B9DECC; }
.ind-ret-item.estado-favoravel .ind-ret-valor{ color:var(--ok); }
.ind-ret-item.estado-atencao{ border-color:#EBD7AE; }
.ind-ret-item.estado-atencao .ind-ret-valor{ color:var(--warn); }
.ind-ret-item.estado-desfavoravel{ border-color:#E9BDB8; }
.ind-ret-item.estado-desfavoravel .ind-ret-valor{ color:var(--crit); }

.ind-qualidade{ display:grid; gap:14px; grid-template-columns:minmax(170px,1fr) 2fr; align-items:start; }
.ind-pendencias{ display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
.ind-pend{
  display:flex; align-items:baseline; gap:7px; padding:8px 11px;
  background:var(--warn-fraco); border-radius:var(--r-sm);
}
.ind-pend b{ font-family:var(--f-titulo); font-size:17px; color:var(--warn); }
.ind-pend span{ font-size:12px; color:var(--ink-2); }

/* metodologia */
.met-item{ padding:11px 0; border-bottom:1px solid var(--line); }
.met-item:last-child{ border-bottom:0; }
.met-item > b{ font-family:var(--f-titulo); font-size:14px; color:var(--ink); }
.met-formula{
  margin-top:4px; padding:7px 10px; border-radius:var(--r-sm);
  background:var(--surface-2); font-family:var(--f-mono); font-size:12px; color:var(--ink-2);
}
.met-fonte{ margin-top:4px; font-size:11.5px; color:var(--muted); }
.met-obs{ margin-top:3px; font-size:11.5px; color:var(--faint); line-height:1.5; }

@media (max-width:1100px){
  .ind-turnover, .ind-qualidade{ grid-template-columns:1fr; }
}