/* ==========================================================================
   LMS-HRM · Material Design 3 — дизайн-токены
   Тональная палитра сгенерирована из seed-цветов (OKLCH → sRGB, гамма-клампинг).
   Светлая и тёмная схемы, роли Material 3 (color / type / shape / elevation /
   motion / state layers).
   ========================================================================== */

:root {
  /* light */
  --md-sys-color-primary: #4528A4;
  --md-sys-color-on-primary: #F3EBFF;
  --md-sys-color-primary-container: #D3CAFF;
  --md-sys-color-on-primary-container: #120044;
  --md-sys-color-secondary: #44416E;
  --md-sys-color-on-secondary: #F9F9FF;
  --md-sys-color-secondary-container: #D8D8FF;
  --md-sys-color-on-secondary-container: #04001C;
  --md-sys-color-tertiary: #005B5E;
  --md-sys-color-on-tertiary: #7BFFFF;
  --md-sys-color-tertiary-container: #51FAFA;
  --md-sys-color-on-tertiary-container: #000911;
  --md-sys-color-error: #8D0005;
  --md-sys-color-on-error: #FFD0C0;
  --md-sys-color-error-container: #FFAEA0;
  --md-sys-color-on-error-container: #280000;
  --md-sys-color-background: #F7F8FF;
  --md-sys-color-on-background: #030306;
  --md-sys-color-surface: #F7F8FF;
  --md-sys-color-on-surface: #030306;
  --md-sys-color-surface-variant: #DCDCED;
  --md-sys-color-on-surface-variant: #2C2C39;
  --md-sys-color-outline: #626270;
  --md-sys-color-outline-variant: #BCBCCC;
  --md-sys-color-surface-dim: #D3D3DB;
  --md-sys-color-surface-bright: #F7F8FF;
  --md-sys-color-surface-container-lowest: #FEFEFF;
  --md-sys-color-surface-container-low: #F1F1F8;
  --md-sys-color-surface-container: #EAEAF2;
  --md-sys-color-surface-container-high: #E4E4EB;
  --md-sys-color-surface-container-highest: #DDDDE5;
  --md-sys-color-inverse-surface: #15151A;
  --md-sys-color-inverse-on-surface: #EDEEF5;
  --md-sys-color-inverse-primary: #B3A9FF;
  --md-sys-color-scrim: #000000;
  --md-sys-color-shadow: #000000;
  --md-sys-color-success: #1E6B4F;
  --md-sys-color-on-success: #FFFFFF;
  --md-sys-color-success-container: #A8F2CE;
  --md-sys-color-on-success-container: #002115;
  --md-sys-color-warning: #7A5900;
  --md-sys-color-on-warning: #FFFFFF;
  --md-sys-color-warning-container: #FFDF9B;
  --md-sys-color-on-warning-container: #261A00;
  --md-sys-color-info: #1B4B8F;
  --md-sys-color-on-info: #FFFFFF;
  --md-sys-color-info-container: #D6E3FF;
  --md-sys-color-on-info-container: #001B3D;
}

[data-theme="dark"] {
  /* dark */
  --md-sys-color-primary: #B3A9FF;
  --md-sys-color-on-primary: #1E0064;
  --md-sys-color-primary-container: #2F0084;
  --md-sys-color-on-primary-container: #D3CAFF;
  --md-sys-color-secondary: #B8B8ED;
  --md-sys-color-on-secondary: #140E36;
  --md-sys-color-secondary-container: #2B2751;
  --md-sys-color-on-secondary-container: #D8D8FF;
  --md-sys-color-tertiary: #10D8D8;
  --md-sys-color-on-tertiary: #002329;
  --md-sys-color-tertiary-container: #003F43;
  --md-sys-color-on-tertiary-container: #51FAFA;
  --md-sys-color-error: #FF8E80;
  --md-sys-color-on-error: #490000;
  --md-sys-color-error-container: #6B0000;
  --md-sys-color-on-error-container: #FFAEA0;
  --md-sys-color-background: #010102;
  --md-sys-color-on-background: #DDDDE5;
  --md-sys-color-surface: #010102;
  --md-sys-color-on-surface: #DDDDE5;
  --md-sys-color-surface-variant: #2C2C39;
  --md-sys-color-on-surface-variant: #BCBCCC;
  --md-sys-color-outline: #7E7F8D;
  --md-sys-color-outline-variant: #2C2C39;
  --md-sys-color-surface-dim: #010102;
  --md-sys-color-surface-bright: #1F1F24;
  --md-sys-color-surface-container-lowest: #000001;
  --md-sys-color-surface-container-low: #030306;
  --md-sys-color-surface-container: #050509;
  --md-sys-color-surface-container-high: #0F0F14;
  --md-sys-color-surface-container-highest: #1A1A1F;
  --md-sys-color-inverse-surface: #DDDDE5;
  --md-sys-color-inverse-on-surface: #15151A;
  --md-sys-color-inverse-primary: #4528A4;
  --md-sys-color-scrim: #000000;
  --md-sys-color-shadow: #000000;
  --md-sys-color-success: #8CD6B2;
  --md-sys-color-on-success: #003828;
  --md-sys-color-success-container: #005139;
  --md-sys-color-on-success-container: #A8F2CE;
  --md-sys-color-warning: #EFC248;
  --md-sys-color-on-warning: #412D00;
  --md-sys-color-warning-container: #5D4200;
  --md-sys-color-on-warning-container: #FFDF9B;
  --md-sys-color-info: #A9C7FF;
  --md-sys-color-on-info: #00315D;
  --md-sys-color-info-container: #00458A;
  --md-sys-color-on-info-container: #D6E3FF;
}

