/* SIGERS — tokens da identidade visual (prancha SIGERS, set/2026)
   Azul institucional #0B2D45 · Turquesa saneamento #009EAD · Verde conformidade #43B983
   Fundo #F4F7FA · Texto #102638. Tema claro é o padrão; escuro é opcional. */
:root,[data-tema=claro]{
  --ground:#F4F7FA;--bg:#FFFFFF;--surface:#FFFFFF;--line:#D9E2EC;
  --navy:#0B2D45;--turquesa:#009EAD;
  --acento:#007A87;--azul:#0B2D45;--cta:#00808F;--cta-hover:#009EAD;--cta-texto:#FFFFFF;
  --text:#102638;--muted:#5B6B7C;
  --ok:#146C43;--ok-fundo:#E3F5EC;--atencao:#B45309;--atencao-fundo:#FDF1DC;--perigo:#C0392B;--perigo-fundo:#FDE4E1;
  --menu-bg:#0B2D45;--menu-text:#FFFFFF;--menu-muted:#B8C4D0;--menu-ativo:rgba(0,158,173,.18);--menu-ativo-text:#4FD1DC;
  --raio:8px;--curva:cubic-bezier(.4,0,.2,1);
  --sombra:0 1px 2px rgba(11,45,69,.06),0 4px 16px rgba(11,45,69,.06);
}
[data-tema=escuro]{
  --ground:#08192B;--bg:#0B2D45;--surface:#10375A;--line:#1E4A6E;
  --acento:#4FD1DC;--azul:#8EC5E6;--cta:#00808F;--cta-hover:#009EAD;--cta-texto:#FFFFFF;
  --text:#EAF2F8;--muted:#B8C4D0;
  --ok:#43B983;--ok-fundo:rgba(67,185,131,.15);--atencao:#FBBF24;--atencao-fundo:rgba(251,191,36,.15);--perigo:#F87171;--perigo-fundo:rgba(248,113,113,.15);
  --menu-bg:#08192B;--menu-text:#EAF2F8;--menu-muted:#B8C4D0;--menu-ativo:rgba(0,158,173,.22);--menu-ativo-text:#4FD1DC;
  --sombra:none;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--text);font:16px/1.55 "Inter",system-ui,-apple-system,"Segoe UI",sans-serif}
h1,h2,h3,.numero{font-family:"Manrope",system-ui,sans-serif;line-height:1.2;color:var(--azul)}
.numero{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
a{color:var(--acento)}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
.pular{position:absolute;left:-999px}
.pular:focus{left:16px;top:16px;z-index:50;background:var(--cta);color:var(--cta-texto);padding:12px 16px;border-radius:var(--raio)}

.topo{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:16px;padding:8px 24px;min-height:64px;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:var(--sombra)}
.marca{display:inline-flex;align-items:center;text-decoration:none;line-height:0}
.marca img{height:44px;width:auto}
[data-tema=escuro] .marca{background:#fff;border-radius:var(--raio);padding:4px 10px}
.agencia{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted)}
.aviso-demo{margin-left:auto;font-size:13px;color:var(--atencao);border:1px solid currentColor;border-radius:var(--raio);padding:4px 12px}
.topo .so-mobile{display:none}

.casca{display:grid;grid-template-columns:268px minmax(0,1fr);max-width:1220px;margin:0 auto}
.menu{position:sticky;top:64px;align-self:start;display:flex;flex-direction:column;gap:2px;padding:20px 12px;min-height:calc(100vh - 64px);background:var(--menu-bg);color:var(--menu-text)}
.menu a,.menu .breve{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--raio);color:var(--menu-text);text-decoration:none;font-weight:500;transition:background 200ms var(--curva)}
.menu a:hover{background:rgba(255,255,255,.07)}
.menu a[aria-current=page]{background:var(--menu-ativo);color:var(--menu-ativo-text);box-shadow:inset 3px 0 0 var(--turquesa)}
.menu a:focus-visible{outline-color:var(--menu-ativo-text)}
.menu svg{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.menu .grupo{margin:14px 12px 4px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--menu-muted)}
.menu .breve{color:var(--menu-muted);cursor:default;opacity:.75}
.menu .breve small{margin-left:auto;font-size:9px;letter-spacing:.06em;text-transform:uppercase;border:1px solid currentColor;border-radius:999px;padding:1px 6px;white-space:nowrap;flex:none}
.menu .botao-quieto{border-color:rgba(255,255,255,.25);color:var(--menu-text);margin-top:4px}
.menu .botao-quieto:hover{border-color:var(--menu-ativo-text)}
.menu hr{width:100%;border:0;border-top:1px solid rgba(255,255,255,.12);margin:10px 0}
.assinatura{margin-top:auto;padding:12px;font-size:13px;color:var(--menu-muted)}
main{padding:32px 32px 96px;min-width:0}
main:focus{outline:none}

