/* Design tokens: culori, spațieri, tipografie. Temă zi/noapte cu autodetecție.
   Strategia temei (conform planului):
   - :root = tema luminoasă implicită
   - @media (prefers-color-scheme: dark) = tema întunecată automată
   - :root[data-theme="light"|"dark"] = override manual, câștigă în ambele sensuri */

:root {
  /* Paletă de brand — albastru „apă” */
  --brand-50:  #eef6ff;
  --brand-100: #d9eaff;
  --brand-200: #b6d5ff;
  --brand-300: #86b8ff;
  --brand-400: #4f92f7;
  --brand-500: #2b6fe0;
  --brand-600: #1d54bd;
  --brand-700: #1a4499;
  --brand-800: #1a3b7d;
  --brand-900: #1a3468;

  /* Suprafețe și text (light) */
  --bg:            #f4f6f9;
  --surface:       #ffffff;
  --surface-2:     #eef1f6;
  --surface-sunken:#e7ecf3;
  --border:        #d6dce6;
  --border-strong: #b9c2d0;
  --text:          #16202e;
  --text-muted:    #5a6678;
  --text-faint:    #8a94a6;
  --on-brand:      #ffffff;

  /* Semantice */
  --accent:  var(--brand-500);
  --accent-strong: var(--brand-600);
  --success: #1f9d55;
  --success-bg: #e5f6ec;
  --warning: #c77700;
  --warning-bg: #fdf1dc;
  --danger:  #d13438;
  --danger-bg: #fbe6e7;
  --info:    var(--brand-500);

  /* Tipografie */
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --lh: 1.5;

  /* Spațiere (bază 4px) */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-8: 3rem;

  /* Raze & umbre */
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 18px;
  --radius-full: 999px;
  --shadow-1: 0 1px 2px rgba(16, 32, 54, 0.08), 0 1px 3px rgba(16, 32, 54, 0.06);
  --shadow-2: 0 4px 12px rgba(16, 32, 54, 0.10), 0 2px 4px rgba(16, 32, 54, 0.06);
  --shadow-3: 0 12px 32px rgba(16, 32, 54, 0.16);

  /* Ținte tactile */
  --touch: 48px;
  --touch-lg: 56px;

  /* Layout */
  --nav-h: 64px;
  --header-h: 56px;
  --content-max: 900px;
  --z-header: 40;
  --z-nav: 40;
  --z-sheet: 60;
  --z-toast: 80;

  color-scheme: light;
}

/* Tema întunecată automată */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:            #0e141d;
    --surface:       #172130;
    --surface-2:     #1e2a3b;
    --surface-sunken:#0b111a;
    --border:        #2a3648;
    --border-strong: #3c4a60;
    --text:          #e8edf5;
    --text-muted:    #9fabbd;
    --text-faint:    #6d7a8d;
    --on-brand:      #ffffff;
    --accent:  var(--brand-400);
    --accent-strong: var(--brand-300);
    --success: #3fbf74; --success-bg: #123020;
    --warning: #e2a13a; --warning-bg: #33260f;
    --danger:  #f16b6f; --danger-bg: #3a1618;
    --shadow-1: 0 1px 2px rgba(0,0,0,0.4);
    --shadow-2: 0 4px 12px rgba(0,0,0,0.45);
    --shadow-3: 0 12px 32px rgba(0,0,0,0.55);
    color-scheme: dark;
  }
}

/* Override manual — întunecat forțat (câștigă indiferent de sistem) */
:root[data-theme="dark"] {
  --bg:            #0e141d;
  --surface:       #172130;
  --surface-2:     #1e2a3b;
  --surface-sunken:#0b111a;
  --border:        #2a3648;
  --border-strong: #3c4a60;
  --text:          #e8edf5;
  --text-muted:    #9fabbd;
  --text-faint:    #6d7a8d;
  --on-brand:      #ffffff;
  --accent:  var(--brand-400);
  --accent-strong: var(--brand-300);
  --success: #3fbf74; --success-bg: #123020;
  --warning: #e2a13a; --warning-bg: #33260f;
  --danger:  #f16b6f; --danger-bg: #3a1618;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-2: 0 4px 12px rgba(0,0,0,0.45);
  --shadow-3: 0 12px 32px rgba(0,0,0,0.55);
  color-scheme: dark;
}

/* Override manual — luminos forțat */
:root[data-theme="light"] {
  color-scheme: light;
}

/* Mod mănuși — ținte mari, text mai mare, contrast crescut */
:root[data-gloves="on"] {
  --fs-sm: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.3rem;
  --touch: var(--touch-lg);
  --radius: 14px;
  --border: var(--border-strong);
}