/* AMS Germany design tokens v2.0 (Graphit/Champagner) – single source for all colour values (docs/CLAUDE-UIUX-HANDOFF.md §4). */

/* Primitives – Graphit (warm-neutral, keine Blaustufen) und Champagner */
:root{
  --ams-graphite-975:#121211;--ams-graphite-950:#171716;--ams-graphite-925:#1A1A18;--ams-graphite-900:#1E1E1C;
  --ams-graphite-850:#262624;--ams-graphite-800:#2E2E2B;--ams-graphite-750:#353531;--ams-graphite-700:#3C3C38;
  --ams-graphite-600:#55544F;--ams-graphite-550:#67665F;--ams-graphite-500:#7E7C75;--ams-graphite-450:#75736C;
  --ams-graphite-400:#A09E96;--ams-graphite-300:#C6C3BA;--ams-graphite-200:#DEDBD3;--ams-graphite-150:#E8E5DE;
  --ams-graphite-100:#EFEDE8;--ams-graphite-50:#F7F6F3;--ams-white:#FFFFFF;--ams-black:#000000;
  --ams-champagne-900:#4E3D23;--ams-champagne-800:#65502F;--ams-champagne-700:#85693F;--ams-champagne-600:#A5875A;
  --ams-champagne-500:#BE9F6B;--ams-champagne-400:#CDB07F;--ams-champagne-300:#D9C196;--ams-champagne-200:#E6D5B4;
  --ams-champagne-100:#F0E6D3;--ams-champagne-50:#F8F3EA;
  --ams-green-700:#167052;--ams-green-50:#E4F3EC;--ams-green-300:#71D5B0;
  --ams-amber-700:#7A5008;--ams-amber-50:#FBF1DC;--ams-amber-300:#F1C76C;
  --ams-red-700:#B42339;--ams-red-50:#FBE8EB;--ams-red-300:#FFA0AD;
}

/* Semantic tokens – light (default) */
:root,:root[data-theme="light"]{
  color-scheme:light;
  /* Diagramme: gesättigte Champagner-Stufe (Dataviz-Validator: Helligkeitsband, Chroma ≥ 0,10, Kontrast ≥ 3:1 auf Weiß). */
  --chart-series:#9E7A30;--chart-series-hover:#85693F;
  --surface-page:var(--ams-graphite-50);--surface-panel:var(--ams-white);
  --surface-raised:var(--ams-white);--surface-subtle:var(--ams-graphite-100);
  --surface-hover:#ECEAE4;--surface-selected:var(--ams-champagne-50);
  --surface-overlay:rgb(18 18 17 / .48);
  --text-primary:var(--ams-graphite-900);--text-secondary:var(--ams-graphite-600);
  --text-tertiary:var(--ams-graphite-550);--text-disabled:var(--ams-graphite-400);
  --text-on-primary:var(--ams-white);--text-on-gold:var(--ams-graphite-900);
  --text-link:var(--ams-champagne-800);
  --border-default:var(--ams-graphite-200);--border-strong:var(--ams-graphite-500);
  --border-focus:var(--ams-champagne-700);
  --action-primary:var(--ams-graphite-800);--action-primary-hover:var(--ams-graphite-900);
  --action-primary-pressed:var(--ams-graphite-975);
  --accent-gold:var(--ams-champagne-500);--accent-gold-subtle:var(--ams-champagne-50);
  --accent-gold-text:var(--ams-champagne-900);
  --nav-background:var(--ams-graphite-950);--nav-text:#F3F1EC;--nav-text-muted:#AEABA3;
  --nav-active:var(--ams-graphite-800);--nav-indicator:var(--ams-champagne-500);
  --status-success:var(--ams-green-700);--status-success-bg:var(--ams-green-50);
  /* Dienstplan: grün = Wochenserie, dunkelblau = einmalige Ausnahme, rot = nicht verfügbar/Feiertag. */
  --plan-series:var(--ams-green-700);--plan-series-bg:var(--ams-green-50);--plan-exception:#1F3A5F;--plan-exception-bg:#E4EAF3;--plan-unavailable:var(--ams-red-700);--plan-unavailable-bg:var(--ams-red-50);
  --status-warning:var(--ams-amber-700);--status-warning-bg:var(--ams-amber-50);
  --status-danger:var(--ams-red-700);--status-danger-bg:var(--ams-red-50);
  --status-info:var(--ams-graphite-700);--status-info-bg:var(--ams-graphite-100);
  --focus-ring:var(--ams-champagne-700);
  --shadow-1:0 1px 2px rgb(30 30 28 / .06);
  --shadow-2:0 4px 20px rgb(30 30 28 / .08);
  --shadow-3:0 12px 40px rgb(30 30 28 / .16);
  /* Calendar pairs (surface / text) are data colours chosen per employee, not part of the UI look */
  --cal-rose-bg:#F3D8DB;--cal-rose-fg:#59333C;--cal-sage-bg:#DCEBDD;--cal-sage-fg:#294D33;
  --cal-lavender-bg:#E7DFFA;--cal-lavender-fg:#473969;--cal-sand-bg:#F0E5CB;--cal-sand-fg:#5A4823;
  --cal-blue-bg:#DCE9F6;--cal-blue-fg:#2D4667;
}