/* --- Форма (shape scale) ------------------------------------------------ */
:root {
  --md-sys-shape-corner-none: 0px;
  --md-sys-shape-corner-extra-small: 4px;
  --md-sys-shape-corner-small: 8px;
  --md-sys-shape-corner-medium: 12px;
  --md-sys-shape-corner-large: 16px;
  --md-sys-shape-corner-large-increased: 20px;
  --md-sys-shape-corner-extra-large: 28px;
  --md-sys-shape-corner-full: 999px;

  /* --- Типографика (Material 3 type scale) ------------------------------ */
  --md-sys-typescale-font: "Inter", "SF Pro Display", -apple-system, BlinkMacSystemFont,
    "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --md-sys-typescale-font-mono: "SF Mono", "JetBrains Mono", "Menlo", monospace;

  --md-sys-typescale-display-large-size: 3.5rem;
  --md-sys-typescale-display-large-line: 4rem;
  --md-sys-typescale-display-large-weight: 700;
  --md-sys-typescale-display-medium-size: 2.8rem;
  --md-sys-typescale-display-medium-line: 3.25rem;
  --md-sys-typescale-display-small-size: 2.25rem;
  --md-sys-typescale-display-small-line: 2.75rem;
  --md-sys-typescale-headline-large-size: 2rem;
  --md-sys-typescale-headline-large-line: 2.5rem;
  --md-sys-typescale-headline-medium-size: 1.75rem;
  --md-sys-typescale-headline-medium-line: 2.25rem;
  --md-sys-typescale-headline-small-size: 1.5rem;
  --md-sys-typescale-headline-small-line: 2rem;
  --md-sys-typescale-title-large-size: 1.375rem;
  --md-sys-typescale-title-large-line: 1.75rem;
  --md-sys-typescale-title-medium-size: 1rem;
  --md-sys-typescale-title-medium-line: 1.5rem;
  --md-sys-typescale-title-small-size: 0.875rem;
  --md-sys-typescale-title-small-line: 1.25rem;
  --md-sys-typescale-body-large-size: 1rem;
  --md-sys-typescale-body-large-line: 1.5rem;
  --md-sys-typescale-body-medium-size: 0.875rem;
  --md-sys-typescale-body-medium-line: 1.25rem;
  --md-sys-typescale-body-small-size: 0.8125rem;
  --md-sys-typescale-body-small-line: 1.125rem;
  --md-sys-typescale-label-large-size: 0.875rem;
  --md-sys-typescale-label-large-line: 1.25rem;
  --md-sys-typescale-label-medium-size: 0.75rem;
  --md-sys-typescale-label-medium-line: 1rem;
  --md-sys-typescale-label-small-size: 0.6875rem;
  --md-sys-typescale-label-small-line: 1rem;

  /* --- Движение (motion) ------------------------------------------------ */
  --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --md-sys-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
  --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
  --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
  --md-sys-motion-duration-short4: 200ms;
  --md-sys-motion-duration-medium2: 300ms;
  --md-sys-motion-duration-medium4: 400ms;
  --md-sys-motion-duration-long2: 500ms;
  --md-sys-motion-duration-extra-long2: 700ms;

  /* --- Тени (elevation) ------------------------------------------------- */
  --md-sys-elevation-0: none;
  --md-sys-elevation-1: 0 1px 2px rgba(0,0,0,.10), 0 1px 3px 1px rgba(0,0,0,.06);
  --md-sys-elevation-2: 0 1px 2px rgba(0,0,0,.10), 0 2px 6px 2px rgba(0,0,0,.08);
  --md-sys-elevation-3: 0 4px 8px 3px rgba(0,0,0,.09), 0 1px 3px rgba(0,0,0,.05);
  --md-sys-elevation-4: 0 6px 10px 4px rgba(0,0,0,.10), 0 2px 3px rgba(0,0,0,.05);
  --md-sys-elevation-5: 0 8px 12px 6px rgba(0,0,0,.11), 0 4px 4px rgba(0,0,0,.05);

  /* --- Смещение тона поверхности (surface tint) -------------------------- */
  --md-sys-surface-tint: color-mix(in oklab, var(--md-sys-color-primary) 5%, transparent);

  /* --- Семантика LMS ---------------------------------------------------- */
  --lms-radius-xs: 6px;
  --lms-radius-sm: 10px;
  --lms-radius-md: 14px;
  --lms-radius-lg: 20px;
  --lms-radius-xl: 28px;
  --lms-rail-width: 88px;
  --lms-rail-width-expanded: 264px;
  --lms-topbar-height: 68px;
  --lms-content-max: 1360px;
  --lms-gap: 16px;
  --lms-z-nav: 20;
  --lms-z-fab: 30;
  --lms-z-dialog: 60;
  --lms-z-snackbar: 80;
}

/* Тёмная тема: тени мягче, контуры чуть светлее */
[data-theme="dark"] {
  --md-sys-elevation-1: 0 1px 3px rgba(0,0,0,.5);
  --md-sys-elevation-2: 0 2px 6px rgba(0,0,0,.55);
  --md-sys-elevation-3: 0 4px 10px rgba(0,0,0,.6);
  --md-sys-elevation-4: 0 6px 14px rgba(0,0,0,.65);
  --md-sys-elevation-5: 0 10px 24px rgba(0,0,0,.7);
  --md-sys-surface-tint: color-mix(in oklab, var(--md-sys-color-primary) 12%, transparent);
}