/* =============================================================
   АйЮрист — Design Tokens (Figma Ui-kit)
   Тёмная тема: :root  |  Светлая: [data-theme="light"]
   Референс: referens/05-palitra/04-dark-theme.png, 05-light-theme.png
   ============================================================= */

:root,
[data-theme="dark"] {

  /* -----------------------------------------------------------
     ЦВЕТА — ТЁМНАЯ ТЕМА
  ----------------------------------------------------------- */

  /* Основная палитра */
  --color-accent:           #C86848;
  --color-accent-hover:     #C8775C;
  --color-accent-active:    #AD5A3E;
  --color-accent-click:     #9A5037;
  --color-accent-disabled:  #2E2D2D;

  --color-dark:             #111111;
  --color-white:            #FFFFFF;

  /* Нейтральные */
  --color-asphalt:          #1F1E1E;
  --color-graphite:         #4D4A4A;
  --color-steel:            #9A9898;
  --color-porcelain:        #F1F1F1;
  --color-satin:            #E4E3E2;
  --color-ash:              #D7D4D4;

  /* Системные */
  --color-success:          #4FA36B;
  --color-success-bg:       #1D3E18;
  --color-error:            #A34F50;
  --color-error-bg:         #3F1819;
  --color-warning:          #A38A4F;
  --color-warning-bg:       #3F3318;
  --color-info:             #4F7CA3;
  --color-info-bg:          #182D3E;
  --color-neutral:          #797979;
  --color-neutral-bg:       #2B2B2B;

  /* -----------------------------------------------------------
     СЕМАНТИЧЕСКИЕ ЦВЕТА — тёмная тема
  ----------------------------------------------------------- */

  /* Фон */
  --bg-primary:             #111111;
  --bg-secondary:           #1F1E1E;
  --bg-card:                #262626;
  --bg-hover:               #2E2D2D;
  --bg-focus:               #2E2D2D;

  /* Текст */
  --text-primary:           #FFFFFF;
  --text-secondary:         #D9D9D9;
  --text-tertiary:          #BFBFBF;
  --text-hint:              #9A9898;
  --text-inactive:          #666262;

  /* Текст на акцентном фоне (кнопки, активные табы) */
  --text-on-accent:         #FFFFFF;

  /* Границы */
  --border:                 #4D4A4A;
  --border-focus:           #666262;
  --border-light:           #333333;

  /* Интерактив */
  --interactive:            #C86848;
  --interactive-hover:      #C8775C;
  --interactive-active:     #AD5A3E;

  /* -----------------------------------------------------------
     ФИЛЬТРЫ ДЛЯ SVG-ИКОНОК (перекраска img)
     icon-accent даёт #C86848 из любого исходного цвета
  ----------------------------------------------------------- */

  --icon-white:  brightness(0) invert(1);
  --icon-accent: brightness(0) saturate(100%) invert(40%) sepia(40%) saturate(860%) hue-rotate(329deg) brightness(109%) contrast(79%);
  --icon-hint:   brightness(0) saturate(100%) invert(56%) sepia(8%) saturate(50%) hue-rotate(290deg) brightness(103%) contrast(109%);
  --icon-inactive: brightness(0) saturate(100%) invert(38%) sepia(5%) saturate(200%) hue-rotate(290deg) brightness(95%) contrast(88%);

  /* Размеры SVG-иконок (img.ui-icon) */
  --icon-size-xs:   14px;
  --icon-size-sm:   16px;
  --icon-size-md:   20px;
  --icon-size-lg:   24px;
  --icon-size-xl:   26px;
  --icon-size-empty:    48px;
  --icon-size-empty-lg: 56px;
  --icon-size-empty-xl: 80px;

  /* -----------------------------------------------------------
     ТИПОГРАФИКА
  ----------------------------------------------------------- */

  --font-ui:                'Golos Text', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-accent:            'Garamond Libre', 'Garamond', Georgia, serif;

  /* Размеры (канонические — без коллизии с --text-primary и др.) */
  --font-size-10:  10px;
  --font-size-12:  12px;
  --font-size-13:  13px;
  --font-size-14:  14px;
  --font-size-16:  16px;
  --font-size-18:  18px;
  --font-size-20:  20px;
  --font-size-24:  24px;
  --font-size-32:  32px;
  --font-size-48:  48px;

  /* Алиасы (deprecated — forms.css, обратная совместимость) */
  --text-10:  var(--font-size-10);
  --text-12:  var(--font-size-12);
  --text-13:  var(--font-size-13);
  --text-14:  var(--font-size-14);
  --text-16:  var(--font-size-16);
  --text-18:  var(--font-size-18);
  --text-20:  var(--font-size-20);
  --text-24:  var(--font-size-24);
  --text-32:  var(--font-size-32);
  --text-48:  var(--font-size-48);

  /* Начертания */
  --font-weight-regular:    400;
  --font-weight-medium:     500;
  --font-weight-semibold:   600;
  --font-weight-bold:       700;

  /* Межстрочный интервал */
  --line-height-caption:    14px;
  --line-height-body-sm:    17px;
  --line-height-tight:      1.2;
  --line-height-normal:     1.5;
  --line-height-loose:      1.7;

  /* -----------------------------------------------------------
     ОТСТУПЫ (шаг 8px)
  ----------------------------------------------------------- */

  --space-2:    2px;
  --space-4:    4px;
  --space-8:    8px;
  --space-12:   12px;
  --space-16:   16px;
  --space-24:   24px;
  --space-32:   32px;
  --space-40:   40px;
  --space-48:   48px;
  --space-56:   56px;
  --space-64:   64px;
  --space-80:   80px;
  --space-120:  120px;

  /* -----------------------------------------------------------
     СКРУГЛЕНИЯ (все кратны 2 — правило Figma)
  ----------------------------------------------------------- */

  --radius-2:    2px;
  --radius-4:    4px;
  --radius-6:    6px;
  --radius-8:    8px;
  --radius-12:   12px;
  --radius-16:   16px;
  --radius-pill: 999px;

  /* -----------------------------------------------------------
     СЕТКА
  ----------------------------------------------------------- */

  --sidebar-expanded:   260px;
  --sidebar-collapsed:  72px;

  /* -----------------------------------------------------------
     ТЕНИ
  ----------------------------------------------------------- */

  --shadow-sm:   0 1px 4px rgba(0, 0, 0, 0.4);
  --shadow-md:   0 4px 16px rgba(0, 0, 0, 0.5);
  --shadow-lg:   0 8px 32px rgba(0, 0, 0, 0.6);
  --shadow-modal: 0 16px 48px rgba(0, 0, 0, 0.7);

  /* -----------------------------------------------------------
     ПЕРЕХОДЫ
  ----------------------------------------------------------- */

  --transition-fast:    0.15s ease;
  --transition-normal:  0.2s ease;
  --transition-slow:    0.3s ease;

  /* -----------------------------------------------------------
     Z-INDEX
  ----------------------------------------------------------- */

  --z-dropdown:  1000;
  --z-modal:     10000;
  --z-overlay:   9999;
  --z-tooltip:   11000;

  /* Оверлей модалок / drag-drop */
  --overlay-bg: rgba(17, 17, 17, 0.75);
  --overlay-bg-strong: rgba(17, 17, 17, 0.9);
}

