/* ==========================================================================
   ДИЗАЙН-СИСТЕМА «ЗАБОТАПЛАН» (zabotaplan.ru)
   Файл: tokens.css
   Дизайн-токены: палитра, типографика (Geologica / Piazzolla),
   масштабирование А / А+ / А++, контрастный режим WCAG AAA, ночная тема.
   Премиум-слой 62: стеклянные поверхности, мягкие глубины, токены эффектов.
   ========================================================================== */

:root {
  /* Палитра стандартного режима (проверенный контраст WCAG AAA >= 7:1) */
  --color-bg: #F8F9FA;
  --color-surface: #FFFFFF;
  --color-surface-soft: #F0F4F8;
  --color-surface-hover: #E7EEF5;
  --color-border: #CBD5E1;
  --color-border-subtle: #E2E8F0;
  
  --color-text-main: #141B25;         /* Контраст к #FFFFFF: 14.8:1 (WCAG AAA) */
  --color-text-muted: #3D4A5C;        /* Контраст к #FFFFFF: 7.3:1 (WCAG AAA) */
  --color-text-on-dark: #FFFFFF;
  
  --color-primary: #184E77;           /* Глубокий морской синий, контраст 8.1:1 (AAA) */
  --color-primary-hover: #103754;     /* Контраст к #FFFFFF: 11.8:1 (AAA) */
  --color-primary-soft: #E9F1F7;      /* Пастельная подложка */
  --color-primary-text: #0E3553;      /* Текст на пастельной подложке, контраст 8.9:1 */
  
  --color-success: #1B6437;           /* Хвойный зелёный, контраст 7.2:1 (AAA) */
  --color-success-hover: #134B29;
  --color-success-soft: #E8F5EE;
  --color-success-text: #114224;
  
  --color-warning: #874600;           /* Янтарно-охристый, контраст 7.3:1 (AAA) */
  --color-warning-hover: #673500;
  --color-warning-soft: #FEF3E6;
  --color-warning-text: #5A2E00;
  
  --color-danger: #991B1B;            /* Глубокий гранатовый, контраст 7.9:1 (AAA) */
  --color-danger-hover: #771414;
  --color-danger-soft: #FDE8E8;
  --color-danger-text: #691111;
  
  --color-accent: #B84714;            /* Тёплый терракот, контраст 5.5:1 (AA) */
  --color-accent-soft: #FDF0E9;

  /* Премиум-слой 62: стекло и глубина */
  --glass-bg: rgba(255, 255, 255, 0.88);
  --glass-bg-subtle: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(255, 255, 255, 0.65);
  --glass-border-dark: rgba(20, 27, 37, 0.08);
  --glass-blur: 16px;
  --hero-overlay: rgba(20, 27, 37, 0.18);

  /* Тени (чистые, многослойные, мягкие, без неона) */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 2px 4px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08), 0 1px 3px rgba(15, 23, 42, 0.04);
  --shadow-lg: 0 12px 28px rgba(15, 23, 42, 0.10), 0 4px 8px rgba(15, 23, 42, 0.04);
  --shadow-float: 0 20px 40px -12px rgba(15, 23, 42, 0.14), 0 8px 16px -4px rgba(15, 23, 42, 0.06);
  --shadow-focus: 0 0 0 3px rgba(24, 78, 119, 0.35);

  /* Скругления (мягкие, доступные) */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Шрифтовые гарнитуры: Geologica / Piazzolla */
  --font-heading: 'Piazzolla', serif;
  --font-body: 'Geologica', sans-serif;
  --font-brand: 'Piazzolla', serif;

  /* Базовая шкала размеров шрифта (стандарт) */
  --font-xs: 13px;
  --font-sm: 15px;
  --font-base: 17px;
  --font-md: 19px;
  --font-lg: 22px;
  --font-xl: 28px;
  --font-2xl: 36px;
  --font-3xl: 44px;

  /* Геометрия доступности (WCAG 2.2 и ГОСТ Р 52872 для пользователей 60+) */
  --button-min-height: 48px;
  --button-senior-height: 60px;
  --touch-target-min: 44px;
  --header-height: 72px;
  --content-max-width: 1320px;
  
  --focus-ring: 3px solid #184E77;
  --focus-offset: 3px;
  --transition-fast: 0.18s ease;
  --transition-normal: 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

