/* root.css === CSS-ПЕРЕМЕННЫЕ ДЛЯ СВЕТЛОЙ ТЕМЫ === */

:root {
  /* Основные цвета интерфейса */
  --bg: #f8f4ee; /* Стильный */  
  --bg-primary: #f8f9fa; /* Основной фон */
  --bg-secondary: #ffffff; /* Вторичный фон */
  --text-primary: #212529; /* Основной текст */
  --text-secondary: #6c757d; /* Вторичный текст */
  --border-color: #dee2e6; /* Цвет границ */
  --border-primary: #dee2e6; /* Цвет границ */
  --border-secondary: #BDC0C3; /* Цвет границ */
  --shadow: 0 2px 5px rgba(0,0,0,0.1); /* Тени элементов */


/*
#000000
#171717
#2E2E2E
#454545
#5C5C5C
#737373
#8A8A8A
#A1A1A1
#B8B8B8
#CFCFCF
#E6E6E6
#FFFFFF
*/



  /* Шкала серых для сегментов (0-9) - светлее оригинала */
  --OLD-bg-0: #858585;  /* (самый тёмный) */
  --OLD-bg-1: #919191;  /* */
  --OLD-bg-2: #9D9D9D;  /* */
  --OLD-bg-3: #AAAAAA;  /* */
  --OLD-bg-4: #B6B6B6;  /* */
  --OLD-bg-5: #C2C2C2;  /* */
  --OLD-bg-6: #CECECE;  /* */
  --OLD-bg-7: #DADADA;  /* */
  --OLD-bg-8: #E6E6E6;  /* */
  --OLD-bg-9: #F2F2F2;  /* (самый светлый) */

  /* Шкала серых для сегментов (0-9) - светлее оригинала */
  --bg-0: #2E2E2E;  /* (самый тёмный) */
  --bg-1: #454545;  /* */
  --bg-2: #5C5C5C;  /* */
  --bg-3: #737373;  /* */
  --bg-4: #8A8A8A;  /* */
  --bg-5: #A1A1A1;  /* */
  --bg-6: #B8B8B8;  /* */
  --bg-7: #CFCFCF;  /* */
  --bg-8: #E6E6E6;  /* */
  --bg-9: #FFFFFF;  /* (самый светлый) */
  
  --gr-3: linear-gradient(to right, #FFF, #444); /* Горизонтальный градиент от тёмного к светлому */

  --gr: linear-gradient(90deg, #EEE 0%, #333 100%);


  /* Стили форм */
  --form-control-bg: #ffffff; /* Фон полей ввода */
  --form-control-border: #ced4da; /* Границы полей */
  --form-control-tx: #212529; /* Текст в полях */
  --form-control-placeholder: #6c757d; /* Плейсхолдеры */


  /* ===== КНОПКА "ДА" / "ПОДТВЕРДИТЬ" (Light) ===== */
  --btn-yes: #2ecc71; /* Яркий зелёный - ассоциация с положительным ответом, успехом */
  --btn-yes-hover: #27ae60; /* Наведение - тёмно-зелёный, уверенное подтверждение */
  --btn-yes-active: #219653; /* Нажатие - глубокий зелёный, окончательное решение */
  --btn-yes-focus: #2ecc71; /* Фокус - основной зелёный */
  --btn-yes-disabled: #a8e6c3; /* Отключённое - пастельный зелёный */
  --btn-yes-text: #ffffff; /* Белый текст для контраста на зелёном */
  --btn-yes-text-hover: #ffffff;
  --btn-yes-text-active: #ffffff;
  --btn-yes-text-focus: #ffffff;
  --btn-yes-text-disabled: #6b9c82;
  
  /* ===== КНОПКА "НЕТ" / "ОТКЛОНИТЬ" (Light) ===== */
  --btn-no: #e74c3c; /* Ярко-красный - явный отказ, отрицание */
  --btn-no-hover: #c0392b; /* Наведение - тёмно-красный, серьёзный отказ */
  --btn-no-active: #a93226; /* Нажатие - глубокий красный, окончательное "нет" */
  --btn-no-focus: #e74c3c; /* Фокус - основной красный */
  --btn-no-disabled: #f5b7b1; /* Отключённое - пастельный красный */
  --btn-no-text: #ffffff; /* Белый текст для контраста на красном */
  --btn-no-text-hover: #ffffff;
  --btn-no-text-active: #ffffff;
  --btn-no-text-focus: #ffffff;
  --btn-no-text-disabled: #b03a2e;
  
  /* ===== КНОПКА "ОТМЕНА" (Light) ===== */
  --btn-cancel: #95a5a6; /* Нейтральный серый - нейтральное действие без последствий */
  --btn-cancel-hover: #7f8c8d; /* Наведение - тёмно-серый */
  --btn-cancel-active: #6c7b7d; /* Нажатие - глубокий серый */
  --btn-cancel-focus: #95a5a6; /* Фокус - основной серый */
  --btn-cancel-disabled: #d5dbdb; /* Отключённое - светлый серый */
  --btn-cancel-text: #ffffff; /* Белый текст для контраста на сером */
  --btn-cancel-text-hover: #ffffff;
  --btn-cancel-text-active: #ffffff;
  --btn-cancel-text-focus: #ffffff;
  --btn-cancel-text-disabled: #7b8a8b;
  
  /* ===== КНОПКА "ВКЛ" / "АКТИВИРОВАТЬ" (Light) ===== */
  --btn-on: #3498db; /* Синий - ассоциация с активным состоянием, включением */
  --btn-on-hover: #2980b9; /* Наведение - тёмно-синий */
  --btn-on-active: #216895; /* Нажатие - глубокий синий */
  --btn-on-focus: #3498db; /* Фокус - основной синий */
  --btn-on-disabled: #aed6f1; /* Отключённое - пастельный синий */
  --btn-on-text: #ffffff; /* Белый текст для контраста на синем */
  --btn-on-text-hover: #ffffff;
  --btn-on-text-active: #ffffff;
  --btn-on-text-focus: #ffffff;
  --btn-on-text-disabled: #5d8cb3;
  
  /* ===== КНОПКА "ОК" / "ГОТОВО" (Light) ===== */
  --btn-ok: #9b59b6; /* Фиолетовый - универсальное подтверждение, завершение */
  --btn-ok-hover: #8e44ad; /* Наведение - тёмно-фиолетовый */
  --btn-ok-active: #7d3c98; /* Нажатие - глубокий фиолетовый */
  --btn-ok-focus: #9b59b6; /* Фокус - основной фиолетовый */
  --btn-ok-disabled: #d2b4de; /* Отключённое - пастельный фиолетовый */
  --btn-ok-text: #ffffff; /* Белый текст для контраста на фиолетовом */
  --btn-ok-text-hover: #ffffff;
  --btn-ok-text-active: #ffffff;
  --btn-ok-text-focus: #ffffff;
  --btn-ok-text-disabled: #7d659c;
  
  /* ===== ОСНОВНАЯ КНОПКА (СИНЯЯ) ===== */
  --btn-primary: #4D6BFE; /* Основная кнопка - насыщенный синий для главных действий */
  --btn-primary-hover: #3a56d4; /* Состояние наведения - темнее на 10-15% */
  --btn-primary-active: #2d46b0; /* Состояние нажатия - ещё темнее для эффекта "утопления" */
  --btn-primary-focus: #4D6BFE; /* Состояние фокуса - совпадает с основным цветом */
  --btn-primary-disabled: #b0baf8; /* Отключенное состояние - бледно-синий с 40% прозрачности */
  --btn-primary-text: #ffffff; /* Текст кнопки по умолчанию */
  --btn-primary-text-hover: #ffffff; /* Текст при наведении (не меняется) */
  --btn-primary-text-active: #ffffff; /* Текст при нажатии */
  --btn-primary-text-focus: #ffffff; /* Текст при фокусе */
  --btn-primary-text-disabled: #6b7280; /* Текст отключенной кнопки - нейтрально-серый */
  
  /* ===== ВТОРИЧНАЯ КНОПКА (СЕРАЯ) ===== */
  --btn-secondary: #6c757d; /* Вторичная кнопка - нейтральный серый для второстепенных действий */
  --btn-secondary-hover: #5a6268; /* Наведение - на тон темнее */
  --btn-secondary-active: #4a5056; /* Нажатие - ещё темнее */
  --btn-secondary-focus: #6c757d; /* Фокус */
  --btn-secondary-disabled: #c8cccf; /* Отключенное состояние */
  --btn-secondary-text: #ffffff; /* Белый текст для контраста на сером фоне */
  --btn-secondary-text-hover: #ffffff; /* При наведении текст белый */
  --btn-secondary-text-active: #ffffff; /* При нажатии текст белый */
  --btn-secondary-text-focus: #ffffff; /* При фокусе текст белый */
  --btn-secondary-text-disabled: #8a9197; /* Серый текст для отключенного состояния */
  
  /* ===== КНОПКА УСПЕХА (ЗЕЛЁНАЯ) ===== */
  --btn-success: #4E7444; /* Успешное действие - натуральный зелёный для подтверждений */
  --btn-success-hover: #55824A; /* Наведение - чуть светлее и насыщеннее */
  --btn-success-active: #3f6635; /* Нажатие - темнее */
  --btn-success-focus: #4E7444; /* Фокус */
  --btn-success-disabled: #a8c1a3; /* Отключенное состояние */
  --btn-success-text: #ffffff; /* Текст по умолчанию */
  --btn-success-text-hover: #ffffff; /* При наведении */
  --btn-success-text-active: #ffffff; /* При нажатии */
  --btn-success-text-focus: #ffffff; /* При фокусе */
  --btn-success-text-disabled: #6b7a67; /* Серо-зелёный текст для отключенного */
  
  /* ===== КНОПКА ОПАСНОСТИ (КРАСНАЯ) ===== */
  --btn-danger: #dc3545; /* Опасное действие - ярко-красный для удаления, отмены */
  --btn-danger-hover: #c82333; /* Наведение - темнее */
  --btn-danger-active: #a71e2c; /* Нажатие - ещё темнее */
  --btn-danger-focus: #dc3545; /* Фокус */
  --btn-danger-disabled: #f0a7af; /* Отключенное состояние */
  --btn-danger-text: #ffffff; /* Текст по умолчанию */
  --btn-danger-text-hover: #ffffff; /* При наведении */
  --btn-danger-text-active: #ffffff; /* При нажатии */
  --btn-danger-text-focus: #ffffff; /* При фокусе */
  --btn-danger-text-disabled: #8f4a52; /* Приглушённый красный текст */
  
  /* ===== КНОПКА ПРЕДУПРЕЖДЕНИЯ (ЖЁЛТАЯ) ===== */
  --btn-warning: #ffc107; /* Предупреждение - золотисто-жёлтый для осторожных действий */
  --btn-warning-hover: #e0a800; /* Наведение - тёмно-золотой */
  --btn-warning-active: #c69500; /* Нажатие - ещё темнее */
  --btn-warning-focus: #ffc107; /* Фокус */
  --btn-warning-disabled: #ffeaa0; /* Отключенное состояние - пастельный жёлтый */
  --btn-warning-text: #212529; /* Тёмный текст для контраста на светлом фоне */
  --btn-warning-text-hover: #212529; /* При наведении текст тёмный */
  --btn-warning-text-active: #212529; /* При нажатии текст тёмный */
  --btn-warning-text-focus: #212529; /* При фокусе текст тёмный */
  --btn-warning-text-disabled: #8a7b4a; /* Тёмно-серый с желтоватым оттенком */
  
  /* ===== КНОПКА ИНФОРМАЦИИ (ГОЛУБАЯ) ===== */
  --btn-info: #17a2b8; /* Информация - бирюзово-голубой для справки, деталей */
  --btn-info-hover: #138496; /* Наведение - темнее */
  --btn-info-active: #106874; /* Нажатие - ещё темнее */
  --btn-info-focus: #17a2b8; /* Фокус */
  --btn-info-disabled: #8ad2e0; /* Отключенное состояние */
  --btn-info-text: #ffffff; /* Текст по умолчанию */
  --btn-info-text-hover: #ffffff; /* При наведении */
  --btn-info-text-active: #ffffff; /* При нажатии */
  --btn-info-text-focus: #ffffff; /* При фокусе */
  --btn-info-text-disabled: #5b7980; /* Серо-голубой текст */
  
  /* ===== ФИОЛЕТОВАЯ КНОПКА (АКЦЕНТ) ===== */
  --btn-purple: #6f42c1; /* Фиолетовая - для премиум функций, акцентов */
  --btn-purple-hover: #5a32a3; /* Наведение */
  --btn-purple-active: #4a2985; /* Нажатие */
  --btn-purple-focus: #6f42c1; /* Фокус */
  --btn-purple-disabled: #b8a4e3; /* Отключенное состояние */
  --btn-purple-text: #ffffff; /* Текст по умолчанию */
  --btn-purple-text-hover: #ffffff; /* При наведении */
  --btn-purple-text-active: #ffffff; /* При нажатии */
  --btn-purple-text-focus: #ffffff; /* При фокусе */
  --btn-purple-text-disabled: #7a6b9e; /* Серо-фиолетовый текст */
  
  /* ===== ОРАНЖЕВАЯ КНОПКА (ДЕЙСТВИЯ) ===== */
  --btn-orange: #fd7e14; /* Оранжевая - для призыва к действию, хот-действий */
  --btn-orange-hover: #dc6e10; /* Наведение */
  --btn-orange-active: #b85c0d; /* Нажатие */
  --btn-orange-focus: #fd7e14; /* Фокус */
  --btn-orange-disabled: #fec290; /* Отключенное состояние */
  --btn-orange-text: #212529; /* Тёмный текст для контраста */
  --btn-orange-text-hover: #212529; /* При наведении */
  --btn-orange-text-active: #212529; /* При нажатии */
  --btn-orange-text-focus: #212529; /* При фокусе */
  --btn-orange-text-disabled: #8a6e4a; /* Тёмно-серый с оранжевым оттенком */
  
  /* ===== РОЗОВАЯ КНОПКА (МАРКЕТИНГ) ===== */
  --btn-pink: #e83e8c; /* Розовая - для маркетинговых акций, скидок */
  --btn-pink-hover: #d01d6b; /* Наведение */
  --btn-pink-active: #a81856; /* Нажатие */
  --btn-pink-focus: #e83e8c; /* Фокус */
  --btn-pink-disabled: #f5a6cd; /* Отключенное состояние */
  --btn-pink-text: #ffffff; /* Текст по умолчанию */
  --btn-pink-text-hover: #ffffff; /* При наведении */
  --btn-pink-text-active: #ffffff; /* При нажатии */
  --btn-pink-text-focus: #ffffff; /* При фокусе */
  --btn-pink-text-disabled: #8a4a66; /* Серо-розовый текст */
  
  /* ===== БИРЮЗОВАЯ КНОПКА (СВЕЖИЙ АКЦЕНТ) ===== */
  --btn-teal: #20c997; /* Бирюзовая - современный акцент, свежие функции */
  --btn-teal-hover: #199d76; /* Наведение */
  --btn-teal-active: #147d5e; /* Нажатие */
  --btn-teal-focus: #20c997; /* Фокус */
  --btn-teal-disabled: #90e5ce; /* Отключенное состояние */
  --btn-teal-text: #ffffff; /* Текст по умолчанию */
  --btn-teal-text-hover: #ffffff; /* При наведении */
  --btn-teal-text-active: #ffffff; /* При нажатии */
  --btn-teal-text-focus: #ffffff; /* При фокусе */
  --btn-teal-text-disabled: #5a8074; /* Серо-бирюзовый текст */
  
  /* ===== ИНДИГО КНОПКА (ПРОФЕССИОНАЛЬНАЯ) ===== */
  --btn-indigo: #6610f2; /* Индиго - профессиональный вид, IT-функции */
  --btn-indigo-hover: #520dc2; /* Наведение */
  --btn-indigo-active: #430aa5; /* Нажатие */
  --btn-indigo-focus: #6610f2; /* Фокус */
  --btn-indigo-disabled: #b388f9; /* Отключенное состояние */
  --btn-indigo-text: #ffffff; /* Текст по умолчанию */
  --btn-indigo-text-hover: #ffffff; /* При наведении */
  --btn-indigo-text-active: #ffffff; /* При нажатии */
  --btn-indigo-text-focus: #ffffff; /* При фокусе */
  --btn-indigo-text-disabled: #7a6b9e; /* Серо-фиолетовый текст */
  
  /* ===== ЛАЙМОВАЯ КНОПКА (ЯРКИЙ АКЦЕНТ) ===== */
  --btn-lime: #d4ed12; /* Лаймовая - яркий акцент, внимание, новые функции */
  --btn-lime-hover: #b8d00b; /* Наведение */
  --btn-lime-active: #9cb309; /* Нажатие */
  --btn-lime-focus: #d4ed12; /* Фокус */
  --btn-lime-disabled: #eff7a0; /* Отключенное состояние */
  --btn-lime-text: #212529; /* Тёмный текст для контраста */
  --btn-lime-text-hover: #212529; /* При наведении */
  --btn-lime-text-active: #212529; /* При нажатии */
  --btn-lime-text-focus: #212529; /* При фокусе */
  --btn-lime-text-disabled: #8a8a6b; /* Тёмно-серый с зеленоватым оттенком */
  
  /* ===== БОРДОВАЯ КНОПКА (VIP-ФУНКЦИИ) ===== */
  --btn-maroon: #7b0a1a; /* Бордовая - эксклюзивные, VIP, административные функции */
  --btn-maroon-hover: #5c0713; /* Наведение */
  --btn-maroon-active: #45050e; /* Нажатие */
  --btn-maroon-focus: #7b0a1a; /* Фокус */
  --btn-maroon-disabled: #c28d95; /* Отключенное состояние */
  --btn-maroon-text: #ffffff; /* Текст по умолчанию */
  --btn-maroon-text-hover: #ffffff; /* При наведении */
  --btn-maroon-text-active: #ffffff; /* При нажатии */
  --btn-maroon-text-focus: #ffffff; /* При фокусе */
  --btn-maroon-text-disabled: #8a4a52; /* Серо-бордовый текст */

  /* Дополнительные элементы */
  --header-bg: #e9ecef; /* Фон шапки */
  --header-text: #333; /* Текст шапки */
  --footer-bg: #888; /* Фон подвала */
  --footer-text: #333; /* Текст подвала */

  /* Стили выделенных элементов */
  --select-bg: #3A7CB4; /* Фон выделенного элемента */      
  
  /* Стили фокусированных элементов */
  --focus-bg: #3A7CB4; /* Фон фокусированного элемента */      
  
  /* Стили таблиц */
  --table-tr-select-bg: #3A7CB4; /* Фон выделенной строки */
  
  /* Стили селектов */
  --select-options-select-bg: #3A7CB4; /* Фон выделенной строки */
  
  
  /* === РАДИУСЫ УГЛОВ (ОБЩИЕ ДЛЯ ВСЕХ ТЕМ) === */
  --radius-none: 0;        /* Острые углы, без скругления */
  --radius-0: 0;           /* Острые углы, без скругления */
  --radius-mc: 1px;        /* Минимальный радиус */
  --radius-1: 1px;         /* Минимальный радиус */
  --radius-xs: 2px;        /* Минимальный радиус */
  --radius-2: 2px;         /* Минимальный радиус */
  --radius-3: 3px;         /* Минимальный радиус */
  --radius-sm: 4px;        /* Малый радиус */
  --radius-4: 4px;         /* Малый радиус */
  --radius-5: 5px;         /* Малый радиус */
  --radius-6: 6px;         /* Малый радиус */
  --radius-7: 7px;         /* Малый радиус */
  --radius-md: 8px;        /* Средний радиус */
  --radius-8: 8px;         /* Средний радиус */
  --radius-9: 9px;         /* Средний радиус */
  --radius-10: 10px;       /* Средний радиус */
  --radius-lg: 12px;       /* Большой радиус */
  --radius-12: 12px;       /* Большой радиус */
  --radius-14: 14px;       /* Большой радиус */
  --radius-xl: 16px;       /* Очень большой радиус */
  --radius-16: 16px;       /* Очень большой радиус */
  --radius-18: 18px;       /* Очень большой радиус */
  --radius-20: 20px;       /* Очень большой радиус */
  --radius-big: 24px;      /* Максимальный радиус */
  --radius-max: 48px;      /* Максимальный радиус */
  --radius-round: 50%;     /* Полная окружность (для круглых элементов) */
  --radius-pill: 9999px;   /* Полуовал/капсула (для кнопок, полей ввода) */
  
  /* ПЕРЕКЛЮЧАТЕЛЬ Радиусов для компонентов*/
  --radius: var(--radius-0);          /* Кнопки (стандартные) */
  
  
  /* Радиусы для конкретных компонентов */
  --radius-button: var(--radius);          /* Кнопки (стандартные) */
  --radius-button-pill: var(--radius-pill);   /* Кнопки-капсулы */
  --radius-input: var(--radius);          /* Поля input */
  --radius-input-pill: var(--radius-pill);   /* Поля ввода-капсулы */
  --radius-textarea: var(--radius);       /* Текстовые области */
  --radius-richtext: var(--radius);       /* Редакторы richtext */
  --radius-select: var(--radius);         /* Кастомные select */
  --radius-select-pill: var(--radius-pill);  /* Select-капсулы */
  --radius-checkbox: var(--radius-sm);       /* Чекбоксы */
  --radius-checkbox-horizontal: var(--radius-md); /* Горизонтальные чекбоксы */
  --radius-radio: var(--radius-round);       /* Радиокнопки (круглые) */
  --radius-card: var(--radius-lg);           /* Карточки */
  --radius-card-inner: var(--radius-md);     /* Внутренние элементы карточек */
  --radius-table: var(--radius);          /* Таблицы (углы таблицы) */
  --radius-table-cell: var(--radius-xs);     /* Ячейки таблицы */
  --radius-modal: var(--radius-xl);          /* Модальные окна */
  --radius-popover: var(--radius-lg);        /* Всплывающие окна/подсказки */
  --radius-tooltip: var(--radius-sm);        /* Тулытипы */
  --radius-dropdown: var(--radius-md);       /* Выпадающие списки */
  --radius-alert: var(--radius-md);          /* Алёрты/уведомления */
  --radius-badge: var(--radius-pill);        /* Бейджи (капсулы) */
  --radius-tab: var(--radius-md);            /* Вкладки (табы) */
  --radius-tab-pill: var(--radius-pill);     /* Табы-капсулы */
  --radius-avatar: var(--radius-round);      /* Аватары (круглые) */
  --radius-progress: var(--radius-pill);     /* Прогресс-бары */
  --radius-skeleton: var(--radius-sm);       /* Скелетоны/заглушки */
  --radius-divider: var(--radius-none);      /* Разделители (обычно без скругления) */
  --radius-layer: var(--radius-md);          /* Общие слои/контейнеры */
  --radius-overlay: var(--radius-md);        /* Оверлеи/подложки */

}

/* === CSS-ПЕРЕМЕННЫЕ ДЛЯ ТЁМНОЙ ТЕМЫ === */
[data-theme="dark"] {
  --bg: #3a342e;  /* Стильный */  
  --bg-primary: #1A1A1A;
  --bg-secondary: #1e1e1e;
  --text-primary: #e0e0e0;
  --text-secondary: #aaa;
  --border-color: #444;
  --border-primary: #444;
  --border-secondary: #3D3D3D;
  --shadow: 0 2px 8px rgba(0,0,0,0.3);

  /* Шкала серых для сегментов (0-9) - темнее оригинала */
  --OLD-bg-0: #0C0C0C;  /* (самый тёмный) */
  --OLD-bg-1: #181818;  /* */
  --OLD-bg-2: #242424;  /* */
  --OLD-bg-3: #303030;  /* */
  --OLD-bg-4: #3D3D3D;  /* */
  --OLD-bg-5: #494949;  /* */
  --OLD-bg-6: #555555;  /* */
  --OLD-bg-7: #616161;  /* */
  --OLD-bg-8: #6D6D6D;  /* */
  --OLD-bg-9: #797979;  /* (самый светлый) */


  /* Шкала серых для сегментов (0-9) - темнее оригинала */
  --bg-0: #000000;  /* (самый тёмный) */
  --bg-1: #171717;  /* */
  --bg-2: #2E2E2E;  /* */
  --bg-3: #454545;  /* */
  --bg-4: #5C5C5C;  /* */
  --bg-5: #737373;  /* */
  --bg-6: #8A8A8A;  /* */
  --bg-7: #A1A1A1;  /* */
  --bg-8: #B8B8B8;  /* */
  --bg-9: #CFCFCF;  /* (самый светлый) */

  --gr: linear-gradient(90deg, #999 0%, #111 100%); /* Горизонтальный градиент от тёмного к светлому */
  
  /* Формы */
  --form-control-bg: #2d2d2d;
  --form-control-border: #555;
  --form-control-tx: #e0e0e0;
  --form-control-placeholder: #aaa;
  
  /* ===== КНОПКА "ДА" / "ПОДТВЕРДИТЬ" (Dark) ===== */
  --btn-yes: #27ae60; /* Тёмно-зелёный - видимый но не слишком яркий для тёмного фона */
  --btn-yes-hover: #219653; /* Наведение - немного темнее */
  --btn-yes-active: #1a7c44; /* Нажатие - глубокий тёмно-зелёный */
  --btn-yes-focus: #27ae60; /* Фокус - основной тёмно-зелёный */
  --btn-yes-disabled: #1a3d29; /* Отключённое - очень тёмный зелёный */
  --btn-yes-text: #ffffff; /* Белый текст для максимального контраста */
  --btn-yes-text-hover: #ffffff;
  --btn-yes-text-active: #ffffff;
  --btn-yes-text-focus: #ffffff;
  --btn-yes-text-disabled: #4a8c6d; /* Приглушённый зелёный текст */
  
  /* ===== КНОПКА "НЕТ" / "ОТКЛОНИТЬ" (Dark) ===== */
  --btn-no: #c0392b; /* Тёмно-красный - заметный но не режущий глаз в темноте */
  --btn-no-hover: #a93226; /* Наведение - ещё темнее */
  --btn-no-active: #8b261e; /* Нажатие - очень тёмный красный */
  --btn-no-focus: #c0392b; /* Фокус - основной тёмно-красный */
  --btn-no-disabled: #3d1a17; /* Отключённое - тёмный красно-коричневый */
  --btn-no-text: #ffffff; /* Белый текст для контраста */
  --btn-no-text-hover: #ffffff;
  --btn-no-text-active: #ffffff;
  --btn-no-text-focus: #ffffff;
  --btn-no-text-disabled: #a65e56; /* Приглушённый красно-коричневый текст */
  
  /* ===== КНОПКА "ОТМЕНА" (Dark) ===== */
  --btn-cancel: #7f8c8d; /* Средне-серый - нейтральный на тёмном фоне */
  --btn-cancel-hover: #6c7b7d; /* Наведение - темнее */
  --btn-cancel-active: #5a6667; /* Нажатие - тёмно-серый */
  --btn-cancel-focus: #7f8c8d; /* Фокус - основной серый */
  --btn-cancel-disabled: #2d3436; /* Отключённое - очень тёмный серый */
  --btn-cancel-text: #ffffff; /* Белый текст для контраста на сером */
  --btn-cancel-text-hover: #ffffff;
  --btn-cancel-text-active: #ffffff;
  --btn-cancel-text-focus: #ffffff;
  --btn-cancel-text-disabled: #6b7279; /* Серый текст для отключённого */
  
  /* ===== КНОПКА "ВКЛ" / "АКТИВИРОВАТЬ" (Dark) ===== */
  --btn-on: #2980b9; /* Тёмно-синий - ассоциация с активностью, но не яркий */
  --btn-on-hover: #216895; /* Наведение - темнее */
  --btn-on-active: #1a5276; /* Нажатие - глубокий синий */
  --btn-on-focus: #2980b9; /* Фокус - основной тёмно-синий */
  --btn-on-disabled: #1a3a4d; /* Отключённое - очень тёмный синий */
  --btn-on-text: #ffffff; /* Белый текст для контраста */
  --btn-on-text-hover: #ffffff;
  --btn-on-text-active: #ffffff;
  --btn-on-text-focus: #ffffff;
  --btn-on-text-disabled: #5d8cb3; /* Приглушённый синий текст */
  
  /* ===== КНОПКА "ОК" / "ГОТОВО" (Dark) ===== */
  --btn-ok: #8e44ad; /* Тёмно-фиолетовый - заметный завершающий акцент */
  --btn-ok-hover: #7d3c98; /* Наведение - темнее */
  --btn-ok-active: #6c3483; /* Нажатие - глубокий фиолетовый */
  --btn-ok-focus: #8e44ad; /* Фокус - основной тёмно-фиолетовый */
  --btn-ok-disabled: #2d1b33; /* Отключённое - очень тёмный фиолетовый */
  --btn-ok-text: #ffffff; /* Белый текст для контраста */
  --btn-ok-text-hover: #ffffff;
  --btn-ok-text-active: #ffffff;
  --btn-ok-text-focus: #ffffff;
  --btn-ok-text-disabled: #9b78b3; /* Приглушённый фиолетовый текст */

  /* ===== ОСНОВНАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-primary: #4663A4; /* Основной синий цвет для главных действий в тёмном интерфейсе */
  --btn-primary-hover: #4C6BBC; /* Наведение - слегка светлее для визуальной обратной связи */
  --btn-primary-active: #3A5290; /* Нажатие - заметно темнее, создаёт эффект "утопления" кнопки */
  --btn-primary-focus: #4663A4; /* Фокус при навигации с клавиатуры - совпадает с основным цветом */
  --btn-primary-disabled: #2A3550; /* Отключённое состояние - тёмный сине-серый, не активный вид */
  --btn-primary-text: #FFFFFF; /* Белый текст обеспечивает максимальный контраст на синем фоне */
  --btn-primary-text-hover: #FFFFFF; /* Текст при наведении остаётся белым для консистентности */
  --btn-primary-text-active: #FFFFFF; /* Текст при нажатии белый - состояние явно отличается только фоном */
  --btn-primary-text-focus: #FFFFFF; /* Текст при фокусе белый, фокус показывается через outline */
  --btn-primary-text-disabled: #6C7A9C; /* Приглушённый сине-серый текст для отключённого состояния */
  
  /* ===== ВТОРИЧНАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-secondary: #45515B; /* Нейтральный серо-синий для второстепенных действий */
  --btn-secondary-hover: #28394A; /* Наведение - значительно темнее, что контрастирует с тёмным фоном */
  --btn-secondary-active: #1E2A36; /* Нажатие - очень тёмный для чёткой обратной связи */
  --btn-secondary-focus: #45515B; /* Фокус - основной цвет, контур выделит элемент */
  --btn-secondary-disabled: #2D343B; /* Отключённое - тёмно-серый, почти сливается с фоном */
  --btn-secondary-text: #FFFFFF; /* Белый текст читается на всех состояниях фона */
  --btn-secondary-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-secondary-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-secondary-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-secondary-text-disabled: #6B7279; /* Серый текст, достаточно видимый но не активный */
  
  /* ===== КНОПКА УСПЕХА (ТЁМНАЯ ТЕМА) ===== */
  --btn-success: #42543E; /* Тёмный приглушённый зелёный для подтверждающих действий */
  --btn-success-hover: #4C6645; /* Наведение - немного светлее и насыщеннее */
  --btn-success-active: #364531; /* Нажатие - возврат к тёмному с лёгким затемнением */
  --btn-success-focus: #42543E; /* Фокус - основной цвет */
  --btn-success-disabled: #2D352B; /* Отключённое - тёмный серо-зелёный, почти чёрный */
  --btn-success-text: #FFFFFF; /* Белый текст для контраста на тёмно-зелёном */
  --btn-success-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-success-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-success-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-success-text-disabled: #66735F; /* Серо-зелёный текст, читаемый но не активный */
  
  /* ===== КНОПКА ОПАСНОСТИ (ТЁМНАЯ ТЕМА) ===== */
  --btn-danger: #e74c3c; /* Ярко-красный для опасных действий (удаление, отмена) */
  --btn-danger-hover: #c0392b; /* Наведение - тёмно-красный, менее агрессивный */
  --btn-danger-active: #A3291D; /* Нажатие - глубокий тёмно-красный, предупреждающий */
  --btn-danger-focus: #e74c3c; /* Фокус - яркий красный для заметности */
  --btn-danger-disabled: #5C231D; /* Отключённое - тёмный красно-коричневый, не активный */
  --btn-danger-text: #FFFFFF; /* Белый текст обеспечивает чёткую читаемость на красном */
  --btn-danger-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-danger-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-danger-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-danger-text-disabled: #A65E56; /* Приглушённый красно-коричневый текст */
  
  /* ===== КНОПКА ПРЕДУПРЕЖДЕНИЯ (ТЁМНАЯ ТЕМА) ===== */
  --btn-warning: #f39c12; /* Золотисто-жёлтый для предупреждающих действий */
  --btn-warning-hover: #d35400; /* Наведение - тёмно-оранжевый, более серьёзное предупреждение */
  --btn-warning-active: #B34700; /* Нажатие - глубокий оранжево-коричневый */
  --btn-warning-focus: #f39c12; /* Фокус - яркий жёлтый для заметности */
  --btn-warning-disabled: #5C3D0F; /* Отключённое - тёмный коричнево-оранжевый */
  --btn-warning-text: #000000; /* Чёрный текст для контраста на светлом жёлтом фоне */
  --btn-warning-text-hover: #000000; /* Текст при наведении чёрный */
  --btn-warning-text-active: #000000; /* Текст при нажатии чёрный */
  --btn-warning-text-focus: #000000; /* Текст при фокусе чёрный */
  --btn-warning-text-disabled: #8A6D3D; /* Тёмно-коричневый текст для отключённого состояния */
  
  /* ===== КНОПКА ИНФОРМАЦИИ (ТЁМНАЯ ТЕМА) ===== */
  --btn-info: #3498db; /* Голубой для информационных действий и справки */
  --btn-info-hover: #2980b9; /* Наведение - более тёмный синий */
  --btn-info-active: #216895; /* Нажатие - глубокий синий */
  --btn-info-focus: #3498db; /* Фокус - яркий голубой */
  --btn-info-disabled: #1D3E56; /* Отключённое - тёмный сине-серый */
  --btn-info-text: #FFFFFF; /* Белый текст для контраста на голубом */
  --btn-info-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-info-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-info-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-info-text-disabled: #5C8FB8; /* Приглушённый голубой текст */
  
  /* ===== ФИОЛЕТОВАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-purple: #9b59b6; /* Фиолетовый для акцентных и премиум функций */
  --btn-purple-hover: #8e44ad; /* Наведение - более тёмный фиолетовый */
  --btn-purple-active: #773894; /* Нажатие - глубокий фиолетовый */
  --btn-purple-focus: #9b59b6; /* Фокус - яркий фиолетовый */
  --btn-purple-disabled: #3D2B48; /* Отключённое - тёмный серо-фиолетовый */
  --btn-purple-text: #FFFFFF; /* Белый текст для контраста на фиолетовом */
  --btn-purple-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-purple-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-purple-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-purple-text-disabled: #B28DC9; /* Светло-фиолетовый текст, достаточно видимый */
  
  /* ===== ОРАНЖЕВАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-orange: #e67e22; /* Оранжевый для призыва к действию, выделения */
  --btn-orange-hover: #d35400; /* Наведение - тёмно-оранжевый */
  --btn-orange-active: #B34700; /* Нажатие - глубокий оранжево-коричневый */
  --btn-orange-focus: #e67e22; /* Фокус - яркий оранжевый */
  --btn-orange-disabled: #5C3D0F; /* Отключённое - тёмный коричнево-оранжевый */
  --btn-orange-text: #000000; /* Чёрный текст для контраста на светлом оранжевом */
  --btn-orange-text-hover: #000000; /* Текст при наведении чёрный */
  --btn-orange-text-active: #000000; /* Текст при нажатии чёрный */
  --btn-orange-text-focus: #000000; /* Текст при фокусе чёрный */
  --btn-orange-text-disabled: #8A6D3D; /* Тёмно-коричневый текст для отключённого */
  
  /* ===== РОЗОВАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-pink: #e91e63; /* Розовый для маркетинговых и специальных акций */
  --btn-pink-hover: #c2185b; /* Наведение - тёмно-розовый */
  --btn-pink-active: #A1144A; /* Нажатие - глубокий розовый */
  --btn-pink-focus: #e91e63; /* Фокус - яркий розовый */
  --btn-pink-disabled: #5C1A33; /* Отключённое - тёмный серо-розовый */
  --btn-pink-text: #FFFFFF; /* Белый текст для контраста на розовом */
  --btn-pink-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-pink-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-pink-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-pink-text-disabled: #C97D9D; /* Светло-розовый текст, достаточно видимый */
  
  /* ===== БИРЮЗОВАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-teal: #1abc9c; /* Бирюзовый для современных и свежих функций */
  --btn-teal-hover: #16a085; /* Наведение - тёмно-бирюзовый */
  --btn-teal-active: #12826A; /* Нажатие - глубокий бирюзовый */
  --btn-teal-focus: #1abc9c; /* Фокус - яркий бирюзовый */
  --btn-teal-disabled: #0F4D3F; /* Отключённое - тёмный серо-бирюзовый */
  --btn-teal-text: #000000; /* Чёрный текст для контраста на светлом бирюзовом */
  --btn-teal-text-hover: #000000; /* Текст при наведении чёрный */
  --btn-teal-text-active: #000000; /* Текст при нажатии чёрный */
  --btn-teal-text-focus: #000000; /* Текст при фокусе чёрный */
  --btn-teal-text-disabled: #5C8A7D; /* Тёмно-бирюзовый текст для отключённого */
  
  /* ===== ИНДИГО КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-indigo: #564fcc; /* Индиго для профессиональных и IT-функций */
  --btn-indigo-hover: #463dbb; /* Наведение - более тёмный индиго */
  --btn-indigo-active: #3831A1; /* Нажатие - глубокий индиго */
  --btn-indigo-focus: #564fcc; /* Фокус - яркий индиго */
  --btn-indigo-disabled: #2A284F; /* Отключённое - тёмный серо-индиго */
  --btn-indigo-text: #FFFFFF; /* Белый текст для контраста на индиго */
  --btn-indigo-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-indigo-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-indigo-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-indigo-text-disabled: #8C88D6; /* Светло-индиго текст, достаточно видимый */
  
  /* ===== ЛАЙМОВАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-lime: #c4e538; /* Лаймовый для ярких акцентов и новых функций */
  --btn-lime-hover: #a4c42c; /* Наведение - тёмно-лаймовый */
  --btn-lime-active: #8BA524; /* Нажатие - глубокий лаймово-зелёный */
  --btn-lime-focus: #c4e538; /* Фокус - яркий лаймовый */
  --btn-lime-disabled: #4D5526; /* Отключённое - тёмный серо-зелёный */
  --btn-lime-text: #000000; /* Чёрный текст для контраста на светлом лаймовом */
  --btn-lime-text-hover: #000000; /* Текст при наведении чёрный */
  --btn-lime-text-active: #000000; /* Текст при нажатии чёрный */
  --btn-lime-text-focus: #000000; /* Текст при фокусе чёрный */
  --btn-lime-text-disabled: #8A8F5C; /* Тёмно-лаймовый текст для отключённого */
  
  /* ===== БОРДОВАЯ КНОПКА (ТЁМНАЯ ТЕМА) ===== */
  --btn-maroon: #8b0000; /* Бордовый для эксклюзивных и VIP-функций */
  --btn-maroon-hover: #6b0000; /* Наведение - очень тёмный бордовый */
  --btn-maroon-active: #4A0000; /* Нажатие - почти чёрный с бордовым оттенком */
  --btn-maroon-focus: #8b0000; /* Фокус - яркий бордовый */
  --btn-maroon-disabled: #3D1A1A; /* Отключённое - тёмный серо-бордовый */
  --btn-maroon-text: #FFFFFF; /* Белый текст для контраста на тёмном бордовом */
  --btn-maroon-text-hover: #FFFFFF; /* Текст при наведении белый */
  --btn-maroon-text-active: #FFFFFF; /* Текст при нажатии белый */
  --btn-maroon-text-focus: #FFFFFF; /* Текст при фокусе белый */
  --btn-maroon-text-disabled: #A65E5E; /* Приглушённый бордовый текст для отключённого */

  /* Доп. элементы */
  --header-bg: #2a2a2a;
  --header-text: #fff;
  --footer-bg: #333;
  --footer-text: #fff; /* Текст подвала */
      
  /* Стили выделенных элементов */
  --select-bg: #2E3F4E; /* Фон выделенного элемента */      
  
  /* Стили фокусированных элементов */
  --focus-bg: #2E3F4E; /* Фон фокусированного элемента */      
  
  /* Стили таблиц */
  --table-tr-select-bg: #2E3F4E; /* Фон выделенной строки */
  
  /* Стили селектов */
  --select-options-select-bg: #2E3F4E; /* Фон выделенной строки */
}