/* Tokens da marca TCA: Verde Floresta #0F3D2E, Dourado Trigo #C9A227, Branco Algodão #F4F1E8.
   Único arquivo com valores de cor. Os nomes dizem o papel, não a cor.
   Tema escuro: automático pelo sistema, ou forçado com data-theme no <html>. */
:root {
  color-scheme: light;
  --bg: #F4F1E8;             /* fundo da página */
  --surface: #FCFBF7;        /* caixas */
  --surface-2: #F0ECE1;      /* cabeçalho de tabela, áreas rebaixadas */
  --field: #FFFFFF;          /* campos de formulário */
  --line: #E3DCCB;           /* filete de 1 px */
  --line-strong: #8F8670;    /* borda de campo (3:1) */
  --ink: #15201B;            /* texto principal */
  --ink-2: #5B665F;          /* texto secundário */
  --brand: #0F3D2E;          /* botão principal, faixa */
  --brand-hover: #1F5A44;
  --brand-ink: #FFFFFF;      /* texto sobre --brand */
  --brand-soft: #E6EDE8;     /* fundo de ícone */
  --band: #0F3D2E;           /* menu lateral */
  --band-ink: #F4F1E8;
  --band-line: rgba(244, 241, 232, .18);   /* filetes e bordas no menu */
  --band-hover: rgba(244, 241, 232, .07);
  --band-active: rgba(244, 241, 232, .11);
  --band-field: rgba(0, 0, 0, .16);
  --accent-text: #0F3D2E;    /* títulos e números em destaque, links */
  --gold: #C9A227;           /* acento: fio, aba ativa, marcador; nunca texto */
  --gold-ink: #7A5F0E;       /* quando o dourado precisa ser texto ou ícone */
  --gold-soft: #F3ECD6;
  --pos: #1B6B43;
  --neg: #A12C24;
  --neg-soft: #F8E9E6;
  --neg-line: #EBCBC6;
  --focus: rgba(15, 61, 46, .22);
  --overlay: rgba(14, 22, 19, .45);
  --shadow: 0 1px 2px rgba(21, 32, 27, .06), 0 4px 12px rgba(21, 32, 27, .04);
  --shadow-raised: 0 12px 32px rgba(21, 32, 27, .18);

  /* Séries de gráfico em ordem fixa (diferem em claridade, não só no tom). */
  --chart-1: #0F3D2E;
  --chart-2: #C9A227;
  --chart-3: #6E9C82;
  --chart-4: #8A6B3D;
  --chart-5: #B5AE9E;

  --radius: 6px;             /* caixas */
  --radius-control: 4px;     /* botões e campos */
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0E1613;
  --surface: #121C18;
  --surface-2: #17231E;
  --field: #0E1613;
  --line: #24332C;
  --line-strong: #5E7469;
  --ink: #ECE8DD;
  --ink-2: #9BA59D;
  --brand: #1F5A44;
  --brand-hover: #276B52;
  --brand-ink: #ECE8DD;
  --brand-soft: #1A2B24;
  --band: #0B281E;
  --band-ink: #ECE8DD;
  --band-line: rgba(236, 232, 221, .14);
  --band-hover: rgba(236, 232, 221, .06);
  --band-active: rgba(236, 232, 221, .1);
  --band-field: rgba(0, 0, 0, .22);
  --accent-text: #8FC7A6;
  --gold: #CDAE4A;
  --gold-ink: #D6BA5E;
  --gold-soft: #2A2615;
  --pos: #5DB884;
  --neg: #E07A70;
  --neg-soft: #2A1715;
  --neg-line: #4A2622;
  --focus: rgba(143, 199, 166, .28);
  --overlay: rgba(0, 0, 0, .6);
  --shadow: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-raised: 0 12px 32px rgba(0, 0, 0, .5);
  --chart-1: #8FC7A6;
  --chart-2: #CDAE4A;
  --chart-3: #5E8C74;
  --chart-4: #B08A55;
  --chart-5: #7D857F;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0E1613;
    --surface: #121C18;
    --surface-2: #17231E;
    --field: #0E1613;
    --line: #24332C;
    --line-strong: #5E7469;
    --ink: #ECE8DD;
    --ink-2: #9BA59D;
    --brand: #1F5A44;
    --brand-hover: #276B52;
    --brand-ink: #ECE8DD;
    --brand-soft: #1A2B24;
    --band: #0B281E;
    --band-ink: #ECE8DD;
    --band-line: rgba(236, 232, 221, .14);
    --band-hover: rgba(236, 232, 221, .06);
    --band-active: rgba(236, 232, 221, .1);
    --band-field: rgba(0, 0, 0, .22);
    --accent-text: #8FC7A6;
    --gold: #CDAE4A;
    --gold-ink: #D6BA5E;
    --gold-soft: #2A2615;
    --pos: #5DB884;
    --neg: #E07A70;
    --neg-soft: #2A1715;
    --neg-line: #4A2622;
    --focus: rgba(143, 199, 166, .28);
    --overlay: rgba(0, 0, 0, .6);
    --shadow: 0 1px 2px rgba(0, 0, 0, .35);
    --shadow-raised: 0 12px 32px rgba(0, 0, 0, .5);
    --chart-1: #8FC7A6;
    --chart-2: #CDAE4A;
    --chart-3: #5E8C74;
    --chart-4: #B08A55;
    --chart-5: #7D857F;
  }
}
