/* Меняйте значения здесь. Названия переменных одинаковы в обеих темах.
   Новые цвета добавляйте в оба блока, затем используйте var(--имя) в CSS. */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --background: #f3f5f7; /* фон страницы */
  --surface: #ffffff; /* блоки и выпадающие меню */
  --surface-hover: #edf1f4; /* наведение на нейтральные элементы */
  --text: #18222d; /* основной текст */
  --text-muted: #616d7b; /* второстепенный текст */
  --border: #dce2e8; /* границы */
  --accent: #187348; /* основные кнопки */
  --accent-hover: #105b37;
  --accent-soft: #e3f2e9; /* мягкое выделение */
  --on-accent: #ffffff; /* текст на акценте */
  --focus: var(--accent); /* клавиатурный фокус */
  --shadow: #18222d14;
  --header-background: #ffffffd9;
  --header-highlight: #ffffff;
  --danger: #b42318; /* ошибки и опасные действия */
  --danger-soft: #fef3f2;
  --stat-background: #edf1f4; /* компактные карточки статистики */
  --positive: #187348; /* положительные показатели */
  --negative: #b42318; /* отрицательные показатели */
  --profile-cover: linear-gradient(120deg, var(--accent-soft), var(--surface-hover));
  --profile-avatar-background: linear-gradient(145deg, var(--accent-soft), var(--surface-hover));
  --banner-background: #061723;
  --banner-text: #f4f8fc;
  --banner-text-muted: #c7d3de;
  --banner-border: #284458;
  --banner-overlay: linear-gradient(90deg, #04101cf2 0%, #04101cd1 48%, #04101c4d 72%, transparent 100%);
  --banner-code-background: #173d30e8;
  --banner-code-border: #43dc6952;
  --banner-accent: #43dc69;
  --banner-accent-hover: #68eb87;
  --banner-on-accent: #071b10;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --background: #101419;
  --surface: #191f27;
  --surface-hover: #242e39;
  --text: #edf2f7;
  --text-muted: #a5b1bf;
  --border: #323d49;
  --accent: #70dda5;
  --accent-hover: #94e8bd;
  --accent-soft: #203e31;
  --on-accent: #10251b;
  --focus: var(--accent);
  --shadow: #00000040;
  --header-background: #151b22e8;
  --header-highlight: #26313d;
  --danger: #f97066;
  --danger-soft: #3b2427;
  --stat-background: #2a3139;
  --positive: #70dda5;
  --negative: #f97066;
  --profile-cover: linear-gradient(120deg, var(--accent-soft), var(--surface-hover));
  --profile-avatar-background: linear-gradient(145deg, var(--accent-soft), var(--surface-hover));
  --banner-background: #061723;
  --banner-text: #f4f8fc;
  --banner-text-muted: #c7d3de;
  --banner-border: #284458;
  --banner-overlay: linear-gradient(90deg, #04101cf2 0%, #04101cd1 48%, #04101c4d 72%, transparent 100%);
  --banner-code-background: #173d30e8;
  --banner-code-border: #43dc6952;
  --banner-accent: #43dc69;
  --banner-accent-hover: #68eb87;
  --banner-on-accent: #071b10;
}