/**
 * Dark Theme for VPNd.io Dashboard
 * Based on GitHub Dark color scheme for better readability
 */

/* Bootstrap 5 Dark Mode Override */
[data-bs-theme="dark"] {
  /* Основные цвета */
  --bs-body-bg: #0d1117;
  --bs-body-color: #c9d1d9;
  --bs-border-color: #30363d;

  /* Компоненты */
  --bs-card-bg: #161b22;
  --bs-card-border-color: #30363d;

  /* Кастомные переменные */
  --vpnd-surface: #21262d;
  --vpnd-header-bg: #010409;
  --vpnd-link: #58a6ff;
  --vpnd-link-hover: #79c0ff;
}

/* Header */
[data-bs-theme="dark"] #header {
  background: var(--vpnd-header-bg);
  border-bottom-color: var(--bs-border-color);
  box-shadow: 0 1px 0 rgba(255,255,255,0.1);
}

[data-bs-theme="dark"] #header.header-scrolled {
  box-shadow: 0px 2px 15px rgba(0,0,0,0.5);
}

/* Logo */
[data-bs-theme="dark"] #header .logo {
  border: none;
  color: var(--bs-body-color);
}

/* Карточки ключей */
[data-bs-theme="dark"] .card {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-card-border-color);
}

[data-bs-theme="dark"] .card:hover {
  border-color: #58a6ff;
  transition: border-color 0.2s;
}

[data-bs-theme="dark"] .card-body {
  color: var(--bs-body-color);
}

/* Исправление bg-light элементов */
[data-bs-theme="dark"] .bg-light {
  background-color: var(--vpnd-surface) !important;
}

[data-bs-theme="dark"] .text-bg-light {
  background-color: var(--vpnd-surface) !important;
  color: var(--bs-body-color) !important;
}

/* Кнопки */
[data-bs-theme="dark"] .btn-light {
  background-color: var(--vpnd-surface);
  border-color: var(--bs-border-color);
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .btn-light:hover {
  background-color: #30363d;
  border-color: #484f58;
  color: #f0f6fc;
}

[data-bs-theme="dark"] .btn-primary {
  background-color: #238636;
  border-color: #238636;
}

[data-bs-theme="dark"] .btn-primary:hover {
  background-color: #2ea043;
  border-color: #2ea043;
}

/* Dropdown меню */
[data-bs-theme="dark"] .dropdown-menu {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-border-color);
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}

[data-bs-theme="dark"] .dropdown-item {
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dropdown-item:hover {
  background-color: var(--vpnd-surface);
  color: #f0f6fc;
}

[data-bs-theme="dark"] .dropdown-divider {
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .dropdown-header {
  color: #8b949e;
}

[data-bs-theme="dark"] .dropdown-submenu .dropdown-menu {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-border-color);
}

/* Алерты - сохраняем читаемость */
[data-bs-theme="dark"] .alert-info {
  background-color: #0969da1a;
  border-color: #0969da33;
  color: #79c0ff;
}

[data-bs-theme="dark"] .alert-info .alert-link {
  color: #58a6ff;
}

[data-bs-theme="dark"] .alert-success {
  background-color: #1a7f371a;
  border-color: #1a7f3733;
  color: #7ee787;
}

[data-bs-theme="dark"] .alert-danger {
  background-color: #f851491a;
  border-color: #f8514933;
  color: #ff8182;
}

[data-bs-theme="dark"] .alert-danger .alert-link {
  color: #ff8182;
}

[data-bs-theme="dark"] .alert-warning {
  background-color: #d297251a;
  border-color: #d2972533;
  color: #ffa657;
}

[data-bs-theme="dark"] .alert-primary {
  background-color: #0969da1a;
  border-color: #0969da33;
  color: #79c0ff;
}

/* Text utilities */
[data-bs-theme="dark"] .text-muted {
  color: #8b949e !important;
}

[data-bs-theme="dark"] .text-primary {
  color: #58a6ff !important;
}

[data-bs-theme="dark"] .text-danger {
  color: #ff8182 !important;
}

[data-bs-theme="dark"] .text-success {
  color: #7ee787 !important;
}

/* Badges */
[data-bs-theme="dark"] .badge {
  font-weight: 500;
}

[data-bs-theme="dark"] .badge.bg-success {
  background-color: #238636 !important;
}

[data-bs-theme="dark"] .badge.bg-info {
  background-color: #1f6feb !important;
}

/* Forms */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
  background-color: var(--vpnd-surface);
  border-color: var(--bs-border-color);
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
  background-color: var(--vpnd-surface);
  border-color: #58a6ff;
  color: var(--bs-body-color);
  box-shadow: 0 0 0 0.25rem rgba(88,166,255,0.25);
}

