/*
 * Tokens e componentes base compartilhados por todas as ferramentas do
 * portal (cores, espaçamento, reset, botão genérico). Cada ferramenta
 * carrega este arquivo antes do seu próprio CSS.
 */

:root {
  --azul:        #2f75b6;
  --azul-escuro: #1f4e7a;
  /* Tons ajustados para ≥4,5:1 (WCAG AA) contra seu -bg correspondente,
     medido — não são os tons "naturais" da paleta. Ver dark mode abaixo
     para as variantes usadas no tema escuro. */
  --ok:          #257e49;
  --ok-bg:       #e5f6ec;
  --div:         #c53030;
  --div-bg:      #fbe7e7;
  --so-dirf:     #906809;
  --so-dirf-bg:  #fdf3d9;
  --so-xml:      #2b6cb0;
  --so-xml-bg:   #e7f0fa;

  --fundo:       #f4f6f8;
  --superficie:  #ffffff;
  --borda:       #dde3e9;
  --texto:       #1c2530;
  --texto-fraco: #5b6b7a;

  --espaco-1: 4px;
  --espaco-2: 8px;
  --espaco-3: 16px;
  --espaco-4: 24px;
  --espaco-5: 32px;

  --ease-saida: cubic-bezier(0.25, 1, 0.5, 1); /* ease-out-quart */
}

@media (prefers-color-scheme: dark) {
  :root {
    --fundo:       #14181d;
    --superficie:  #1c2229;
    --borda:       #2c343d;
    --texto:       #e6ebf0;
    --texto-fraco: #94a3b1;
    /* Acentos próprios para o tema escuro — os tons do tema claro não
       têm contraste suficiente contra estes -bg escuros (medido < 4,5:1). */
    --ok:          #30a660;
    --ok-bg:       #10301f;
    --div:         #d96363;
    --div-bg:      #3a1414;
    --so-dirf:     #c08b0c;
    --so-dirf-bg:  #362a0a;
    --so-xml:      #4f90d4;
    --so-xml-bg:   #142538;
  }
}

* { box-sizing: border-box; }

.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;
}

body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--fundo);
  color: var(--texto);
  font-size: 14px;
  line-height: 1.45;
}

.botao {
  border: 1px solid var(--borda);
  background: var(--superficie);
  color: var(--texto);
  border-radius: 6px;
  padding: 7px 14px;
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: background-color .12s ease, border-color .12s ease, transform .1s var(--ease-saida);
}

.botao:hover { border-color: var(--azul); }
.botao:active:not(:disabled) { transform: scale(0.97); }
.botao:disabled { opacity: .5; cursor: default; }
.botao:focus-visible { outline: 2px solid var(--azul); outline-offset: 1px; }

.botao-primario {
  background: var(--azul);
  border-color: var(--azul);
  color: #fff;
  font-weight: 600;
}
.botao-primario:hover { background: var(--azul-escuro); border-color: var(--azul-escuro); }

.botao-secundario { font-weight: 500; }

.botao-texto {
  border-color: transparent;
  background: transparent;
  color: var(--texto-fraco);
}
.botao-texto:hover { color: var(--azul); border-color: transparent; }

@media (pointer: coarse) {
  .botao { min-height: 44px; padding-top: 12px; padding-bottom: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .botao { transition: none; }
  .botao:active:not(:disabled) { transform: none; }
}