/* Talenty design tokens. Light = :root, Dark = html.dark.
   Values are RGB triplets so Tailwind's rgb(var(--x) / <alpha-value>) works. */

html, body {
    background-color: rgb(var(--surface-muted));
    color: rgb(var(--text-primary));
}


:root {
  /* Surfaces */
  --surface:         255 255 255;
  --surface-muted:   249 250 251;
  --surface-raised:  255 255 255;
  --surface-sunken:  243 244 246;
  --surface-overlay: 255 255 255;

  /* Borders */
  --border-default: 229 231 235;
  --border-strong:  209 213 219;

  /* Text */
  --text-primary:   17 24 39;
  --text-secondary: 75 85 99;
  --text-muted:     107 114 128;

  /* Brand — warm (yellow/amber/orange family) */
  --brand-warm-soft:   254 243 199;
  --brand-warm:        245 158 11;
  --brand-warm-strong: 180 83  9;

  /* Brand — cool v2 (purple/violet family) */
  --brand-cool-soft:   243 232 255;
  --brand-cool:        147 51  234;
  --brand-cool-strong: 107 33  168;

  /* Brand — rose accent (pink/rose family) */
  --brand-rose-soft: 252 231 243;
  --brand-rose:      236 72  153;

  /* Focus ring */
  --focus-ring: 59 130 246;

  /* Score-bar gradient (talent match scores). Light pastels paired with dark text. */
  --score-bar-1: 220 252 231;  /* #dcfce7 green-100 */
  --score-bar-2: 134 239 172;  /* #86efac green-300 */
  --score-bar-3: 74  222 128;  /* #4ade80 green-400 */
}

html.dark {
  --surface:         15 23  42;   /* slate-900 */
  --surface-muted:   2  6   23;   /* slate-950 */
  --surface-raised:  30 41  59;   /* slate-800 */
  --surface-sunken:  2  6   23;
  --surface-overlay: 30 41  59;

  --border-default: 51 65 85;     /* slate-700 */
  --border-strong:  71 85 105;    /* slate-600 */

  --text-primary:   243 244 246;
  --text-secondary: 156 163 175;
  --text-muted:     107 114 128;

  --brand-warm-soft:   69  26  3;
  --brand-warm:        251 191 36;
  --brand-warm-strong: 252 211 77;

  --brand-cool-soft:   59  7   100;
  --brand-cool:        168 85  247;   /* purple-500, was purple-400 (too bright) */
  --brand-cool-strong: 192 132 252;   /* purple-400, was purple-300 (too bright) */

  --brand-rose-soft: 80  7   36;
  --brand-rose:      244 114 182;

  --focus-ring: 96 165 250;

  /* Darker greens so text-text-primary (near-white in dark mode) stays readable. */
  --score-bar-1: 20  83  45;   /* #14532d green-900 */
  --score-bar-2: 21  128 61;   /* #15803d green-700 */
  --score-bar-3: 22  163 74;   /* #16a34a green-600 */

  color-scheme: dark;
}