[data-bs-theme="dark"] .form-control::placeholder {
  color: #8b949e;
}

[data-bs-theme="dark"] .form-label {
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .form-check-input {
  background-color: var(--vpnd-surface);
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .form-check-input:checked {
  background-color: #238636;
  border-color: #238636;
}

[data-bs-theme="dark"] .form-switch .form-check-input {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%238b949e'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-switch .form-check-input:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

/* Tabs */
[data-bs-theme="dark"] .nav-tabs {
  border-bottom-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .nav-tabs .nav-link {
  color: #8b949e;
  border-color: transparent;
}

[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
  border-color: transparent transparent var(--bs-border-color);
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .nav-tabs .nav-link.active {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-card-bg);
  color: var(--bs-body-color);
}

/* Navigation */
[data-bs-theme="dark"] .navbar .navbar-nav .nav-link {
  color: #8b949e;
}

[data-bs-theme="dark"] .navbar .navbar-nav .nav-link:hover,
[data-bs-theme="dark"] .navbar .navbar-nav .nav-link.active {
  color: var(--bs-body-color);
}

/* Скрытые ключи секция */
[data-bs-theme="dark"] .hidden-keys-section {
  background-color: var(--vpnd-surface);
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] #toggle-hidden-section {
  background-color: var(--vpnd-surface) !important;
  color: var(--bs-body-color);
}

/* Модальные окна */
[data-bs-theme="dark"] .modal-content {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .modal-header {
  border-bottom-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .modal-footer {
  border-top-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .btn-close {
  filter: invert(1);
}

/* Tables */
[data-bs-theme="dark"] .table {
  color: var(--bs-body-color);
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(255,255,255,0.02);
}

[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * {
  background-color: rgba(255,255,255,0.04);
}

/* Links */
[data-bs-theme="dark"] a {
  color: var(--vpnd-link);
}

[data-bs-theme="dark"] a:hover {
  color: var(--vpnd-link-hover);
}

/* Scrollbar (for Webkit browsers) */
[data-bs-theme="dark"] ::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--vpnd-surface);
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #484f58;
  border-radius: 6px;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #6e7681;
}

/* Theme toggle button animation */
.theme-toggle-btn {
  transition: transform 0.3s ease;
}

.theme-toggle-btn:hover {
  transform: rotate(20deg);
}

/* Extend page styles */
[data-bs-theme="dark"] .discount-badge {
  background: rgba(238, 77, 45, 0.15) !important;
  color: #ff8182;
}

[data-bs-theme="dark"] .tariff-header {
  border-bottom: 1px solid var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .tariff-option {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .tariff-option:hover {
  border-color: #58a6ff;
}

[data-bs-theme="dark"] .tariff-option.active,
[data-bs-theme="dark"] .tariff-option input:checked + .card-body {
  border-color: #58a6ff;
  box-shadow: 0 0 0 0.25rem rgba(88,166,255,0.25);
}

/* Currency switcher */
[data-bs-theme="dark"] #currencySwitcher span {
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] #currencySwitcher span.active {
  color: #58a6ff;
}

/* Best choice badge */
[data-bs-theme="dark"] .bg-danger {
  background-color: rgba(248, 81, 73, 0.9) !important;
}

/* Selected tariff and payment options */
[data-bs-theme="dark"] .tariff-option.selected,
[data-bs-theme="dark"] .payment-option.selected {
  background: rgba(88, 166, 255, 0.1) !important;
  border-color: #58a6ff !important;
}

/* Active menu item */
[data-bs-theme="dark"] nav.navbar ul a.active {
  color: var(--bs-body-color) !important;
  background-color: rgba(88, 166, 255, 0.15) !important;
}

/* Smooth transition for theme switching */
* {
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

/* Prevent transition on page load */
.preload * {
  transition: none !important;
}