/**
 * Глобальная тёмная тема: глубокий фон, «матовое стекло» (blur + полупрозрачность),
 * акценты в зелёно-бирюзовых тонах. Работает вместе с Bootstrap 5.3 data-bs-theme="dark".
 */

html[data-bs-theme="dark"] {
  color-scheme: dark;
  --app-blur: 18px;
  --app-blur-soft: 12px;
  --app-dropdown-blur: 26px;
  --app-glass-0: rgba(14, 22, 20, 0.42);
  --app-glass-1: rgba(22, 34, 30, 0.58);
  --app-glass-2: rgba(28, 42, 36, 0.72);
  --app-dropdown-surface: rgba(14, 24, 20, 0.92);
  --app-glass-border: rgba(255, 255, 255, 0.09);
  --app-glass-shine: rgba(255, 255, 255, 0.05);
  --app-accent: #3ecf8e;
  --app-accent-dim: rgba(62, 207, 142, 0.22);
  --app-link: #6ee7b7;
  --app-link-hover: #a7f3d0;
}

html[data-bs-theme="dark"] body.app-body {
  min-height: 100vh;
  color: var(--bs-body-color);
  background-color: #06080d;
  background-image: none;
}

html[data-bs-theme="dark"] .tmi-page-bg {
  background-color: #06080d;
  background-image: var(--tmi-page-bg-image);
}

html[data-bs-theme="dark"] .app-navbar {
  --bs-navbar-color: rgba(255, 255, 255, 0.88);
  --bs-navbar-hover-color: #fff;
  --bs-navbar-active-color: #fff;
  --bs-navbar-disabled-color: rgba(255, 255, 255, 0.45);
  --bs-navbar-brand-color: #ecfdf5;
  --bs-navbar-brand-hover-color: var(--app-link-hover, #a7f3d0);
  background: rgba(6, 12, 10, 0.82) !important;
  backdrop-filter: blur(var(--app-blur));
  -webkit-backdrop-filter: blur(var(--app-blur));
  border-bottom: 1px solid var(--app-glass-border);
  box-shadow: 0 4px 28px rgba(0, 0, 0, 0.45);
}

html[data-bs-theme="dark"] .app-navbar .navbar-brand {
  color: var(--bs-navbar-brand-color) !important;
  text-shadow: 0 0 24px var(--app-accent-dim);
}

html[data-bs-theme="dark"] .app-navbar .dropdown-menu {
  background: var(--app-dropdown-surface);
  backdrop-filter: blur(var(--app-dropdown-blur));
  -webkit-backdrop-filter: blur(var(--app-dropdown-blur));
  border-color: var(--app-glass-border);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

html[data-bs-theme="dark"] .app-main {
  padding-bottom: 4rem;
}

/* Карточки и панели */
html[data-bs-theme="dark"] .card {
  background: var(--app-glass-1);
  backdrop-filter: blur(var(--app-blur-soft));
  -webkit-backdrop-filter: blur(var(--app-blur-soft));
  border-color: var(--app-glass-border);
  box-shadow:
    0 4px 24px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 var(--app-glass-shine);
}

html[data-bs-theme="dark"] .card-header,
html[data-bs-theme="dark"] .card-footer {
  background: rgba(0, 0, 0, 0.2);
  border-color: var(--app-glass-border);
}

html[data-bs-theme="dark"] .list-group-item {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.06);
  color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .list-group-item-action:hover,
html[data-bs-theme="dark"] .list-group-item-action:focus {
  background: rgba(62, 207, 142, 0.08);
}

html[data-bs-theme="dark"] .list-group-flush > .list-group-item {
  border-width: 0 0 1px;
}

/* Мягкая «подсветка» + blur: компактные list-group-action (склад гильдии и т.п.) */
html[data-bs-theme="dark"] .list-group-item.list-group-item-action.py-2.small.text-start {
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.05) 50%,
    rgba(62, 207, 142, 0.06) 100%
  );
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  color: #f1f5f9;
}