/* --------------------------------------------------------------------------
   Масштабирование шрифта: А / А+ / А++ для комфорта пожилых людей
   -------------------------------------------------------------------------- */

[data-font-size="a"] {
  --font-xs: 14px;
  --font-sm: 16px;
  --font-base: 18px;
  --font-md: 21px;
  --font-lg: 25px;
  --font-xl: 32px;
  --font-2xl: 40px;
  --font-3xl: 48px;
  --button-min-height: 52px;
  --button-senior-height: 66px;
}

[data-font-size="a-plus"] {
  --font-xs: 16px;
  --font-sm: 18px;
  --font-base: 21px;
  --font-md: 24px;
  --font-lg: 29px;
  --font-xl: 36px;
  --font-2xl: 46px;
  --font-3xl: 54px;
  --button-min-height: 58px;
  --button-senior-height: 72px;
}

[data-font-size="a-plus-plus"] {
  --font-xs: 18px;
  --font-sm: 21px;
  --font-base: 24px;
  --font-md: 28px;
  --font-lg: 34px;
  --font-xl: 42px;
  --font-2xl: 52px;
  --font-3xl: 62px;
  --button-min-height: 64px;
  --button-senior-height: 80px;
}

/* --------------------------------------------------------------------------
   Режим высокой контрастности: WCAG 2.2 AAA (максимальная чёткость)
   -------------------------------------------------------------------------- */

[data-contrast="high"] {
  --color-bg: #FFFFFF;
  --color-surface: #FFFFFF;
  --color-surface-soft: #F1F4F8;
  --color-surface-hover: #E2E8F0;
  --color-border: #000000;
  --color-border-subtle: #2D3748;
  
  --color-text-main: #000000;         /* Контраст к фону 21:1 */
  --color-text-muted: #111111;        /* Контраст к фону 18:1 */
  --color-text-on-dark: #FFFFFF;
  
  --color-primary: #002D62;           /* Контраст к белому 13.2:1 */
  --color-primary-hover: #001A3A;
  --color-primary-soft: #E4EFFB;
  --color-primary-text: #001A3A;
  
  --color-success: #0C4D26;           /* Контраст 10.4:1 */
  --color-success-hover: #073319;
  --color-success-soft: #E0F2E8;
  --color-success-text: #073319;
  
  --color-warning: #6E3800;           /* Контраст 9.1:1 */
  --color-warning-hover: #4A2600;
  --color-warning-soft: #FFF0DE;
  --color-warning-text: #4A2600;
  
  --color-danger: #800A0A;            /* Контраст 9.8:1 */
  --color-danger-hover: #580606;
  --color-danger-soft: #FDE2E2;
  --color-danger-text: #580606;

  --glass-bg: #FFFFFF;
  --glass-bg-subtle: #FFFFFF;
  --glass-border: #000000;
  --glass-border-dark: #000000;
  --glass-blur: 0px;

  --focus-ring: 4px solid #000000;
  --focus-offset: 4px;
  --shadow-sm: none;
  --shadow-md: 0 0 0 2px #000000;
  --shadow-lg: 0 0 0 3px #000000;
  --shadow-float: 0 0 0 3px #000000;
}

/* --------------------------------------------------------------------------
   Ночной режим (для вечернего дежурства координатора и режима 60+)
   -------------------------------------------------------------------------- */

