/*
 * theme.css — Тулкит · единая цветовая палитра
 *
 * Это единственный источник правды для цветов.
 * Подключается первым: <link rel="stylesheet" href="theme.css">
 *
 * Каждая страница может добавить ТОЛЬКО --primary, --primary-light,
 * --primary-dark — свой брендовый акцент. Всё остальное здесь.
 */

/* ══════════════════════════════════════════════════════════════
   СВЕТЛАЯ ТЕМА (по умолчанию)
   ══════════════════════════════════════════════════════════════ */
:root {
  /* Фоны */
  --bg:            #f0f4f9;
  --white:         #ffffff;
  --surface:       #ffffff;
  --surface-2:     #f8fafc;

  /* Текст */
  --text:          #1a202c;
  --text-muted:    #718096;
  --text-faint:    #a0aec0;

  /* Рамки и тени */
  --border:        #e2e8f0;
  --border-strong: #cbd5e0;
  --shadow:        0 4px 24px rgba(0,0,0,.10);
  --shadow-sm:     0 2px 8px rgba(0,0,0,.07);

  /* Опасность/ошибки */
  --danger:        #e53e3e;
  --danger-bg:     #fff5f5;
  --danger-border: #fed7d7;

  /* Успех */
  --success:       #2ecc71;
  --success-dark:  #27ae60;

  /* UI-компоненты */
  --radius:        14px;
  --radius-sm:     9px;
  --transition:    .18s;
}

/* ══════════════════════════════════════════════════════════════
   ТЁМНАЯ ТЕМА
   ══════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  /* Фоны */
  --bg:            #0d1117;
  --white:         #141c28;
  --surface:       #1a2232;
  --surface-2:     #111827;

  /* Текст */
  --text:          #e8eaf0;
  --text-muted:    #9da5b8;
  --text-faint:    #6b7490;

  /* Рамки и тени */
  --border:        rgba(255,255,255,.10);
  --border-strong: rgba(255,255,255,.18);
  --shadow:        0 8px 40px rgba(0,0,0,.55);
  --shadow-sm:     0 2px 12px rgba(0,0,0,.35);

  /* Опасность/ошибки */
  --danger-bg:     rgba(229,62,62,.12);
  --danger-border: rgba(229,62,62,.30);
}

/* ══════════════════════════════════════════════════════════════
   ГЛОБАЛЬНЫЕ ТЁМНЫЕ ОВЕРРАЙДЫ — компоненты, используемые на
   всех страницах инструментов
   ══════════════════════════════════════════════════════════════ */

/* Базовые элементы */
[data-theme="dark"] body {
  color-scheme: dark;
}

/* Белый фон → тёмный */
[data-theme="dark"] .result-card,
[data-theme="dark"] .grid-card,
[data-theme="dark"] .legend-section,
[data-theme="dark"] .seo-feats,
[data-theme="dark"] .seo-feat,
[data-theme="dark"] .tool-card,
[data-theme="dark"] .card,
[data-theme="dark"] .sidebar-widget,
[data-theme="dark"] .detail-box {
  background: var(--white) !important;
  border-color: var(--border) !important;
}

/* btn-outline: белая в светлой → прозрачная в тёмной */
[data-theme="dark"] .btn-outline {
  background: rgba(67,97,238,.12) !important;
  color: var(--primary, #818cf8) !important;
  border-color: var(--primary, #818cf8) !important;
}
[data-theme="dark"] .btn-outline:hover:not(:disabled) {
  background: rgba(67,97,238,.22) !important;
}

/* Переключатели (toggle) */
[data-theme="dark"] .sw-track {
  background: rgba(255,255,255,.15) !important;
}
[data-theme="dark"] .sw input:checked + .sw-track {
  background: var(--primary, #4361ee) !important;
}
[data-theme="dark"] .sw-track::after {
  background: #e8eaf0 !important;
}

/* Предупреждения / ошибки */
[data-theme="dark"] .warn,
[data-theme="dark"] .tc-error,
[data-theme="dark"] .alert-danger {
  background: var(--danger-bg) !important;
  border-color: var(--danger-border) !important;
  color: #fc8181 !important;
}

/* Кастомный select (csel) */
[data-theme="dark"] .csel-btn {
  background: var(--white) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}
[data-theme="dark"] .csel-drop {
  background: #1a2035 !important;
  border-color: rgba(129,140,248,.25) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,.6) !important;
}
[data-theme="dark"] .csel-search {
  background: var(--bg) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] .csel-item { color: var(--text) !important; }
[data-theme="dark"] .csel-item:hover,
[data-theme="dark"] .csel-item.active {
  background: rgba(129,140,248,.15) !important;
  color: #818cf8 !important;
}

/* Кнопка расширенных настроек */
[data-theme="dark"] .adv-toggle {
  background: rgba(255,255,255,.04) !important;
  border-color: var(--border) !important;
}
[data-theme="dark"] .adv-toggle.open {
  background: rgba(67,97,238,.12) !important;
  border-color: var(--primary, #818cf8) !important;
}

/* Панель настроек экспорта */
[data-theme="dark"] .exp-settings-body {
  background: rgba(255,255,255,.04) !important;
}
[data-theme="dark"] .srow { border-color: var(--border) !important; }

/* Раздел "Слова для поиска" — chips */
[data-theme="dark"] .chip {
  background: rgba(67,97,238,.18) !important;
  color: #818cf8 !important;
}
[data-theme="dark"] .chip.failed {
  background: rgba(229,62,62,.18) !important;
  color: #fc8181 !important;
}

/* Направления (dir-pill) */
[data-theme="dark"] .dir-pill {
  background: rgba(255,255,255,.04) !important;
  border-color: var(--border) !important;
}

/* Полоса прокрутки в тёмной теме */
[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.2);
}

/* Инпуты */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] textarea {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}
[data-theme="dark"] input[type="text"]::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--text-faint);
}

/* SVG-кнопки (icon-btn) в тулах */
[data-theme="dark"] .icon-btn {
  background: rgba(37,45,64,.9) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: #9da5b8 !important;
}