/* ═════════════════════════════════════════════════════════════
   Cortex Design System — Design Tokens
   Fonte única (single source of truth) — carregado via
   admin/base_site.html para todas as páginas custom do admin
   (reports, orders, datasul, payload viewer, index).
   Apenas variáveis :root — nenhum estilo de elemento aqui.
   Tokens conforme DESIGN.md (valores canônicos).
   ═════════════════════════════════════════════════════════════ */

:root {
  /* Surfaces — tonal layering replaces shadows */
  --surface-dim: #111319;
  --surface-container-lowest: #0C0E14;
  --surface-container-low: #191B22;
  --surface-container-high: #282A30;
  --surface-container-highest: rgba(40, 42, 48, 0.70);

  /* Brand / Primary */
  --k-primary: #ADC6FF;
  --k-primary-container: #4D8EFF;
  --k-primary-tint: rgba(77, 142, 255, 0.08);
  --gradient-primary: linear-gradient(135deg, #ADC6FF 0%, #4D8EFF 100%);

  /* Semantic */
  --k-secondary: #4ADE80;
  --k-error: #F87171;
  --k-warning: #FBBF24;

  /* Accents (labels only) */
  --k-accent-violet: #A78BFA;
  --k-accent-teal: #22D3EE;
  --k-accent-amber: #FBBF24;

  /* Text */
  --on-surface: #E2E2E5;
  --on-surface-variant: #C2C6D6;

  /* Ghost borders */
  --ghost-border: rgba(194, 198, 214, 0.15);
  --ghost-border-20: rgba(194, 198, 214, 0.20);
  --ghost-border-10: rgba(194, 198, 214, 0.10);

  /* Alpha variants — tints derivados dos tokens de cor (backgrounds, bordas e
     sombras). Padrão de nome: {token}-{pct} (--k-primary-12 = azul vivo
     --k-primary-container a 12%). --k-primary-light-* tintam o azul claro
     (--k-primary). Valores idênticos aos literais rgba() que substituem —
     zero mudança visual. */
  --k-primary-12: rgba(77, 142, 255, 0.12);
  --k-primary-14: rgba(77, 142, 255, 0.14);
  --k-primary-18: rgba(77, 142, 255, 0.18);
  --k-primary-35: rgba(77, 142, 255, 0.35);
  --k-primary-40: rgba(77, 142, 255, 0.40);
  --k-primary-45: rgba(77, 142, 255, 0.45);
  --k-primary-50: rgba(77, 142, 255, 0.50);
  --k-primary-65: rgba(77, 142, 255, 0.65);
  --k-primary-light-12: rgba(173, 198, 255, 0.12);
  --k-primary-light-14: rgba(173, 198, 255, 0.14);
  --k-primary-light-22: rgba(173, 198, 255, 0.22);
  --k-primary-light-25: rgba(173, 198, 255, 0.25);
  --k-secondary-08: rgba(74, 222, 128, 0.08);
  --k-secondary-12: rgba(74, 222, 128, 0.12);
  --k-secondary-14: rgba(74, 222, 128, 0.14);
  --k-secondary-35: rgba(74, 222, 128, 0.35);
  --k-secondary-45: rgba(74, 222, 128, 0.45);
  --k-secondary-50: rgba(74, 222, 128, 0.50);
  --k-secondary-55: rgba(74, 222, 128, 0.55);
  --k-warning-08: rgba(251, 191, 36, 0.08);
  --k-warning-12: rgba(251, 191, 36, 0.12);
  --k-warning-14: rgba(251, 191, 36, 0.14);
  --k-warning-25: rgba(251, 191, 36, 0.25);
  --k-warning-35: rgba(251, 191, 36, 0.35);
  --k-warning-45: rgba(251, 191, 36, 0.45);
  --k-warning-50: rgba(251, 191, 36, 0.50);
  --k-warning-55: rgba(251, 191, 36, 0.55);
  --k-error-05: rgba(248, 113, 113, 0.05);
  --k-error-08: rgba(248, 113, 113, 0.08);
  --k-error-10: rgba(248, 113, 113, 0.10);
  --k-error-12: rgba(248, 113, 113, 0.12);
  --k-error-14: rgba(248, 113, 113, 0.14);
  --k-error-25: rgba(248, 113, 113, 0.25);
  --k-error-35: rgba(248, 113, 113, 0.35);
  --k-error-45: rgba(248, 113, 113, 0.45);
  --k-error-50: rgba(248, 113, 113, 0.50);
  --k-error-55: rgba(248, 113, 113, 0.55);
  --k-accent-teal-14: rgba(34, 211, 238, 0.14);
  --k-accent-teal-45: rgba(34, 211, 238, 0.45);
  --on-surface-variant-04: rgba(194, 198, 214, 0.04);
  --on-surface-variant-08: rgba(194, 198, 214, 0.08);
  --on-surface-variant-12: rgba(194, 198, 214, 0.12);
  --on-surface-variant-22: rgba(194, 198, 214, 0.22);
  --on-surface-variant-40: rgba(194, 198, 214, 0.40);
  --surface-container-lowest-86: rgba(12, 14, 20, 0.86);

  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
  --text-display-sm: 36px;
  --text-title-sm: 16px;
  --text-body-sm: 13px;
  --text-label-sm: 11px;
  --text-code-sm: 12px;

  /* Spacing */
  --radius: 8px;
  --radius-sm: 4px;
  --card-padding: 20px;
  --sidebar-width: 240px;

  /* Motion */
  --motion-fast: 150ms;
  --motion-base: 200ms;
  --motion-slow: 300ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);

  /* Shadows — used sparingly, tonal layering preferred */
  --shadow-overlay: 0 8px 24px rgba(0, 0, 0, 0.40);
  --shadow-ambient: 0 32px 64px rgba(0, 0, 0, 0.12);
  --shadow-glow-primary: 0 0 24px rgba(77, 142, 255, 0.25);

  /* Chart palette (charts only — never on UI controls) */
  --chart-1: #4D8EFF;
  --chart-2: #34D399;
  --chart-3: #FBBF24;
  --chart-4: #F87171;
  --chart-5: #A78BFA;
  --chart-6: #60A5FA;
  --chart-7: #F472B6;
  --chart-8: #9CA3AF;
  --chart-grid: rgba(194, 198, 214, 0.10);
}