h1{font-size:30px;margin:0 0 8px}
h2{font-size:20px;margin:48px 0 16px}
.sub{color:var(--muted);margin:0 0 32px;max-width:65ch}
.cabecalho{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;justify-content:space-between;margin-bottom:24px}
.cabecalho .sub{margin-bottom:0}

/* login e identidade de quem entrou */
body.fora .topo,body.fora .casca{display:none}
.login{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-caixa{width:min(440px,100%);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:32px;box-shadow:var(--sombra)}
.login-marca{margin:0 0 28px;line-height:0}
.login-marca img{width:min(300px,100%);height:auto}
[data-tema=escuro] .login-marca{background:#fff;border-radius:var(--raio);padding:12px;display:inline-block}
.login-caixa h1{font-size:24px}
.login-caixa .sub{margin-bottom:24px}
.login-caixa code{font-size:14px;background:var(--surface);padding:2px 6px;border-radius:4px}
.login-rodape{margin:32px 0 0;font-size:13px;color:var(--muted)}
.quem{font-size:14px;color:var(--text);text-decoration:none;padding:6px 12px;border:1px solid var(--line);border-radius:999px;white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.quem:hover{border-color:var(--acento)}
.quem:empty{display:none}
.papel{display:inline-block;font-size:12px;padding:1px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.papel.admin{color:var(--acento);border-color:var(--acento)}
.sub{color:var(--muted)}
.status-aprovado{color:var(--ok)}.status-bloqueado{color:var(--perigo)}.status-pendente{color:var(--atencao)}
.aviso-demo{background:var(--atencao-fundo)}
.acoes-linha{display:flex;flex-wrap:wrap;gap:8px;min-width:200px}
.acoes-linha button{min-height:36px;padding:4px 10px;font-size:14px}
.senha-linha{display:flex;gap:8px;align-items:flex-start}
.senha-linha input{flex:1}

/* botões e campos */
button,select,input,textarea{font:inherit;color:inherit}
.botao,.botao-quieto{min-height:44px;padding:8px 16px;border-radius:var(--raio);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.botao{background:var(--cta);color:var(--cta-texto);border:0;font-weight:600;transition:background 200ms var(--curva)}
.botao:hover{background:var(--cta-hover)}
.botao-quieto{background:transparent;border:1px solid var(--line);color:var(--text);transition:border-color 200ms var(--curva)}
.botao-quieto:hover{border-color:var(--acento)}
.perigo{color:var(--perigo)}
select,input,textarea{min-height:44px;padding:8px 12px;background:var(--ground);border:1px solid var(--line);border-radius:var(--raio);width:100%}
textarea{min-height:96px;resize:vertical}
.agencia select{width:auto}
.campo{display:block;margin-bottom:16px}
.campo>span{display:block;font-size:14px;font-weight:500;margin-bottom:4px}
.campo small{display:block;color:var(--muted);margin-top:4px}
.erro{color:var(--perigo);font-size:14px;margin-top:4px}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.caixa{background:var(--surface);border:1px solid var(--line);border-radius:var(--raio);padding:24px;box-shadow:var(--sombra)}
.form{max-width:720px}

/* indicadores do painel: a régua é o destaque, os números ficam quietos */
.contagem{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--raio);overflow:hidden;margin-bottom:32px;box-shadow:var(--sombra)}
.contagem a{padding:16px 24px;text-decoration:none;color:var(--text);border-right:1px solid var(--line);background:var(--surface)}
.contagem a:last-child{border-right:0}
.contagem strong{display:block;font:700 32px/1 "Manrope",sans-serif;font-variant-numeric:tabular-nums;margin-bottom:4px;color:var(--azul)}
.contagem span{font-size:14px;color:var(--muted)}
.contagem .c-perigo strong{color:var(--perigo)}
.contagem .c-atencao strong{color:var(--atencao)}

/* régua de prazo */
.regua{position:relative;height:8px;border-radius:4px;background:var(--line);margin:12px 0 8px}
.regua i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--ok)}
.regua.atencao i{background:var(--atencao)}
.regua.perigo i{background:var(--perigo)}
.regua.fim i{background:var(--muted)}
.regua b{position:absolute;top:-4px;width:2px;height:16px;background:var(--text);opacity:.7}
.regua-legenda{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:var(--muted)}
.prazo{font-weight:600;display:inline-block;padding:2px 10px;border-radius:999px;font-size:14px}
.prazo.ok{color:var(--ok);background:var(--ok-fundo)}.prazo.atencao{color:var(--atencao);background:var(--atencao-fundo)}.prazo.perigo{color:var(--perigo);background:var(--perigo-fundo)}.prazo.fim{color:var(--muted);background:var(--ground)}

.fila{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.fila li{border-bottom:1px solid var(--line)}
.fila a{display:grid;grid-template-columns:140px minmax(0,1fr) 220px;gap:24px;align-items:center;padding:16px 8px;color:var(--text);text-decoration:none;transition:background 200ms var(--curva)}
.fila a:hover{background:var(--surface)}
.fila p{margin:0}
.fila .objeto{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila small{color:var(--muted)}
.fila .regua{margin:4px 0}

.etiqueta{display:inline-block;font-size:13px;padding:2px 8px;border-radius:4px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.filtros{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px;margin-bottom:24px}
.tabela{overflow-x:auto}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:12px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:14px;font-weight:500;color:var(--muted)}
td input{min-width:72px}
.vazio{padding:48px 24px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--raio)}

/* autos do processo */
.autos{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start}
.ficha{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px}
.ficha dt{color:var(--muted);font-size:14px}
.ficha dd{margin:0}
.numero-grande{font-size:40px;color:var(--azul);margin:0}
.linha-tempo{list-style:none;margin:0;padding:0 0 0 24px;border-left:2px solid var(--line)}
.linha-tempo li{position:relative;padding:0 0 24px 8px}
.linha-tempo li::before{content:"";position:absolute;left:-31px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--ground);border:2px solid var(--acento)}
.linha-tempo li.decisao::before{background:var(--acento)}
.linha-tempo header{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;margin-bottom:4px}
.linha-tempo p{margin:0}
.linha-tempo small{color:var(--muted)}
.anexo{font-size:14px;margin-top:4px!important}
.nota{font-size:14px;color:var(--muted);border-left:3px solid var(--line);padding-left:12px;margin:16px 0}

.aviso{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:50;background:var(--text);color:var(--ground);padding:12px 24px;border-radius:var(--raio);font-weight:500;opacity:0;pointer-events:none;transition:opacity 250ms var(--curva);max-width:calc(100vw - 32px)}
.aviso.visivel{opacity:1}
dialog{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:var(--raio);padding:24px;width:min(560px,calc(100vw - 32px))}
dialog::backdrop{background:rgba(5,7,15,.7)}
dialog h2{margin-top:0}
.acoes{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end;margin-top:24px}
.check{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}
.check input{width:20px;min-height:20px;height:20px;margin-top:2px;flex:none}

@media (max-width:900px){
  .casca{grid-template-columns:1fr}
  .topo .so-mobile{display:inline-flex}
  .menu{display:none;position:static;min-height:0}
  .menu.aberto{display:flex}
  .topo{flex-wrap:wrap;padding:8px 16px}
  .aviso-demo{order:9;margin-left:0;width:100%;text-align:center}
  .agencia span{display:none}
  .quem{display:none}
  main{padding:24px 16px 64px}
  .contagem{grid-template-columns:1fr 1fr}
  .contagem a:nth-child(2){border-right:0}
  .contagem a:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .fila a{grid-template-columns:1fr;gap:4px}
  .fila .objeto{white-space:normal}
  .filtros,.duas,.autos{grid-template-columns:1fr}
  .numero-grande{font-size:32px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
