/* ============================================
   DARK THEME V3.0 - БЕЗ !IMPORTANT
   Використовуємо Bootstrap CSS змінні
   ============================================ */

html.dark-theme {
  /* Основные цвета */
  --bs-body-bg: #0f172a;
  --bs-body-color: #e2e8f0;
  --bs-emphasis-color: #f1f5f9;
  --bs-secondary-color: #cbd5e1;
  --bs-tertiary-color: #94a3b8;
  
  /* Фоны */
  --bs-card-bg: #1e293b;
  --bs-secondary-bg: #1e293b;
  --bs-tertiary-bg: #334155;
  
  /* Primary цвет */
  --bs-primary: #8B5CF6;
  --bs-primary-rgb: 139, 92, 246;
  
  /* Границы */
  --bs-border-color: #334155;
  --bs-border-color-translucent: rgba(51, 65, 85, 0.5);
  
  /* Ссылки */
  --bs-link-color: #a78bfa;
  --bs-link-hover-color: #8B5CF6;
  
  /* Focus ring */
  --bs-focus-ring-color: rgba(139, 92, 246, 0.25);
  
  /* Формы */
  --bs-form-control-bg: #1e293b;
  --bs-form-control-color: #e2e8f0;
  --bs-form-control-disabled-bg: #334155;
  
  /* Кнопки */
  --bs-btn-color: #fff;
  --bs-btn-bg: #8B5CF6;
  --bs-btn-border-color: #8B5CF6;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #7c3aed;
  --bs-btn-hover-border-color: #7c3aed;
  --bs-btn-active-bg: #6d28d9;
  --bs-btn-active-border-color: #6d28d9;
  
  /* Form check - переопределяем для темной темы */
  --bs-form-check-bg: #1e293b;
  --bs-form-check-border: #334155;
}

html.dark-theme {
  background: var(--bs-body-bg) !important;
  color: var(--bs-body-color);
}

html.dark-theme body {
  background: transparent !important;
  color: var(--bs-body-color);
}

/* Убрано глобальное правило color с !important - оно конфликтовало с чекбоксами */

/* Чекбоксы Bootstrap - НЕ трогаем базовое состояние, переопределяем только :checked */
/* Bootstrap по умолчанию: background-image: var(--bs-form-check-bg-image); где переменная undefined */

