/* SIGEPAT — base e componentes */
*, *::before, *::after { box-sizing: border-box; }

html { font-size: 100%; }
html[data-fonte="maior"] { font-size: 112.5%; }
html[data-fonte="maior2"] { font-size: 125%; }

body {
    margin: 0;
    font-family: var(--fonte-base);
    font-size: var(--fonte-tamanho-base);
    line-height: 1.5;
    color: var(--texto-principal);
    background: var(--fundo-pagina);
}

h1, h2, h3 { line-height: 1.25; margin: 0 0 var(--esp-3); }
h1 { font-size: var(--fonte-tamanho-titulo-grande); }
h2 { font-size: var(--fonte-tamanho-titulo); }
h3 { font-size: var(--fonte-tamanho-grande); }
p { margin: 0 0 var(--esp-3); }
a { color: var(--cor-primaria-700); }
a:hover { color: var(--cor-primaria-500); }

:focus-visible {
    outline: none;
    box-shadow: var(--foco-anel);
    border-radius: var(--raio-1);
}

.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 100;
    background: var(--cor-primaria-700); color: #fff;
    padding: var(--esp-2) var(--esp-4); border-radius: 0 0 var(--raio-2) 0;
}
.skip-link:focus { left: 0; }

.num { font-variant-numeric: tabular-nums; }