/* -----------------------------------------------------------
   СВЕТЛАЯ ТЕМА — referens/05-palitra/05-light-theme.png
   ----------------------------------------------------------- */

[data-theme="light"] {
  --color-accent-disabled:  #C9C7C5;
  --color-dark:               #666262;

  /* Фон — referens/05-palitra/05-light-theme.png «Поля» */
  --bg-primary:             #F1F1F1;
  --bg-secondary:           #FFFFFF;
  --bg-card:                #E4E3E2;
  --bg-hover:               #D7D4D4;
  --bg-focus:               #D7D4D4;

  /* Текст — «Текст» в гайдлайне светлой темы */
  --text-primary:           #666262;
  --text-secondary:         #4D4A4A;
  --text-tertiary:            #797979;
  --text-hint:                #9A9898;
  --text-inactive:            #BFBFBF;
  --text-on-accent:           #FFFFFF;

  /* Границы — «Линии и обводки»: Основная #D7D4D4, Фокус #B4B1B1 */
  --border:                   #D7D4D4;
  --border-focus:             #B4B1B1;
  --border-light:             #E4E3E2;

  /* Системные (светлые фоны) */
  --color-success-bg:         #BFDEBA;
  --color-error-bg:           #DEBABB;
  --color-warning-bg:         #DED3BA;
  --color-info-bg:            #BACEDE;
  --color-neutral-bg:         #CCCCCC;

  /* Иконки-хром: мягкий графит, не чистый чёрный */
  --icon-white:               var(--icon-inactive);

  /* Тени */
  --shadow-sm:                0 1px 4px rgba(0, 0, 0, 0.08);
  --shadow-md:                0 4px 16px rgba(0, 0, 0, 0.12);
  --shadow-lg:                0 8px 32px rgba(0, 0, 0, 0.16);
  --shadow-modal:             0 16px 48px rgba(0, 0, 0, 0.2);

  --overlay-bg:               rgba(241, 241, 241, 0.75);
  --overlay-bg-strong:        rgba(241, 241, 241, 0.9);
}