/* Semantic tokens – dark */
:root[data-theme="dark"]{
  color-scheme:dark;
  --chart-series:#AA8338;--chart-series-hover:#C29A48;
  --surface-page:var(--ams-graphite-975);--surface-panel:var(--ams-graphite-925);
  --surface-raised:var(--ams-graphite-850);--surface-subtle:var(--ams-graphite-800);
  --surface-hover:var(--ams-graphite-750);--surface-selected:#2F2A21;
  --surface-overlay:rgb(0 0 0 / .6);
  --text-primary:#F3F1EC;--text-secondary:#C4C1B8;--text-tertiary:#9A978F;--text-disabled:#67655F;
  --text-on-primary:var(--ams-graphite-950);--text-on-gold:var(--ams-graphite-950);--text-link:var(--ams-champagne-300);
  --border-default:var(--ams-graphite-700);--border-strong:var(--ams-graphite-450);--border-focus:var(--ams-champagne-400);
  --action-primary:#ECE8DF;--action-primary-hover:#F6F3EC;--action-primary-pressed:#DCD7CB;
  --accent-gold:var(--ams-champagne-400);--accent-gold-subtle:#2E2A22;--accent-gold-text:var(--ams-champagne-200);
  --nav-background:#0E0E0D;--nav-active:#2B2A26;
  --status-success:var(--ams-green-300);--status-success-bg:#173B2F;
  --plan-series:var(--ams-green-300);--plan-series-bg:#173B2F;--plan-exception:#AFC4E2;--plan-exception-bg:#1B283A;--plan-unavailable:var(--ams-red-300);--plan-unavailable-bg:#41222A;
  --status-warning:var(--ams-amber-300);--status-warning-bg:#3B3020;
  --status-danger:var(--ams-red-300);--status-danger-bg:#41222A;
  --status-info:#C4C1B8;--status-info-bg:var(--ams-graphite-800);
  --focus-ring:var(--ams-champagne-400);
  --shadow-1:none;--shadow-2:0 8px 28px rgb(0 0 0 / .25);--shadow-3:0 16px 48px rgb(0 0 0 / .4);
  --cal-rose-bg:#3C2930;--cal-rose-fg:#F5D7DE;--cal-sage-bg:#213B2D;--cal-sage-fg:#D4F0DE;
  --cal-lavender-bg:#312B48;--cal-lavender-fg:#E5DBFF;--cal-sand-bg:#3D3424;--cal-sand-fg:#F5E5BC;
  --cal-blue-bg:#24364C;--cal-blue-fg:#DCEBFF;
}

/* Typography, spacing, shape, motion, layering */
:root{
  --font-sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --text-xs:12px;--text-sm:13px;--text-md:14px;--text-lg:16px;--text-xl:18px;--text-2xl:22px;--text-3xl:28px;
  --leading-tight:1.25;--leading-normal:1.5;
  --weight-regular:400;--weight-medium:500;--weight-semibold:600;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;
  --space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;
  --radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:999px;
  --control-sm:32px;--control-md:40px;--control-touch:44px;--control-lg:48px;
  /* Akzentpaletten der Buchungsseite (Werte wie onboarding_wizard.PALETTE); nur Vorschaufarben, themenunabhängig. */
  --booking-palette-graphite:#35383d;--booking-palette-champagne:#c9ad79;--booking-palette-rose:#ba7e8a;--booking-palette-sage:#819b87;--booking-palette-ocean:#427f99;--booking-palette-plum:#795578;
  --duration-fast:120ms;--duration-base:180ms;--duration-slow:240ms;
  --ease-standard:cubic-bezier(.2,0,0,1);--ease-exit:cubic-bezier(.4,0,1,1);
  --z-base:0;--z-sticky:20;--z-nav:40;--z-drawer:60;--z-dialog:70;--z-popover:80;--z-toast:90;--z-tooltip:100;
  --sidebar-expanded:224px;--sidebar-collapsed:64px;--topbar-height:56px;--bottom-nav-height:64px;
  --page-padding:24px;
}
@media (min-width:600px) and (max-width:1023.98px){:root{--page-padding:16px}}
@media (max-width:599.98px){:root{--page-padding:16px}}
@media (prefers-reduced-motion:reduce){:root{--duration-fast:0ms;--duration-base:0ms;--duration-slow:0ms}}