/* ------------------------------------------------------------------
 * Talentum – Design-Tokens.
 *
 * AUTOMATISCH ERZEUGT von tools/talentum/generate-tokens.mjs aus
 * Tokens/talentum.tokens.json. Nicht von Hand bearbeiten – Änderungen
 * gehören in die JSON-Quelle, danach den Generator laufen lassen.
 *
 * Hell liegt auf :root. Dunkel greift zweimal: explizit über
 * :root[data-theme="dark"] (Umschalter) und implizit über die
 * Systemeinstellung, solange nicht ausdrücklich Hell gewählt wurde.
 * ------------------------------------------------------------------ */

:root {
  color-scheme: light dark;
  --surface-000: #f3f6fb;
  --surface-100: #ffffff;
  --surface-200: #ebeff7;
  --surface-300: #dde4f0;
  --border-100: #dbe2ee;
  --border-200: #7c8598;
  --ink-900: #101720;
  --ink-700: #46525f;
  --ink-500: #626e7d;
  --on-accent: #ffffff;
  --scrim: rgba(16, 23, 32, 0.45);
  --accent-100: #e8f0fc;
  --accent-500: #2563c7;
  --accent-600: #1d4f9f;
  --accent-text: #1b4b97;
  --accent2-500: #0e7c7b;
  --focus-ring: #2563c7;
  --danger-500: #b3261e;
  --danger-600: #8f1d17;
  --state-new-bg: #eef1f6;
  --state-new-ink: #45505e;
  --state-review-bg: #fff4e0;
  --state-review-ink: #8a5a08;
  --state-interview-bg: #e6f0fd;
  --state-interview-ink: #1b4b97;
  --state-offer-bg: #e6f4ec;
  --state-offer-ink: #1c6b41;
  --state-rejected-bg: #fbe9e9;
  --state-rejected-ink: #a02626;
  --hue-blue-bg: #e4edfd;
  --hue-blue-ink: #1b4b97;
  --hue-teal-bg: #d9f0ee;
  --hue-teal-ink: #0b5f5e;
  --hue-violet-bg: #ece4fb;
  --hue-violet-ink: #56349f;
  --hue-amber-bg: #fceed6;
  --hue-amber-ink: #85570a;
  --hue-green-bg: #ddf1e6;
  --hue-green-ink: #1a6b45;
  --shadow-card: 0 1px 2px rgba(16, 23, 32, 0.06), 0 1px 3px rgba(16, 23, 32, 0.08);
  --shadow-overlay: 0 8px 24px rgba(16, 23, 32, 0.14);
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;
  --layer-raised: 3;
  --layer-sticky: 30;
  --layer-nav-scrim: 40;
  --layer-nav: 45;
  --layer-dropdown: 50;
  --layer-tooltip: 60;
  --layer-popup: 1050;
  --layer-toast: 2000;
  --layer-system: 2100;
}

:root[data-theme="dark"] {
  --surface-000: #0f1216;
  --surface-100: #191d22;
  --surface-200: #222730;
  --surface-300: #2a303a;
  --border-100: #2f3641;
  --border-200: #6d7583;
  --ink-900: #f1f4f9;
  --ink-700: #b4bfcc;
  --ink-500: #8994a3;
  --on-accent: #0b0e11;
  --scrim: rgba(0, 0, 0, 0.62);
  --accent-100: #16263d;
  --accent-500: #4b8ff5;
  --accent-600: #6aa6ff;
  --accent-text: #9dc4ff;
  --accent2-500: #46c0bb;
  --focus-ring: #6aa6ff;
  --danger-500: #e88b8b;
  --danger-600: #f0a5a5;
  --state-new-bg: #23282f;
  --state-new-ink: #c2cbd5;
  --state-review-bg: #3a2e18;
  --state-review-ink: #f0c274;
  --state-interview-bg: #16263d;
  --state-interview-ink: #9dc4ff;
  --state-offer-bg: #142a1e;
  --state-offer-ink: #86d7a9;
  --state-rejected-bg: #34191b;
  --state-rejected-ink: #f2a3a3;
  --hue-blue-bg: #16263d;
  --hue-blue-ink: #9dc4ff;
  --hue-teal-bg: #0f2b2c;
  --hue-teal-ink: #7fd8d3;
  --hue-violet-bg: #241a3d;
  --hue-violet-ink: #c3aefc;
  --hue-amber-bg: #33280f;
  --hue-amber-ink: #f0c274;
  --hue-green-bg: #142a1e;
  --hue-green-ink: #86d7a9;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.55);
  --shadow-overlay: 0 8px 24px rgba(0, 0, 0, 0.7);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --surface-000: #0f1216;
    --surface-100: #191d22;
    --surface-200: #222730;
    --surface-300: #2a303a;
    --border-100: #2f3641;
    --border-200: #6d7583;
    --ink-900: #f1f4f9;
    --ink-700: #b4bfcc;
    --ink-500: #8994a3;
    --on-accent: #0b0e11;
    --scrim: rgba(0, 0, 0, 0.62);
    --accent-100: #16263d;
    --accent-500: #4b8ff5;
    --accent-600: #6aa6ff;
    --accent-text: #9dc4ff;
    --accent2-500: #46c0bb;
    --focus-ring: #6aa6ff;
    --danger-500: #e88b8b;
    --danger-600: #f0a5a5;
    --state-new-bg: #23282f;
    --state-new-ink: #c2cbd5;
    --state-review-bg: #3a2e18;
    --state-review-ink: #f0c274;
    --state-interview-bg: #16263d;
    --state-interview-ink: #9dc4ff;
    --state-offer-bg: #142a1e;
    --state-offer-ink: #86d7a9;
    --state-rejected-bg: #34191b;
    --state-rejected-ink: #f2a3a3;
    --hue-blue-bg: #16263d;
    --hue-blue-ink: #9dc4ff;
    --hue-teal-bg: #0f2b2c;
    --hue-teal-ink: #7fd8d3;
    --hue-violet-bg: #241a3d;
    --hue-violet-ink: #c3aefc;
    --hue-amber-bg: #33280f;
    --hue-amber-ink: #f0c274;
    --hue-green-bg: #142a1e;
    --hue-green-ink: #86d7a9;
    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.55);
    --shadow-overlay: 0 8px 24px rgba(0, 0, 0, 0.7);
  }
}

/* Textstile – dieselben Klassennamen wie im Talentum-Referenzbundle. */
.display-lg {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 38px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.display-md {
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.heading-sm {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 24px;
  font-weight: 600;
}
.body {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 22px;
  font-weight: 400;
}
.body-strong {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
}
.body-sm {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}
.label {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.caption {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
}
.mono-sm {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}