html[data-bs-theme="dark"] .list-group-item.list-group-item-action.py-2.small.text-start:hover,
html[data-bs-theme="dark"] .list-group-item.list-group-item-action.py-2.small.text-start:focus {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.18) 0%,
    rgba(62, 207, 142, 0.12) 100%
  );
  border-color: rgba(255, 255, 255, 0.18);
  color: #fff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 0 0 1px rgba(62, 207, 142, 0.15);
}

html[data-bs-theme="dark"] .list-group-item.list-group-item-action.py-2.small.text-start:active {
  background: rgba(62, 207, 142, 0.18);
  color: #fff;
}

/* Кнопки outline-dark на всю ширину — читаемость на тёмном стекле */
html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100 {
  backdrop-filter: blur(12px) saturate(1.15);
  -webkit-backdrop-filter: blur(12px) saturate(1.15);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.1) 0%,
    rgba(255, 255, 255, 0.04) 100%
  );
  border-color: rgba(255, 255, 255, 0.22);
  color: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100:hover,
html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100:focus-visible {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.18) 0%,
    rgba(62, 207, 142, 0.12) 100%
  );
  border-color: rgba(255, 255, 255, 0.32);
  color: #fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 0 0 1px rgba(62, 207, 142, 0.2);
}

html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100:active {
  background: rgba(62, 207, 142, 0.2);
  color: #fff !important;
}

