/* Design tokens — tema claro (padrão) e escuro via [data-tema="escuro"] */
:root {
  /* Superfícies */
  --cor-fundo: #f4f3ef;
  --cor-superficie: #ffffff;
  --cor-superficie-2: #f9f8f6;
  --cor-texto: #252422;
  --cor-texto-suave: #66615b;
  --cor-borda: #e3e1dc;

  /* Sidebar (escura nos dois temas) */
  --cor-sidebar: #2c2a29;
  --cor-sidebar-texto: #d5d2cc;
  --cor-sidebar-texto-forte: #ffffff;
  --cor-sidebar-hover: rgb(255 255 255 / 0.08);
  --cor-sidebar-ativo: #ef8157;

  /* Marca: teal. "Viva" = decorativa (áreas grandes); base = AA para texto/botões */
  --cor-primaria: #1d7e81;
  --cor-primaria-viva: #51cbce;
  --cor-primaria-hover: #15595b;
  --cor-primaria-contraste: #ffffff;

  /* Acentos (base AA / viva decorativa / fundo suave) */
  --cor-perigo: #b3411c;
  --cor-perigo-viva: #ef8157;
  --cor-perigo-fundo: #fdeee7;
  --cor-sucesso: #1e7e34;
  --cor-sucesso-viva: #6bd098;
  --cor-sucesso-fundo: #e8f8ef;
  --cor-aviso: #8a6100;
  --cor-aviso-viva: #fbc658;
  --cor-aviso-fundo: #fdf3d9;
  --cor-info: #1c6d8a;
  --cor-info-viva: #51bcda;
  --cor-info-fundo: #e6f5fa;

  /* Aliases usados por templates/CSS legados */
  --cor-erro: var(--cor-perigo);
  --cor-erro-fundo: var(--cor-perigo-fundo);

  --cor-foco: #1d4ed8;

  /* Forma */
  --raio: 12px;
  --raio-pill: 999px;
  --sombra: 0 6px 10px -4px rgb(0 0 0 / 0.15);
  --sombra-suave: 0 1px 4px rgb(0 0 0 / 0.08);

  /* Medidas do shell */
  --sidebar-largura: 260px;
  --sidebar-largura-recolhida: 76px;
  --topo-altura: 3.75rem;
}

[data-tema="escuro"] {
  --cor-fundo: #14161a;
  --cor-superficie: #1e2126;
  --cor-superficie-2: #262a30;
  --cor-texto: #e8edf3;
  --cor-texto-suave: #a7b1bd;
  --cor-borda: #343a43;

  --cor-sidebar: #101214;
  --cor-sidebar-texto: #b9bfc7;
  --cor-sidebar-texto-forte: #ffffff;
  --cor-sidebar-hover: rgb(255 255 255 / 0.08);
  --cor-sidebar-ativo: #ef8157;

  --cor-primaria: #5ad4d7;
  --cor-primaria-viva: #51cbce;
  --cor-primaria-hover: #7de0e2;
  --cor-primaria-contraste: #06282a;

  --cor-perigo: #ffab8a;
  --cor-perigo-viva: #ef8157;
  --cor-perigo-fundo: #3a1c10;
  --cor-sucesso: #8fe0b2;
  --cor-sucesso-viva: #6bd098;
  --cor-sucesso-fundo: #10301e;
  --cor-aviso: #ffd97e;
  --cor-aviso-viva: #fbc658;
  --cor-aviso-fundo: #38300d;
  --cor-info: #8fd4ec;
  --cor-info-viva: #51bcda;
  --cor-info-fundo: #0f2b38;

  --cor-foco: #93c5fd;

  --sombra: 0 6px 10px -4px rgb(0 0 0 / 0.55);
  --sombra-suave: 0 1px 4px rgb(0 0 0 / 0.4);
}

* { box-sizing: border-box; }

html { color-scheme: light; }
html[data-tema="escuro"] { color-scheme: dark; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  background: var(--cor-fundo);
  color: var(--cor-texto);
}

/* Acessibilidade base */
.pular-conteudo {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--cor-primaria);
  color: var(--cor-primaria-contraste);
  padding: 0.6rem 1rem;
  z-index: 100;
}
.pular-conteudo:focus { left: 0; }

:focus-visible {
  outline: 3px solid var(--cor-foco);
  outline-offset: 2px;
}

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

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

/* Ícones do sprite */
.icone {
  width: 1.25em;
  height: 1.25em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: -0.25em;
  flex-shrink: 0;
}