/* Material Design 3 (M3 / Material You) Design System Tokens */

:root {
  /* Color Palette - Charcoal / Lead Gray Slate Theme (Default) */
  --md-sys-color-primary: #354e6e;
  --md-sys-color-on-primary: #ffffff;
  --md-sys-color-primary-container: #dde4ee;
  --md-sys-color-on-primary-container: #17232f;

  --md-sys-color-secondary: #4b5563;
  --md-sys-color-on-secondary: #ffffff;
  --md-sys-color-secondary-container: #e2e8f0;
  --md-sys-color-on-secondary-container: #1e293b;

  --md-sys-color-tertiary: #64748b;
  --md-sys-color-on-tertiary: #ffffff;
  --md-sys-color-tertiary-container: #f1f5f9;
  --md-sys-color-on-tertiary-container: #0f172a;

  --md-sys-color-surface: #f8fafc;
  --md-sys-color-on-surface: #191c20;
  --md-sys-color-surface-dim: #dedfe5;
  --md-sys-color-surface-bright: #f8fafc;
  --md-sys-color-surface-container-lowest: #ffffff;
  --md-sys-color-surface-container-low: #f7f9fc;
  --md-sys-color-surface-container: #f0f4f9;
  --md-sys-color-surface-container-high: #e8edf5;
  --md-sys-color-surface-container-highest: #e1e7f0;

  --md-sys-color-outline: #707784;
  --md-sys-color-outline-variant: #e0e4ec;

  /* Texto de menor ênfase sobre a superfície: rótulo de campo, texto de apoio,
     contador. Faltava, e no lugar dele se usava `outline` — que é cor de
     BORDA. A especificação separa os dois de propósito: o mesmo cinza que
     serve para um traço de 1px não tem contraste para ler um parágrafo. */
  --md-sys-color-on-surface-variant: #444b57;

  --md-sys-color-inverse-surface: #2f3237;
  --md-sys-color-inverse-on-surface: #f1f3f8;

  --md-sys-color-error: #ba1a1a;
  --md-sys-color-on-error: #ffffff;
  --md-sys-color-error-container: #ffdad6;
  --md-sys-color-on-error-container: #410002;

  --md-sys-color-success: #1b6d37;
  --md-sys-color-on-success: #ffffff;
  --md-sys-color-success-container: #a4f5b2;

  /* Realce momentâneo — o pisca-pisca que aponta a linha recém-mexida. Token, e
     não cor solta, porque no escuro um amarelo de tela clara queima a vista. */
  --md-sys-color-highlight-container: #fff3bf;
  --md-sys-color-on-highlight-container: #4a3a00;

  /* Elevations & Shadows */
  --md-elevation-1: 0px 1px 3px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.12);
  --md-elevation-2: 0px 2px 6px 2px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.15);
  --md-elevation-3: 0px 4px 8px 3px rgba(0, 0, 0, 0.10), 0px 1px 3px 0px rgba(0, 0, 0, 0.18);
  --md-elevation-4: 0px 6px 10px 4px rgba(0, 0, 0, 0.10), 0px 2px 3px 0px rgba(0, 0, 0, 0.20);

  /* Shape Radii */
  --md-shape-corner-xs: 4px;
  --md-shape-corner-s: 8px;
  --md-shape-corner-m: 12px;
  --md-shape-corner-l: 16px;
  --md-shape-corner-xl: 28px;
  --md-shape-corner-full: 9999px;

  /* Typography */
  --md-font-family: 'Plus Jakarta Sans', 'Inter', 'Roboto', system-ui, -apple-system, sans-serif;
  --md-transition-standard: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Dark Theme Overrides */
[data-theme="dark"] {
  --md-sys-color-on-surface-variant: #c3c7d1;
  --md-sys-color-inverse-surface: #e3e6ec;
  --md-sys-color-inverse-on-surface: #2b2f34;

  --md-sys-color-highlight-container: #4a3f14;
  --md-sys-color-on-highlight-container: #ffe9a3;

  --md-sys-color-primary: #8cacd1;
  --md-sys-color-on-primary: #0f172a;
  --md-sys-color-primary-container: #2b4364;
  --md-sys-color-on-primary-container: #dce6f3;

  --md-sys-color-secondary: #cbd5e1;
  --md-sys-color-on-secondary: #1e293b;
  --md-sys-color-secondary-container: #334155;
  --md-sys-color-on-secondary-container: #e2e8f0;

  --md-sys-color-surface: #111318;
  --md-sys-color-on-surface: #e0e2e8;
  --md-sys-color-surface-dim: #111318;
  --md-sys-color-surface-bright: #37393e;
  --md-sys-color-surface-container-lowest: #0c0e13;
  --md-sys-color-surface-container-low: #191c20;
  --md-sys-color-surface-container: #1d2024;
  --md-sys-color-surface-container-high: #282a2f;
  --md-sys-color-surface-container-highest: #33353a;

  --md-sys-color-outline: #8c9199;
  --md-sys-color-outline-variant: #42474e;

  --md-sys-color-error: #ffb4ab;
  --md-sys-color-on-error: #690005;
  --md-sys-color-error-container: #93000a;
  --md-sys-color-on-error-container: #ffdad6;
}