/* ═══════════════════════════════════════════════
   GIL — Design Tokens 2026 (camada nova)
   ═══════════════════════════════════════════════
   Camada de tokens do redesign, dark-mode-first.
   Prefixo `--d-` para não colidir com tokens.css (legado §21/§34).
   Adotada primeiro pelo Dashboard; outras telas migram aos poucos.

   Princípios:
   1. Cor não é decoração. Acento teal com parcimônia; verde/vermelho
      SÓ para dado (valor positivo/negativo), nunca para enfeite.
   2. Hierarquia por peso e tamanho — não por ALL CAPS nem bold em tudo.
   3. Superfície sobe por hairline sutil, não por sombra pesada.
   4. Sentence case em toda a interface.
   ═══════════════════════════════════════════════ */

:root {
  /* ── Canvas e superfícies ── */
  --d-canvas:      #0b0e13;
  --d-surface:     #141922;
  --d-surface-2:   #1a2029;
  --d-surface-3:   #212936;
  --d-hairline:        rgba(255,255,255,.07);
  --d-hairline-strong: rgba(255,255,255,.13);

  /* ── Texto — 3 níveis, hierarquia por peso/tamanho ── */
  --d-text:        #e8edf4;
  --d-text-2:      #9aa7b8;
  /* text-3 é usado em label de 11px — calibrado para 4.84:1 sobre --d-surface (WCAG AA) */
  --d-text-3:      #7d8795;

  /* ── Acento — teal-neon, uso parcimonioso ── */
  --d-accent:      #2dd4bf;
  --d-accent-soft: rgba(45,212,191,.11);
  --d-accent-line: rgba(45,212,191,.34);
  --d-accent-text: #2dd4bf;

  /* ── Semântica de DADO (nunca decorativa) ── */
  --d-pos:         #34d399;
  --d-neg:         #f87171;
  --d-warn:        #fbbf24;
  --d-pos-soft:    rgba(52,211,153,.11);
  --d-neg-soft:    rgba(248,113,113,.11);
  --d-warn-soft:   rgba(251,191,36,.11);
  --d-pos-line:    rgba(52,211,153,.32);
  --d-neg-line:    rgba(248,113,113,.32);
  --d-warn-line:   rgba(251,191,36,.32);

  /* ── Raio — cantos macios ── */
  --d-r-sm:        10px;
  --d-r:           15px;
  --d-r-lg:        18px;
  --d-r-pill:      999px;

  /* ── Escala tipográfica ── */
  --d-t-micro:     11px;   /* chips, meta */
  --d-t-cap:       12px;   /* labels */
  --d-t-body:      13px;   /* corpo */
  --d-t-sub:       15px;   /* subtítulo de card */
  --d-t-title:     20px;   /* título de tela */
  --d-t-metric:    26px;   /* métrica de card */
  --d-t-hero:      34px;   /* métrica de destaque */

  /* ── Peso — nada de 700/800 em tudo ── */
  --d-w-reg:       400;
  --d-w-med:       500;
  --d-w-semi:      600;

  /* ── Ritmo e movimento ── */
  --d-gap:         14px;
  --d-pad:         18px;
  --d-ease:        160ms cubic-bezier(.2,.7,.3,1);
  --d-shadow:      0 1px 2px rgba(0,0,0,.40), 0 10px 30px rgba(0,0,0,.26);
  --d-shadow-soft: 0 1px 2px rgba(0,0,0,.28);

  /* Numerais tabulares — alinha coluna de valores */
  --d-num: "tnum" 1, "lnum" 1;
}

[data-theme="light"] {
  --d-canvas:      #f4f7fb;
  --d-surface:     #ffffff;
  --d-surface-2:   #f7f9fc;
  --d-surface-3:   #eef3f8;
  --d-hairline:        rgba(16,24,40,.10);
  --d-hairline-strong: rgba(16,24,40,.18);

  --d-text:        #142132;
  --d-text-2:      #566579;
  /* calibrado contra o canvas (--d-canvas), superfície mais clara que o card:
     #657485 dava 4.45 ali e reprovava por pouco */
  --d-text-3:      #5c6b7d;

  /* Teal recalibrado — #2dd4bf não tem contraste em fundo claro */
  --d-accent:      #0d9488;
  --d-accent-soft: rgba(13,148,136,.09);
  --d-accent-line: rgba(13,148,136,.30);
  --d-accent-text: #0f766e;

  --d-pos:         #15803d;
  --d-neg:         #b91c1c;
  /* âmbar mais fechado: em chip (texto sobre -soft 9%) o #a16207 dava 4.38 — reprova AA */
  --d-warn:        #8a5406;
  --d-pos-soft:    rgba(21,128,61,.08);
  --d-neg-soft:    rgba(185,28,28,.08);
  --d-warn-soft:   rgba(161,98,7,.09);
  --d-pos-line:    rgba(21,128,61,.28);
  --d-neg-line:    rgba(185,28,28,.28);
  --d-warn-line:   rgba(161,98,7,.28);

  --d-shadow:      0 1px 2px rgba(16,24,40,.05), 0 8px 24px rgba(16,24,40,.09);
  --d-shadow-soft: 0 1px 2px rgba(16,24,40,.05);
}