/* Состояние :checked - устанавливаем CSS переменную с галочкой */
html.dark-theme .form-check-input:checked[type="checkbox"] {
  --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

/* Отключаем filter для :active */
html.dark-theme .form-check-input:active {
  filter: none;
}

/* Убираем псевдоэлементы */
html.dark-theme .form-check-input::before,
html.dark-theme .form-check-input::after {
  display: none;
  content: none;
}

html.dark-theme h1,
html.dark-theme h2,
html.dark-theme h3,
html.dark-theme h4,
html.dark-theme h5,
html.dark-theme h6 {
  color: var(--bs-emphasis-color);
}

html.dark-theme a {
  color: var(--bs-link-color);
}

html.dark-theme a:hover {
  color: var(--bs-link-hover-color) !important;
}

html.dark-theme .card,
html.dark-theme .block,
html.dark-theme .user-url,
html.dark-theme .dashboard-card,
html.dark-theme .content,
html.dark-theme .main-content,
html.dark-theme .page-content {
  background: var(--bs-card-bg) !important;
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

html.dark-theme .advantages-item {
  background: var(--bs-card-bg) !important;
  border-color: var(--bs-border-color);
  color: var(--bs-body-color);
  box-shadow: none !important;
}

html.dark-theme .card-body,
html.dark-theme .card-header,
html.dark-theme .card-footer {
  background: transparent !important;
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

html.dark-theme .alert {
  background: #1e293b !important;
  border-color: #334155;
  color: var(--bs-body-color);
}

html.dark-theme .alert-primary {
  background: rgba(139, 92, 246, 0.2) !important;
  border-color: #8B5CF6;
  color: #e2e8f0;
}

html.dark-theme .alert-success {
  background: rgba(34, 197, 94, 0.2) !important;
  border-color: #22c55e;
  color: #e2e8f0;
}

html.dark-theme .text-muted {
  color: #94a3b8 !important;
}

html.dark-theme .text-primary-emphasis {
  color: #c4b5fd !important;
}

html.dark-theme .modal-content {
  background: #1e293b;
  border-color: #334155;
  color: var(--bs-body-color);
}

html.dark-theme .modal-header,
html.dark-theme .modal-footer {
  border-color: #334155;
}

html.dark-theme .modal-body {
  background: #1e293b;
  color: var(--bs-body-color);
}

html.dark-theme .modal-title {
  color: var(--bs-body-color);
}

html.dark-theme .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

html.dark-theme .dropdown-menu {
  background: #1e293b;
  border-color: #334155;
}

html.dark-theme .dropdown-item {
  color: var(--bs-body-color);
}

html.dark-theme .dropdown-item:hover,
html.dark-theme .dropdown-item:focus {
  background: #334155;
  color: var(--bs-body-color);
}

html.dark-theme .table {
  --bs-table-bg: transparent;
  --bs-table-striped-bg: rgba(51, 65, 85, 0.3);
  --bs-table-hover-bg: rgba(51, 65, 85, 0.5);
  color: #e2e8f0;
  border-color: #334155;
}

html.dark-theme .table thead,
html.dark-theme .table tbody {
  border-color: #334155;
  color: #f1f5f9;
}

html.dark-theme .table td,
html.dark-theme .table th {
  border-color: #334155;
  color: #f1f5f9;
}

/* КРИТИЧНО: Исключаем чекбоксы из стилей таблиц */
html.dark-theme .table td .form-check-input,
html.dark-theme .table th .form-check-input {
  color: inherit;
  border-color: var(--bs-border-color);
  background-color: var(--bs-form-check-bg);
}

html.dark-theme .table td .form-check-input:checked,
html.dark-theme .table th .form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

html.dark-theme .sidebar,
html.dark-theme .navpanel,
html.dark-theme .offcanvas {
  background: #1e293b;
  border-color: #334155;
}

html.dark-theme .sidebar a,
html.dark-theme .navpanel a {
  color: var(--bs-body-color);
}

html.dark-theme input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html.dark-theme textarea,
html.dark-theme select,
html.dark-theme .form-control:not([type="file"]),
html.dark-theme .form-select {
  background: var(--bs-form-control-bg) !important;
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

/* Все белые блоки контента - удалено дублирование, уже есть выше */
html.dark-theme .content-block,
html.dark-theme .settings-block,
html.dark-theme .white-block {
  background: var(--bs-card-bg) !important;
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

/* Таблицы - только сами элементы таблиц темные, не содержимое */
html.dark-theme table,
html.dark-theme .table,
html.dark-theme table tr,
html.dark-theme .table tr,
html.dark-theme .table-rounded {
  background: transparent !important;
  border-color: var(--bs-border-color) !important;
}

/* Ячейки таблиц - только текст и границы, НЕ трогаем input элементы */
html.dark-theme table td:not(:has(input)),
html.dark-theme table th:not(:has(input)),
html.dark-theme .table td:not(:has(input)),
html.dark-theme .table th:not(:has(input)) {
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

/* Ячейки с input элементами - оставляем как есть */
html.dark-theme table td:has(input),
html.dark-theme table th:has(input),
html.dark-theme .table td:has(input),
html.dark-theme .table th:has(input) {
  /* Не применяем никаких правил - пусть input работают нормально */
}

/* Чекбоксы Bootstrap используют стандартные стили - не переопределяем */

/* Toggle переключатели (.form-switcher) - переопределяем только SVG для темной темы */
html.dark-theme .form-switcher input {
  background-color: var(--bs-border-color) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23ffffff'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 3px 50% !important;
}

html.dark-theme .form-switcher input:checked {
  background-color: var(--bs-success) !important;
  background-position: calc(100% - 3px) 50% !important;
}

html.dark-theme table thead,
html.dark-theme .table thead,
html.dark-theme table thead th,
html.dark-theme .table thead th {
  background: var(--bs-secondary-bg) !important;
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

html.dark-theme table tbody tr:hover,
html.dark-theme .table tbody tr:hover {
  background: var(--bs-secondary-bg) !important;
}

html.dark-theme input[type="file"].form-control::file-selector-button {
  background-color: #8B5CF6;
  color: #ffffff;
  pointer-events: all;
}

html.dark-theme input[type="file"].form-control:hover:not(:disabled):not([readonly])::file-selector-button {
  background-color: #7c3aed;
}

html.dark-theme input::placeholder,
html.dark-theme textarea::placeholder {
  color: #64748b;
}

html.dark-theme input:focus,
html.dark-theme textarea:focus,
html.dark-theme select:focus,
html.dark-theme .form-control:focus {
  background: var(--bs-form-control-bg);
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.25rem var(--bs-focus-ring-color);
  color: var(--bs-body-color);
}

html.dark-theme label,
html.dark-theme .form-label {
  color: #94a3b8;
}

/* Чекбоксы в темной теме - убираем специфичные стили, используем стандартные */

/* Toggle переключатели используют стандартные стили из светлой темы - не переопределяем */

html.dark-theme .navpanel .logo a:hover {
  background-color: transparent !important;
  background: none !important;
}

html.dark-theme footer,
html.dark-theme #footer {
  background: #1e293b !important;
  color: #f1f5f9 !important;
}

html.dark-theme footer *,
html.dark-theme #footer * {
  color: #f1f5f9 !important;
}

html.dark-theme footer a,
html.dark-theme #footer a {
  color: #c4b5fd !important;
}

/* ============================================
   СПЕЦИФИЧНЫЕ СТИЛИ ДЛЯ ТЕМНОЙ ТЕМЫ
   ============================================ */

/* Hover эффект для advantages-item в темной теме */
html.dark-theme .advantages-item:hover {
  background-color: #334155 !important;
  border-color: var(--bs-primary);
  transform: translateY(-4px);
}

/* Размер логотипа наследуется из основных стилей */

/* Hero section - светлый текст */
html.dark-theme .hero-title,
html.dark-theme .hero-subtitle {
  color: var(--bs-emphasis-color) !important;
}

/* Footer - светлый текст */
html.dark-theme footer,
html.dark-theme footer *,
html.dark-theme #footer,
html.dark-theme #footer * {
  color: var(--bs-body-color) !important;
}

html.dark-theme footer a,
html.dark-theme #footer a {
  color: var(--bs-link-color) !important;
}

html.dark-theme footer a:hover,
html.dark-theme #footer a:hover {
  color: var(--bs-link-hover-color) !important;
}

/* ============================================
   ИСПРАВЛЕНИЯ СВЕТЛЫХ БЛОКОВ В ТЕМНОЙ ТЕМЕ
   ============================================ */

/* Header админки */
html.dark-theme .header {
  background: var(--bs-card-bg) !important;
  border-bottom-color: var(--bs-border-color) !important;
}

/* Tabs */
html.dark-theme .tabs {
  background-color: var(--bs-secondary-bg) !important;
  box-shadow: inset 0 -1px 0 var(--bs-border-color) !important;
}

html.dark-theme .tabs .nav-link {
  background: var(--bs-tertiary-bg) !important;
  border-bottom-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}

html.dark-theme .tabs .nav-link.active {
  background-color: var(--bs-card-bg) !important;
  color: var(--bs-emphasis-color) !important;
  border-color: var(--bs-border-color) !important;
  border-bottom-color: var(--bs-card-bg) !important;
}

/* Control buttons (fixed bottom) */
html.dark-theme .control-buttons {
  background-color: var(--bs-card-bg) !important;
  border-top-color: var(--bs-border-color) !important;
  box-shadow: 0px -1px 2px 0px rgba(255, 255, 255, 0.05) !important;
}

/* Codes textarea */
html.dark-theme .codes-textarea .form-control {
  background-color: var(--bs-secondary-bg) !important;
  color: var(--bs-body-color) !important;
}

/* Block tabs */
html.dark-theme .block-tabs {
  box-shadow: inset 0 -1px 0 var(--bs-border-color) !important;
}

html.dark-theme .block-tabs .nav-link {
  color: var(--bs-body-color) !important;
}

html.dark-theme .block-tabs .nav-link.active {
  background-color: var(--bs-tertiary-bg) !important;
  color: var(--bs-emphasis-color) !important;
}

/* Check-radio кастомные элементы - используют свои стили из dashboard.css */
/* УДАЛЕНЫ правила которые конфликтовали с Bootstrap .form-check-input */

/* Dropbox (drag & drop) */
html.dark-theme .dropbox {
  border-color: var(--bs-border-color) !important;
  background: transparent !important;
  color: var(--bs-body-color) !important;
}

html.dark-theme .dropbox:hover,
html.dark-theme .dropbox.active {
  border-color: var(--bs-primary) !important;
  background-color: rgba(139, 92, 246, 0.1) !important;
}

/* Tab content и tab panes */
html.dark-theme .tab-content,
html.dark-theme .tab-pane {
  background: transparent !important;
  color: var(--bs-body-color) !important;
}

/* Admin settings специфичные стили */
html.dark-theme .admin-settings {
  background: var(--bs-card-bg) !important;
  border-color: var(--bs-border-color) !important;
}

html.dark-theme .settings-table {
  background: transparent !important;
}

html.dark-theme .settings-table td,
html.dark-theme .settings-table th {
  background-color: transparent !important;
  border-color: var(--bs-border-color) !important;
  color: var(--bs-body-color) !important;
}