/* Sistema de Laudos — identidade visual própria.
   Paleta sóbria (slate + um acento índigo). Sem dependências externas. */

:root {
  --bg: #f4f5f7;
  --surface: #ffffff;
  --sidebar: #1b2433;
  --sidebar-hover: #273245;
  --sidebar-ativo: #2f6df6;
  --texto: #1f2733;
  --texto-suave: #5b6675;
  --muted: #8a93a2;
  --borda: #e3e6eb;
  --acento: #2f6df6;
  --acento-escuro: #2456c9;
  --ok-bg: #e7f6ec;
  --ok-fg: #1f7a3d;
  --neutro-bg: #eceef1;
  --neutro-fg: #6b7280;
  --perigo: #c8372d;
  --perigo-bg: #fbeae9;
  --sombra: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .08);
  --raio: 10px;
  font-size: 15px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--texto);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--acento); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Layout ---------- */
.layout { display: grid; grid-template-columns: 248px 1fr; min-height: 100vh; }

.sidebar {
  background: var(--sidebar);
  color: #c7cedb;
  display: flex;
  flex-direction: column;
  padding: 18px 14px;
  gap: 22px;
}

.brand { display: flex; align-items: center; gap: 10px; padding: 6px 8px; }
.brand-mark {
  display: grid; place-items: center;
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--acento); color: #fff; font-weight: 700; font-size: .85rem;
  letter-spacing: .5px;
}
.brand-name { font-weight: 600; font-size: .95rem; color: #fff; line-height: 1.2; }

.nav { display: flex; flex-direction: column; gap: 2px; }
.nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: 8px;
  color: #c7cedb; font-size: .92rem; font-weight: 500;
}
.nav-item:hover { background: var(--sidebar-hover); text-decoration: none; color: #fff; }
.nav-item.ativo { background: var(--sidebar-ativo); color: #fff; }
.nav-item .ico { width: 18px; text-align: center; opacity: .9; }

.subnav { display: flex; flex-direction: column; margin: 2px 0 4px 30px; gap: 1px; }
.subnav-item {
  padding: 7px 12px; border-radius: 7px; font-size: .86rem; color: #97a1b2;
}
a.subnav-item:hover { background: var(--sidebar-hover); color: #fff; text-decoration: none; }
.subnav-item.ativo { color: #fff; font-weight: 600; }
.subnav-item.desabilitado { color: #5d6677; cursor: default; display: flex; gap: 6px; align-items: center; }
.subnav-item.desabilitado em {
  font-style: normal; font-size: .68rem; background: #2a3447; color: #8893a6;
  padding: 1px 6px; border-radius: 999px;
}

/* ---------- Main ---------- */
.main { display: flex; flex-direction: column; min-width: 0; }
.topbar {
  height: 60px; background: var(--surface); border-bottom: 1px solid var(--borda);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 28px;
}
.topbar-titulo { font-weight: 600; font-size: .98rem; color: var(--texto); }
.topbar-instrutor { font-size: .82rem; color: var(--texto-suave); }

.conteudo { padding: 28px; max-width: 1100px; width: 100%; }

.page-head { margin-bottom: 20px; }
.page-head h1 { margin: 0 0 4px; font-size: 1.5rem; font-weight: 650; }
.page-head .sub { margin: 0; color: var(--texto-suave); max-width: 70ch; font-size: .9rem; line-height: 1.45; }

/* ---------- Cards / stats ---------- */
.card {
  background: var(--surface); border: 1px solid var(--borda); border-radius: var(--raio);
  box-shadow: var(--sombra); padding: 20px; margin-bottom: 20px;
}
.card h2 { margin: 0 0 14px; font-size: 1.05rem; font-weight: 600; }
.muted { color: var(--texto-suave); font-size: .9rem; line-height: 1.5; }

.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat { background: var(--surface); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra); padding: 18px 20px; }
.stat-num { font-size: 1.9rem; font-weight: 700; line-height: 1; color: var(--acento-escuro); }
.stat-lbl { margin-top: 6px; color: var(--texto-suave); font-size: .85rem; }

/* ---------- Form ---------- */
.form-add h2 { margin-bottom: 14px; }
.grid-form { display: grid; grid-template-columns: 1.4fr 1.6fr 1fr auto; gap: 14px; align-items: end; }
.grid-form.grid-delegacia { grid-template-columns: 1.5fr 1fr 64px 1.7fr auto; }
.grid-form.grid-estande { grid-template-columns: 1.2fr 1.8fr 1fr 1fr 1.2fr auto; }
.grid-form label { display: flex; flex-direction: column; gap: 5px; font-size: .8rem; font-weight: 600; color: var(--texto-suave); }
.grid-form input, .grid-form select, .tabela input, .tabela select {
  font: inherit; font-weight: 400; padding: 9px 11px; border: 1px solid var(--borda);
  border-radius: 8px; background: #fff; color: var(--texto); width: 100%;
}
.grid-form input:focus, .grid-form select:focus, .tabela input:focus, .tabela select:focus {
  outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(47,109,246,.15);
}
.form-acao { display: flex; }

.campos-mun { display: flex; gap: 6px; }
.input-uf { max-width: 60px; text-transform: uppercase; }
.cel-endereco { max-width: 280px; }

.erro { color: var(--perigo); font-size: .85rem; margin: 10px 0 0; font-weight: 500; }

.banner-aviso {
  background: #fff7e6; border: 1px solid #f5d99a; color: #8a5a00;
  padding: 11px 16px; border-radius: var(--raio); margin-bottom: 16px; font-size: .88rem; line-height: 1.45;
}
.banner-aviso a { color: #8a5a00; text-decoration: underline; }

.grid-form.grid-feriado { grid-template-columns: 1fr 190px 1.6fr auto; }
.grid-form.grid-prazo { grid-template-columns: 1.7fr 190px 210px auto; }
.opt { font-weight: 400; color: var(--muted); font-size: .76rem; }

/* ---------- Resultado da calculadora ---------- */
.resultado { border-left: 4px solid var(--borda); }
.resultado.res-ok { border-left-color: var(--ok-fg); background: #fafdfb; }
.resultado.res-alerta { border-left-color: #d99a1c; background: #fffdf6; }
.res-cabeca { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.res-cabeca h2 { margin: 0; }
.res-icone { font-size: 1.3rem; line-height: 1; }
.res-ok .res-icone { color: var(--ok-fg); }
.res-alerta .res-icone { color: #c8870c; }
.res-frase { color: var(--texto); font-size: .95rem; line-height: 1.55; margin: 0 0 16px; }
.res-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin: 0 0 4px; }
.res-grid dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; }
.res-grid dd { margin: 3px 0 0; font-weight: 550; }
.res-feriados { margin-top: 16px; border-top: 1px solid var(--borda); padding-top: 12px; }
.res-feriados h3 { margin: 0 0 8px; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.res-feriados ul { margin: 0; padding-left: 18px; font-size: .88rem; line-height: 1.6; }
.res-sem-feriado { margin: 14px 0 0; font-size: .85rem; }

/* ---------- Botões ---------- */
.btn {
  font: inherit; font-size: .86rem; font-weight: 550;
  padding: 9px 16px; border-radius: 8px; border: 1px solid var(--borda);
  background: #fff; color: var(--texto); cursor: pointer; white-space: nowrap;
}
.btn:hover { background: #f7f8fa; }
.btn-sm { padding: 6px 11px; font-size: .8rem; }
.btn-primario { background: var(--acento); border-color: var(--acento); color: #fff; }
.btn-primario:hover { background: var(--acento-escuro); }
.btn-perigo { color: var(--perigo); border-color: #f0cecb; }
.btn-perigo:hover { background: var(--perigo-bg); }

/* ---------- Tabela ---------- */
.tabela { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tabela thead th {
  text-align: left; font-size: .74rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--muted); font-weight: 600; padding: 0 12px 10px; border-bottom: 1px solid var(--borda);
}
.tabela tbody td { padding: 12px; border-bottom: 1px solid #eef0f3; vertical-align: middle; }
.tabela tbody tr:last-child td { border-bottom: none; }
.tabela tr.inativo td { color: var(--muted); }
.tabela tr.vazio td { text-align: center; color: var(--muted); padding: 26px 12px; }
.col-acoes { text-align: right; white-space: nowrap; }
.col-acoes .btn { margin-left: 6px; }
.linha-edicao td { background: #f9fbff; }
.linha-erro td { padding-top: 0; border-bottom: none; }

/* ---------- Modal de confirmação ---------- */
.modal-confirmacao {
  width: min(520px, calc(100vw - 32px)); padding: 0;
  border: 0; border-radius: 12px; color: var(--texto);
  box-shadow: 0 24px 70px rgba(16, 24, 40, .25);
}
.modal-confirmacao::backdrop { background: rgba(15, 23, 42, .58); }
.modal-confirmacao form { padding: 22px; }
.modal-confirmacao p { line-height: 1.5; }
.modal-confirmacao label { display: flex; flex-direction: column; gap: 7px; margin-top: 18px; font-size: .9rem; }
.modal-confirmacao input {
  width: 100%; font: inherit; padding: 10px 12px;
  border: 1px solid var(--borda); border-radius: 8px;
}
.modal-confirmacao input:focus {
  outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(47,109,246,.15);
}
.modal-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.modal-cabecalho h2 { margin: 0; font-size: 1.15rem; }
.modal-fechar {
  border: 0; background: transparent; color: var(--muted); cursor: pointer;
  font-size: 1.6rem; line-height: 1; padding: 2px 6px;
}
.modal-acoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* ---------- Badges ---------- */
.badge { font-size: .74rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; margin-left: 6px; }
.badge:first-child { margin-left: 0; }
.badge-ativo { background: var(--ok-bg); color: var(--ok-fg); }
.badge-inativo { background: var(--neutro-bg); color: var(--neutro-fg); }
.badge-vencido { background: var(--perigo-bg); color: var(--perigo); }
.badge-assinado { background: #e7eefe; color: var(--acento-escuro); }
.reducao { color: var(--ok-fg); font-weight: 600; font-size: .82rem; }

.grid-form.grid-psico { grid-template-columns: 1.4fr 1fr 150px 150px 1.3fr auto; }
.grid-form input[type="file"] { padding: 7px 9px; font-size: .82rem; background: #fbfcfd; }

/* ---------- Badges de estado (processos) ---------- */
.badge-neutro { background: var(--neutro-bg); color: var(--neutro-fg); }
.badge-info { background: #e7eefe; color: var(--acento-escuro); }
.badge-ok { background: var(--ok-bg); color: var(--ok-fg); }
.badge-perigo { background: var(--perigo-bg); color: var(--perigo); }

/* ---------- Processos ---------- */
.linha-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.busca { display: flex; gap: 10px; }
.busca input { flex: 1; font: inherit; padding: 9px 11px; border: 1px solid var(--borda); border-radius: 8px; }
.busca input:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(47,109,246,.15); }

.grid-form.grid-proc-novo { grid-template-columns: 1.6fr 1fr 1fr; }
.grid-form.grid-pessoa { grid-template-columns: repeat(3, 1fr); }
.grid-form.grid-endereco { grid-template-columns: repeat(3, 1fr); }
.grid-form .col-larga { grid-column: 1 / -1; }
.form-rodape { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; }
.grid-form.grid-resultado { grid-template-columns: 1fr 200px 1.6fr auto; }

.textarea { width: 100%; font: inherit; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 8px; resize: vertical; }
.textarea:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(47,109,246,.15); }

.stat-mini { font-size: 1rem; font-weight: 600; margin-top: 4px; }
.acoes-fluxo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.acoes-fluxo .muted { flex-basis: 100%; margin-top: 4px; }

/* Stepper */
.stepper { display: flex; gap: 4px; flex-wrap: wrap; }
.passo { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1; min-width: 80px; position: relative; }
.passo .bola { width: 14px; height: 14px; border-radius: 50%; background: var(--borda); border: 2px solid var(--borda); z-index: 1; }
.passo .rotulo { font-size: .72rem; color: var(--muted); text-align: center; line-height: 1.25; }
.passo:not(:first-child)::before { content: ""; position: absolute; top: 6px; left: -50%; width: 100%; height: 2px; background: var(--borda); }
.passo.feito .bola { background: var(--ok-fg); border-color: var(--ok-fg); }
.passo.feito::before { background: var(--ok-fg); }
.passo.feito .rotulo { color: var(--texto-suave); }
.passo.atual .bola { background: var(--acento); border-color: var(--acento); box-shadow: 0 0 0 4px rgba(47,109,246,.18); }
.passo.atual::before { background: var(--ok-fg); }
.passo.atual .rotulo { color: var(--acento-escuro); font-weight: 650; }

.banner-reprovado {
  margin-top: 16px; background: var(--perigo-bg); border: 1px solid #f0cecb; color: #9a2820;
  padding: 11px 16px; border-radius: var(--raio); font-size: .9rem; line-height: 1.45;
}

/* Agendamento dentro do processo */
.grid-form.grid-ag-2 { grid-template-columns: 1fr 1fr; }
.grid-form.grid-ag-arma { grid-template-columns: repeat(5, 1fr); }
.prazo-ok, .prazo-alerta { padding: 10px 14px; border-radius: 8px; font-size: .88rem; margin: 0 0 12px; line-height: 1.4; }
.prazo-ok { background: var(--ok-bg); color: var(--ok-fg); }
.prazo-alerta { background: #fff7e6; border: 1px solid #f5d99a; color: #8a5a00; }

.destaque-psico { border-left: 4px solid var(--acento); }
.grid-form.grid-psico-proc { grid-template-columns: 1fr 180px 180px auto; }
.psico-analise { margin: 12px 0 0; font-size: .88rem; font-weight: 500; line-height: 1.4; }
.psico-analise.ok { color: var(--ok-fg); }
.psico-analise.alerta { color: #8a5a00; }
.grid-form.grid-arma { grid-template-columns: 1.2fr 1.4fr 1fr 1fr 1fr 0.9fr auto; }

.muted-inline { font-weight: 400; font-size: .82rem; color: var(--muted); }
.armas-lote { display: flex; flex-direction: column; gap: 10px; }
.arma-linha { display: grid; grid-template-columns: 220px 1fr; gap: 14px; align-items: center; }
.arma-check { display: flex; align-items: center; gap: 9px; font-weight: 550; font-size: .92rem; }
.arma-check input { width: 17px; height: 17px; }
.arma-linha select { font: inherit; padding: 9px 11px; border: 1px solid var(--borda); border-radius: 8px; background: #fff; }
.arma-linha select:disabled { background: #f4f5f7; color: var(--muted); }
.arma-linha select:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(47,109,246,.15); }

.fund-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.fund-grid h3 { margin: 0 0 10px; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.chk { display: flex; align-items: center; gap: 9px; padding: 6px 0; font-size: .92rem; cursor: pointer; }
.chk input { width: 17px; height: 17px; }

@media (max-width: 820px) {
  .arma-linha { grid-template-columns: 1fr; }
  .fund-grid { grid-template-columns: 1fr; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 820px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; }
  .nav { flex-direction: row; flex-wrap: wrap; }
  .subnav { display: none; }
  .grid-form { grid-template-columns: 1fr; }
  .col-acoes { text-align: left; }
  .col-acoes .btn { margin: 4px 6px 0 0; }
}

/* ---------- Lançamento de notas ---------- */
.notas-section { margin-top: 14px; border-top: 1px solid var(--borda); padding-top: 14px; }
.notas-titulo { margin: 0 0 12px; font-size: .9rem; font-weight: 600; color: var(--texto-suave); }
.grid-form.grid-notas-teorica { grid-template-columns: 200px; }
.grid-form.grid-notas-curta { grid-template-columns: 200px 200px 200px 160px auto; }
.grid-form.grid-notas-simples { grid-template-columns: 200px 200px auto; }
.grid-form.grid-notas-lote-curta { grid-template-columns: 160px 160px 160px 140px auto; }
.grid-form.grid-notas-lote-simples { grid-template-columns: 160px 160px auto; }
.input-readonly { background: #f4f5f7 !important; color: var(--texto-suave); font-weight: 600; }
.notas-head { margin-bottom: 10px; }
.card-notas-ok { border-left: 4px solid var(--ok-fg); background: #fafdfb; padding: 14px 20px; display: flex; align-items: center; gap: 10px; }

/* ---------- Lançamento de psicológico em lote ---------- */
.grid-form.grid-psico-lote { grid-template-columns: 1fr 180px 180px auto; }
.psico-procs { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }

/* ---------- APTO / INAPTO no lançamento de notas ---------- */
.apto-radio-group { display: flex; gap: 16px; margin-bottom: 14px; }
.radio-apto, .radio-inapto { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 600; }
.radio-label.apto  { color: var(--ok-fg); }
.radio-label.inapto { color: var(--perigo); }
.radio-apto  input[type="radio"], .radio-inapto input[type="radio"] { width: 17px; height: 17px; }

.motivos-inapto { margin-bottom: 14px; padding: 14px 16px; background: var(--perigo-bg); border: 1px solid #f0cecb; border-radius: var(--raio); }
.motivos-titulo { margin: 0 0 10px; font-size: .88rem; font-weight: 600; color: #9a2820; }
.motivos-checks { display: flex; flex-wrap: wrap; gap: 6px 28px; }
.erro-inline { color: var(--perigo); }

.card-notas-inapto { border-left: 4px solid var(--perigo); background: var(--perigo-bg); padding: 14px 20px; display: flex; flex-direction: column; gap: 6px; }
.notas-ok-detalhe { font-size: .88rem; color: var(--texto-suave); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ---------- Filtro de período (lançamento de notas) ---------- */
.filtro-periodo { margin-bottom: 20px; }
.grid-form.grid-filtro-periodo { grid-template-columns: 180px 180px auto; }
.filtro-acoes { display: flex; gap: 8px; }
.filtro-info { margin: 10px 0 0; font-size: .85rem; }

.grid-form.grid-filtro-notas { grid-template-columns: 160px 160px 1fr auto; }

/* Campos preenchidos por busca de CPF */
.campo-preenchido {
  background: color-mix(in srgb, var(--cor-ok) 8%, var(--fundo-input));
  border-color: var(--cor-ok);
}