[data-theme="night"] {
  --color-bg: #0D141E;
  --color-surface: #15202E;
  --color-surface-soft: #1D2A3D;
  --color-surface-hover: #26374E;
  --color-border: #324560;
  --color-border-subtle: #253347;
  
  --color-text-main: #F3F6FA;         /* Контраст к #15202E: 13.8:1 */
  --color-text-muted: #B4C4D8;        /* Контраст к #15202E: 8.2:1 */
  --color-text-on-dark: #FFFFFF;
  
  --color-primary: #4DA2E0;           /* Контраст к #15202E: 7.1:1 */
  --color-primary-hover: #69B3E8;
  --color-primary-soft: #17324B;
  --color-primary-text: #DCEDFB;
  
  --color-success: #38A169;
  --color-success-hover: #48BB78;
  --color-success-soft: #143525;
  --color-success-text: #D2F4E2;
  
  --color-warning: #DD8622;
  --color-warning-hover: #ED9A38;
  --color-warning-soft: #382410;
  --color-warning-text: #FFE8CC;
  
  --color-danger: #E55353;
  --color-danger-hover: #ED6B6B;
  --color-danger-soft: #3D1818;
  --color-danger-text: #FED7D7;

  --glass-bg: rgba(21, 32, 46, 0.88);
  --glass-bg-subtle: rgba(21, 32, 46, 0.72);
  --glass-border: rgba(255, 255, 255, 0.12);
  --glass-border-dark: rgba(0, 0, 0, 0.35);
  --hero-overlay: rgba(13, 20, 30, 0.35);

  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.65);
  --shadow-float: 0 20px 40px -12px rgba(0, 0, 0, 0.75);
  --focus-ring: 3px solid #69B3E8;
}

/* --------------------------------------------------------------------------
   Высокая контрастность в ночном режиме: WCAG 2.2 AAA на чёрном фоне.
   Идёт после ночного блока, иначе его переменные перебивают контраст.
   -------------------------------------------------------------------------- */

[data-theme="night"][data-contrast="high"] {
  --color-bg: #000000;
  --color-surface: #000000;
  --color-surface-soft: #121212;
  --color-surface-hover: #262626;
  --color-border: #FFFFFF;
  --color-border-subtle: #BFBFBF;     /* Контраст к фону 11.4:1 */

  --color-text-main: #FFFFFF;         /* Контраст к фону 21:1 */
  --color-text-muted: #EDEDED;        /* Контраст к #121212: 16:1 */
  --color-text-on-dark: #000000;      /* Кнопки светлые: чёрный текст, от 10.3:1 */

  --color-primary: #8CCBFF;           /* Контраст к фону 12.1:1 */
  --color-primary-hover: #B8DFFF;
  --color-primary-soft: #0A2540;
  --color-primary-text: #CFE8FF;      /* Контраст к primary-soft 12.3:1 */

  --color-success: #5EE59A;           /* Контраст 13.2:1 */
  --color-success-hover: #8AF0B7;
  --color-success-soft: #0B2E1B;
  --color-success-text: #C9F7DD;

  --color-warning: #FFC266;           /* Контраст 13.2:1 */
  --color-warning-hover: #FFD699;
  --color-warning-soft: #3A2600;
  --color-warning-text: #FFE4B8;

  --color-danger: #FF9A9A;            /* Контраст 10.3:1 */
  --color-danger-hover: #FFBDBD;
  --color-danger-soft: #3D0A0A;
  --color-danger-text: #FFD6D6;

  --glass-bg: #000000;
  --glass-bg-subtle: #000000;
  --glass-border: #FFFFFF;
  --glass-border-dark: #FFFFFF;
  --glass-blur: 0px;
  --hero-overlay: rgba(0, 0, 0, 0.6);

  --focus-ring: 4px solid #FFFFFF;
  --focus-offset: 4px;
  --shadow-sm: none;
  --shadow-md: 0 0 0 2px #FFFFFF;
  --shadow-lg: 0 0 0 3px #FFFFFF;
  --shadow-float: 0 0 0 3px #FFFFFF;
}