html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100:disabled {
  opacity: 0.5;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Утилиты Bootstrap: «белые» блоки → стекло */
html[data-bs-theme="dark"] .bg-white,
html[data-bs-theme="dark"] .bg-light {
  background-color: var(--app-glass-0) !important;
  backdrop-filter: blur(var(--app-blur-soft));
  -webkit-backdrop-filter: blur(var(--app-blur-soft));
}

html[data-bs-theme="dark"] .shadow-sm {
  box-shadow: 0 0.2rem 0.85rem rgba(0, 0, 0, 0.4) !important;
}

html[data-bs-theme="dark"] .shadow {
  box-shadow: 0 0.35rem 1.1rem rgba(0, 0, 0, 0.45) !important;
}

html[data-bs-theme="dark"] .border,
html[data-bs-theme="dark"] .border-bottom,
html[data-bs-theme="dark"] .border-top {
  border-color: var(--app-glass-border) !important;
}

/* Выпадающие меню и модалки — плотнее и выше контента страницы */
html[data-bs-theme="dark"] .dropdown-menu {
  z-index: 1045;
  background: var(--app-dropdown-surface);
  backdrop-filter: blur(var(--app-dropdown-blur)) saturate(1.35);
  -webkit-backdrop-filter: blur(var(--app-dropdown-blur)) saturate(1.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

html[data-bs-theme="dark"] .dropdown-item:hover,
html[data-bs-theme="dark"] .dropdown-item:focus {
  background: rgba(62, 207, 142, 0.15);
  color: #fff;
}

html[data-bs-theme="dark"] .dropdown-item.text-danger:hover {
  background: rgba(248, 113, 113, 0.18);
  color: #fecaca !important;
}

html[data-bs-theme="dark"] .modal-content {
  background: var(--app-glass-2);
  backdrop-filter: blur(var(--app-blur));
  -webkit-backdrop-filter: blur(var(--app-blur));
  border: 1px solid var(--app-glass-border);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.55);
}

html[data-bs-theme="dark"] .offcanvas,
html[data-bs-theme="dark"] .offcanvas-header,
html[data-bs-theme="dark"] .offcanvas-body {
  background: rgba(12, 20, 18, 0.94);
  backdrop-filter: blur(var(--app-blur));
  -webkit-backdrop-filter: blur(var(--app-blur));
}

/* Формы */
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select {
  background: rgba(0, 0, 0, 0.25);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus {
  background: rgba(0, 0, 0, 0.35);
  border-color: rgba(62, 207, 142, 0.45);
  box-shadow: 0 0 0 0.2rem var(--app-accent-dim);
}

html[data-bs-theme="dark"] .form-floating > .form-control:focus ~ label,
html[data-bs-theme="dark"] .form-floating > .form-control:not(:placeholder-shown) ~ label {
  color: rgba(167, 243, 208, 0.9);
}

html[data-bs-theme="dark"] .input-group-text {
  background: rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.75);
}

/* Таблицы */
html[data-bs-theme="dark"] .table {
  --bs-table-bg: transparent;
  --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
  --bs-table-hover-bg: rgba(62, 207, 142, 0.06);
}

html[data-bs-theme="dark"] .table > :not(caption) > * > * {
  border-bottom-color: rgba(255, 255, 255, 0.06);
}

/* Алерты — чуть прозрачнее */
html[data-bs-theme="dark"] .alert {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-width: 1px;
}

/* Нав-таблетки (гильдии и др.) */
html[data-bs-theme="dark"] .nav-pills .nav-link {
  color: rgba(255, 255, 255, 0.72);
}

html[data-bs-theme="dark"] .nav-pills .nav-link.active,
html[data-bs-theme="dark"] .nav-pills .show > .nav-link {
  background: linear-gradient(135deg, rgba(62, 207, 142, 0.35) 0%, rgba(16, 185, 129, 0.25) 100%);
  border: 1px solid rgba(62, 207, 142, 0.35);
  color: #ecfdf5;
  box-shadow: 0 0 20px var(--app-accent-dim);
}

html[data-bs-theme="dark"] .nav-tabs .nav-link.active {
  background: var(--app-glass-1);
  border-color: var(--app-glass-border);
  color: #fff;
}

/* Ссылки в контенте */
html[data-bs-theme="dark"] main a:not(.btn):not(.nav-link):not(.dropdown-item):not(.list-group-item) {
  color: var(--app-link);
}

html[data-bs-theme="dark"] main a:not(.btn):not(.nav-link):not(.dropdown-item):not(.list-group-item):hover {
  color: var(--app-link-hover);
}

/* Код */
html[data-bs-theme="dark"] code {
  color: #86efac;
  background: rgba(0, 0, 0, 0.35);
  padding: 0.1em 0.35em;
  border-radius: 0.25rem;
}

/* Прогресс-бары */
html[data-bs-theme="dark"] .progress {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

/* Бейджи */
html[data-bs-theme="dark"] .badge.text-bg-secondary {
  background: rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Кнопки outline на тёмном фоне */
html[data-bs-theme="dark"] .btn-outline-light {
  border-color: rgba(255, 255, 255, 0.25);
  color: rgba(255, 255, 255, 0.92);
}

html[data-bs-theme="dark"] .btn-outline-light:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}

html[data-bs-theme="dark"] .btn-light {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.2);
  color: #ecfdf5;
}

html[data-bs-theme="dark"] .btn-light:hover {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
}

/* Скроллбары (WebKit) */
html[data-bs-theme="dark"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html[data-bs-theme="dark"] ::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.2);
}

html[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
  border-radius: 6px;
}

html[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(62, 207, 142, 0.35);
}

@media (prefers-reduced-transparency: reduce) {
  html[data-bs-theme="dark"] .card,
  html[data-bs-theme="dark"] .app-navbar,
  html[data-bs-theme="dark"] .dropdown-menu,
  html[data-bs-theme="dark"] .modal-content,
  html[data-bs-theme="dark"] .bg-white,
  html[data-bs-theme="dark"] .bg-light {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html[data-bs-theme="dark"] .list-group-item.list-group-item-action.py-2.small.text-start,
  html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100 {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html[data-bs-theme="dark"] .dropdown-menu {
    background: rgba(16, 26, 22, 0.98);
  }

  html[data-bs-theme="dark"] .list-group-item.list-group-item-action.py-2.small.text-start {
    background: rgba(32, 44, 40, 0.95);
  }

  html[data-bs-theme="dark"] .btn.btn-sm.btn-outline-dark.w-100 {
    background: rgba(40, 52, 48, 0.92);
  }
}