/* Botões */
.botao {
    display: inline-block; cursor: pointer; text-decoration: none; text-align: center;
    font: inherit; font-weight: 600;
    padding: var(--esp-2) var(--esp-4);
    min-height: 44px; min-width: 44px;
    border-radius: var(--raio-2); border: 1px solid transparent;
    transition: background var(--duracao-rapida) var(--curva-padrao);
}
.botao-primario { background: var(--cor-primaria-700); color: #fff; }
.botao-primario:hover { background: var(--cor-primaria-600); color: #fff; }
.botao-secundario { background: var(--fundo-superficie); color: var(--cor-primaria-700); border-color: var(--cor-primaria-700); }
.botao-secundario:hover { background: var(--cor-primaria-50); }
.botao-terciario { background: transparent; color: var(--cor-primaria-700); text-decoration: underline; border: none; }
.botao-perigo { background: var(--cor-erro); color: #fff; }
.botao-perigo:hover { background: #7E1A1A; color: #fff; }
.botao-largo { width: 100%; }

/* Formulários */
.formulario { max-width: 560px; }
.formulario-largo { max-width: 960px; }
.formulario-linha { display: flex; gap: var(--esp-4); flex-wrap: wrap; align-items: flex-end; }
.formulario-inline { display: flex; gap: var(--esp-2); flex-wrap: wrap; align-items: center; }
.campo { margin-bottom: var(--esp-4); }
.campo label { display: block; font-weight: 600; margin-bottom: var(--esp-1); }
.campo input, .campo select, .campo textarea {
    width: 100%; font: inherit; color: var(--texto-principal);
    background: var(--fundo-superficie);
    border: 1px solid var(--neutro-300); border-radius: var(--raio-2);
    padding: var(--esp-2) var(--esp-3); min-height: 44px;
}
.formulario-inline select { min-height: 40px; width: auto; }
.campo textarea { min-height: auto; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; box-shadow: var(--foco-anel); border-color: var(--cor-primaria-500); }
.dica { font-size: var(--fonte-tamanho-pequena); color: var(--texto-suave); margin: var(--esp-1) 0 0; }
.obrigatorio { font-size: var(--fonte-tamanho-pequena); color: var(--cor-erro); font-weight: 400; }
fieldset { border: 1px solid var(--borda-padrao); border-radius: var(--raio-2); padding: var(--esp-4); margin: 0 0 var(--esp-5); }
legend { font-weight: 700; padding: 0 var(--esp-2); }
.acoes-formulario { display: flex; gap: var(--esp-3); flex-wrap: wrap; margin-top: var(--esp-4); }

/* Cartões e KPIs */
.cartao {
    background: var(--fundo-superficie); border: 1px solid var(--borda-padrao);
    border-radius: var(--raio-3); padding: var(--esp-5); margin-bottom: var(--esp-5);
    box-shadow: var(--sombra-1);
}
.cartao-perigo { border-color: var(--cor-erro); background: var(--cor-erro-fundo); }
.cartao-sucesso { border-color: var(--cor-sucesso); background: var(--cor-sucesso-fundo); }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--esp-4); margin-bottom: var(--esp-5); }
.kpi {
    background: var(--fundo-superficie); border: 1px solid var(--borda-padrao);
    border-radius: var(--raio-3); padding: var(--esp-4); box-shadow: var(--sombra-1);
}
.kpi-alerta { border-color: var(--cor-atencao); background: var(--cor-atencao-fundo); }
.kpi-rotulo { font-size: var(--fonte-tamanho-pequena); color: var(--texto-suave); margin: 0; }
.kpi-valor { font-size: var(--fonte-tamanho-titulo); font-weight: 700; margin: var(--esp-1) 0 0; }

/* Tabelas */
.tabela-envolucro { overflow-x: auto; }
.tabela { width: 100%; border-collapse: collapse; }
.tabela caption { text-align: left; margin-bottom: var(--esp-2); }
.tabela th, .tabela td { text-align: left; padding: var(--esp-2) var(--esp-3); border-bottom: 1px solid var(--borda-padrao); vertical-align: top; }
.tabela thead th { background: var(--neutro-100); position: sticky; top: 0; }
.tabela td.num, .tabela th.num { text-align: right; font-variant-numeric: tabular-nums; }
.tabela-dados tbody tr:hover { background: var(--cor-primaria-50); }

/* Badges */
.badge {
    display: inline-block; font-size: var(--fonte-tamanho-pequena); font-weight: 600;
    padding: 2px var(--esp-2); border-radius: var(--raio-full);
    background: var(--neutro-100); color: var(--neutro-700); border: 1px solid var(--borda-padrao);
}
.badge-sucesso { background: var(--cor-sucesso-fundo); color: var(--cor-sucesso); border-color: var(--cor-sucesso); }
.badge-erro { background: var(--cor-erro-fundo); color: var(--cor-erro); border-color: var(--cor-erro); }
.badge-atencao { background: var(--cor-atencao-fundo); color: var(--cor-atencao); border-color: var(--cor-atencao); }
.badge-info { background: var(--cor-info-fundo); color: var(--cor-info); border-color: var(--cor-info); }

/* Flash */
.flash-lista { margin-bottom: var(--esp-4); }
.flash { padding: var(--esp-3) var(--esp-4); border-radius: var(--raio-2); border: 1px solid; margin-bottom: var(--esp-2); }
.flash-sucesso { background: var(--cor-sucesso-fundo); color: var(--cor-sucesso); border-color: var(--cor-sucesso); }
.flash-erro { background: var(--cor-erro-fundo); color: var(--cor-erro); border-color: var(--cor-erro); }
.flash-atencao { background: var(--cor-atencao-fundo); color: var(--cor-atencao); border-color: var(--cor-atencao); }
.flash-info { background: var(--cor-info-fundo); color: var(--cor-info); border-color: var(--cor-info); }

/* Gráficos em barra (alternativa acessível sem JS) */
.barra-grafico { background: var(--neutro-100); border-radius: var(--raio-full); height: 12px; min-width: 120px; overflow: hidden; }
.barra-preenchimento { background: var(--cor-primaria-500); height: 100%; border-radius: var(--raio-full); }

/* Listas */
.lista-simples { padding-left: var(--esp-4); }
.lista-simples li { margin-bottom: var(--esp-2); }
.lista-definicao { display: grid; grid-template-columns: minmax(140px, 220px) 1fr; gap: var(--esp-1) var(--esp-4); margin: 0; }
.lista-definicao dt { font-weight: 600; color: var(--texto-suave); }
.lista-definicao dd { margin: 0; }
.lista-checkbox { list-style: none; padding: 0; max-height: 320px; overflow-y: auto; border: 1px solid var(--borda-padrao); border-radius: var(--raio-2); }
.lista-checkbox li { padding: var(--esp-2) var(--esp-3); border-bottom: 1px solid var(--borda-padrao); }
.lista-checkbox label { display: flex; gap: var(--esp-2); align-items: baseline; }

/* Timeline */
.timeline { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--cor-primaria-200); }
.timeline li { padding: 0 0 var(--esp-4) var(--esp-4); position: relative; }
.timeline li::before {
    content: ""; position: absolute; left: -7px; top: 4px;
    width: 12px; height: 12px; border-radius: var(--raio-full);
    background: var(--cor-primaria-500); border: 2px solid var(--fundo-superficie);
}
.timeline-data { font-size: var(--fonte-tamanho-pequena); color: var(--texto-suave); margin: 0; }
.timeline-texto { margin: 0; }

/* Paginação, filtros, vazios */
.paginacao ul { list-style: none; display: flex; gap: var(--esp-2); padding: 0; flex-wrap: wrap; }
.paginacao a, .paginacao .pagina-atual {
    display: inline-block; min-width: 44px; min-height: 44px; line-height: 44px;
    text-align: center; border-radius: var(--raio-2); text-decoration: none;
    border: 1px solid var(--borda-padrao); padding: 0 var(--esp-2);
}
.paginacao .pagina-atual { background: var(--cor-primaria-700); color: #fff; border-color: var(--cor-primaria-700); }
.paginacao-info { color: var(--texto-suave); font-size: var(--fonte-tamanho-pequena); }
.filtros { display: flex; gap: var(--esp-4); flex-wrap: wrap; align-items: flex-end;
    background: var(--fundo-superficie); border: 1px solid var(--borda-padrao);
    border-radius: var(--raio-3); padding: var(--esp-4); margin-bottom: var(--esp-4); }
.filtros .campo { margin-bottom: 0; flex: 1 1 180px; }
.campo-acoes { display: flex; gap: var(--esp-2); }
.filtros-abas { display: flex; gap: var(--esp-2); flex-wrap: wrap; margin-bottom: var(--esp-4); }
.filtros-abas a {
    text-decoration: none; padding: var(--esp-2) var(--esp-3); border-radius: var(--raio-full);
    border: 1px solid var(--borda-padrao); min-height: 44px; display: inline-flex; align-items: center;
}
.filtros-abas a.aba-ativa { background: var(--cor-primaria-700); color: #fff; border-color: var(--cor-primaria-700); }
.vazio, .vazio-ilustrado { color: var(--texto-suave); }
.vazio-ilustrado { text-align: center; padding: var(--esp-7) var(--esp-5); }
.resultado-busca { color: var(--texto-suave); }
.acoes-lista { display: flex; gap: var(--esp-3); flex-wrap: wrap; margin-bottom: var(--esp-4); }
.inline { display: inline; }

/* KPIs com chip de ícone colorido (estilo do modelo) */
.kpi { position: relative; border-radius: var(--raio-4); }
.kpi-chip {
    position: absolute; top: var(--esp-4); right: var(--esp-4);
    width: 42px; height: 42px; border-radius: var(--raio-3);
    display: flex; align-items: center; justify-content: center;
}
.kpi-chip-azul  { background: var(--chip-azul-fundo);  color: var(--chip-azul); }
.kpi-chip-roxo  { background: var(--chip-roxo-fundo);  color: var(--chip-roxo); }
.kpi-chip-teal  { background: var(--chip-teal-fundo);  color: var(--chip-teal); }
.kpi-chip-rosa  { background: var(--chip-rosa-fundo);  color: var(--chip-rosa); }
.kpi-chip-ambar { background: var(--chip-ambar-fundo); color: var(--chip-ambar); }

/* Banners de alerta no topo do painel (estilo do modelo) */
.banners-alerta { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: var(--esp-4); margin-bottom: var(--esp-5); }
.banner-alerta {
    display: flex; align-items: center; gap: var(--esp-3);
    border: 1px solid; border-radius: var(--raio-3); padding: var(--esp-3) var(--esp-4);
    font-weight: 600; font-size: var(--fonte-tamanho-pequena);
}
.banner-alerta a { color: inherit; }
.banner-erro { background: var(--cor-erro-fundo); color: var(--cor-erro); border-color: var(--cor-erro); }
.banner-atencao { background: var(--cor-atencao-fundo); color: var(--cor-atencao); border-color: var(--cor-atencao); }
.banner-info { background: var(--cor-info-fundo); color: var(--cor-info); border-color: var(--cor-info); }

.cartao { border-radius: var(--raio-4); }
.icone { vertical-align: -0.18em; }

/* Escolha de nível no formulário da estrutura organizacional */
.opcoes-nivel { display: flex; gap: var(--esp-4); flex-wrap: wrap; }
.opcao-nivel {
    display: flex; align-items: center; gap: var(--esp-2);
    padding: var(--esp-2) var(--esp-3); min-height: 44px; cursor: pointer;
    border: 1px solid var(--borda-padrao); border-radius: var(--raio-2);
}
.opcao-nivel:has(input:checked) { border-color: var(--cor-primaria-700); background: var(--cor-primaria-50); font-weight: 600; }

/* Árvore mestre-detalhe de setores (Secretaria → Unidades → Setores, estilo do sistema antigo) */
.arvore-setores { border: 1px solid var(--borda-padrao); border-radius: var(--raio-2); overflow: hidden; }
.no-arvore { border-bottom: 1px solid var(--borda-padrao); }
.arvore-setores > .no-arvore:last-child { border-bottom: none; }
.no-arvore summary,
.no-arvore.no-folha {
    display: flex; align-items: center; gap: var(--esp-3);
    padding: var(--esp-2) var(--esp-4); min-height: 46px;
    cursor: pointer; list-style: none;
}
.no-arvore.no-folha { cursor: default; }
.no-arvore summary::-webkit-details-marker { display: none; }
.no-arvore summary:hover { background: var(--cor-primaria-50); }
.no-arvore summary:focus-visible { outline: none; box-shadow: inset var(--foco-anel); }
.no-alternar {
    width: 20px; text-align: center; color: var(--cor-primaria-700); font-size: 0.85rem;
    transition: transform var(--duracao-rapida) var(--curva-padrao); flex-shrink: 0;
}
.no-arvore[open] > summary .no-alternar { transform: rotate(90deg); }
.no-alternar-vazio { color: var(--neutro-300); }
.no-nome { flex: 1; min-width: 0; }
.no-codigo { color: var(--texto-suave); font-size: 0.75rem; margin-left: var(--esp-2); }
.no-acoes { display: flex; gap: var(--esp-1); flex-shrink: 0; }
.no-filhos { border-top: 1px solid var(--borda-padrao); }
.nivel-1 > summary, .no-folha.nivel-1 { padding-left: calc(var(--esp-4) + 24px); background-image: linear-gradient(var(--neutro-100), var(--neutro-100)); background-size: 3px 100%; background-repeat: no-repeat; background-position: var(--esp-4) 0; }
.nivel-2 > summary, .no-folha.nivel-2 { padding-left: calc(var(--esp-4) + 48px); }
.nivel-3 > summary, .no-folha.nivel-3 { padding-left: calc(var(--esp-4) + 72px); }
.no-folha:hover { background: var(--neutro-50); }

/* Relatório da migração web (saída do migrador em texto) */
.relatorio-migracao {
    background: var(--neutro-100); border: 1px solid var(--borda-padrao);
    border-radius: var(--raio-2); padding: var(--esp-4);
    overflow-x: auto; font-size: var(--fonte-tamanho-pequena);
    line-height: 1.6; white-space: pre-wrap; word-break: break-word;
}

/* Cartões da central de relatórios */
.cartao-relatorio { display: block; text-decoration: none; color: var(--texto-principal); transition: box-shadow var(--duracao-rapida) var(--curva-padrao); }
.cartao-relatorio:hover { box-shadow: var(--sombra-2); border-color: var(--cor-primaria-300); color: var(--texto-principal); }
.cartao-relatorio h3 { color: var(--cor-primaria-700); }
.cartao-relatorio p { color: var(--texto-suave); margin: 0; }

/* Galeria de fotos e anexos do bem */
.galeria-anexos { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--esp-4); margin: 0 0 var(--esp-4); }
.galeria-anexos li { display: flex; flex-direction: column; gap: var(--esp-1); max-width: 180px; }
.anexo-miniatura {
    width: 160px; height: 120px; object-fit: cover;
    border-radius: var(--raio-2); border: 1px solid var(--borda-padrao);
}

/* ---------------- Modo compacto (Preferências) ----------------
   Reduz espaçamentos e alturas para caber mais informação por tela.
   Alvos de toque permanecem >= 24px (WCAG 2.5.8). */
:root[data-densidade="compacta"] body { font-size: 0.94rem; }
:root[data-densidade="compacta"] .conteudo { padding: var(--esp-4); }
:root[data-densidade="compacta"] .titulo-pagina { margin-bottom: var(--esp-3); }
:root[data-densidade="compacta"] .cartao { padding: var(--esp-3); margin-bottom: var(--esp-3); }
:root[data-densidade="compacta"] .kpis { gap: var(--esp-3); margin-bottom: var(--esp-3); }
:root[data-densidade="compacta"] .kpi { padding: var(--esp-3); }
:root[data-densidade="compacta"] .kpi-valor { font-size: var(--fonte-tamanho-grande); }
:root[data-densidade="compacta"] .kpi-chip { width: 34px; height: 34px; top: var(--esp-2); right: var(--esp-2); }
:root[data-densidade="compacta"] .tabela th,
:root[data-densidade="compacta"] .tabela td { padding: var(--esp-1) var(--esp-2); }
:root[data-densidade="compacta"] .campo { margin-bottom: var(--esp-2); }
:root[data-densidade="compacta"] .campo input,
:root[data-densidade="compacta"] .campo select,
:root[data-densidade="compacta"] .campo textarea { min-height: 34px; padding: var(--esp-1) var(--esp-2); }
:root[data-densidade="compacta"] .botao { min-height: 34px; padding: var(--esp-1) var(--esp-3); }
:root[data-densidade="compacta"] .filtros { padding: var(--esp-3); gap: var(--esp-3); margin-bottom: var(--esp-3); }
:root[data-densidade="compacta"] .sidebar-menu a { min-height: 34px; padding: var(--esp-1) var(--esp-3); }
:root[data-densidade="compacta"] .sidebar { padding: var(--esp-3) var(--esp-2); }
:root[data-densidade="compacta"] .topbar { padding: var(--esp-2) var(--esp-4); }
:root[data-densidade="compacta"] .topbar-busca input { min-height: 36px; }
:root[data-densidade="compacta"] .grade-2col,
:root[data-densidade="compacta"] .grade-3col { gap: var(--esp-3); }
:root[data-densidade="compacta"] fieldset { padding: var(--esp-3); margin-bottom: var(--esp-3); }
:root[data-densidade="compacta"] .paginacao a,
:root[data-densidade="compacta"] .paginacao .pagina-atual { min-width: 32px; min-height: 32px; line-height: 32px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}
