html.dark-mode body {
  background: #020617 !important;
  color: #e5edf8 !important;
}

html.dark-mode body::after {
  background: rgba(2, 6, 23, .48) !important;
}

html.dark-mode .glass-app {
  background: transparent !important;
}

html.dark-mode .glass-app > .min-w-0,
html.dark-mode .auth-screen > section,
html.dark-mode .legal-card,
html.dark-mode .reset-card > section {
  background: rgba(8, 13, 26, .94) !important;
  color: #e5edf8 !important;
  backdrop-filter: blur(22px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(120%) !important;
}

html.dark-mode .sidebar,
html.dark-mode .brand-panel,
html.dark-mode .mobile-menu-panel {
  background: rgba(15, 23, 42, .68) !important;
  color: #e5edf8 !important;
  border-color: rgba(148, 163, 184, .18) !important;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .08) !important;
}

html.dark-mode .mobile-system-header {
  background: rgba(15, 23, 42, .72) !important;
  color: #e5edf8 !important;
  border-color: rgba(148, 163, 184, .18) !important;
}

html.dark-mode .sidebar .search-field,
html.dark-mode .mobile-menu-panel .search-field,
html.dark-mode #sidebarContent .search-field,
html.dark-mode .mobile-header-search input,
html.dark-mode input,
html.dark-mode select,
html.dark-mode textarea {
  background: rgba(15, 23, 42, .68) !important;
  border-color: rgba(148, 163, 184, .24) !important;
  color: #e5edf8 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .18) !important;
}

html.dark-mode input::placeholder,
html.dark-mode textarea::placeholder {
  color: rgba(203, 213, 225, .72) !important;
}

html.dark-mode .search-field:focus,
html.dark-mode input:focus,
html.dark-mode select:focus,
html.dark-mode textarea:focus {
  background: rgba(15, 23, 42, .82) !important;
  border-color: #3b82f6 !important;
  box-shadow:
    0 0 0 3px rgba(59, 130, 246, .22),
    0 10px 28px rgba(0, 0, 0, .26) !important;
}

html.dark-mode .bg-white,
html.dark-mode [class*="bg-white/"],
html.dark-mode [class*="bg-white\\["],
html.dark-mode article.rounded-\[14px\],
html.dark-mode .shadow-card {
  background-color: rgba(15, 23, 42, .74) !important;
  color: #e5edf8 !important;
}

html.dark-mode .bg-slate-50,
html.dark-mode .bg-slate-100,
html.dark-mode [class*="bg-slate-50"],
html.dark-mode [class*="bg-slate-100"] {
  background-color: rgba(30, 41, 59, .74) !important;
}

html.dark-mode .bg-blue-50,
html.dark-mode [class*="bg-blue-50"] {
  background-color: rgba(30, 64, 175, .18) !important;
}

html.dark-mode .text-slate-950,
html.dark-mode .text-slate-900,
html.dark-mode .text-slate-800,
html.dark-mode .text-slate-700,
html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3,
html.dark-mode strong {
  color: #f8fafc !important;
}

html.dark-mode .text-slate-600,
html.dark-mode .text-slate-500,
html.dark-mode .text-slate-400,
html.dark-mode p,
html.dark-mode small {
  color: #bac6d8 !important;
}

html.dark-mode .text-blue-700,
html.dark-mode .text-blue-600 {
  color: #60a5fa !important;
}

html.dark-mode .border-slate-900\/10,
html.dark-mode .border-slate-900\/5,
html.dark-mode [class*="border-slate-900"] {
  border-color: rgba(148, 163, 184, .20) !important;
}

html.dark-mode .ring-slate-900\/5,
html.dark-mode [class*="ring-slate-900"] {
  --tw-ring-color: rgba(148, 163, 184, .16) !important;
}

html.dark-mode .nav-link.active,
html.dark-mode .settings-tab.active,
html.dark-mode .theme-selected {
  background: linear-gradient(135deg, #0b7cff, #005bea) !important;
  color: #fff !important;
  border-color: transparent !important;
}

html.dark-mode .sidebar a:not(.active):not(:hover),
html.dark-mode .mobile-menu-panel a:not(.active):not(:hover),
html.dark-mode .nav-link:not(.active):not(:hover) {
  background: transparent !important;
  color: #e5edf8 !important;
}

html.dark-mode .nav-link:not(.active):hover,
html.dark-mode .settings-tab:not(.active):hover,
html.dark-mode a:hover {
  background-color: rgba(255, 255, 255, .08) !important;
  color: #f8fafc !important;
}

html.dark-mode .settings-tab,
html.dark-mode [data-theme-choice] {
  background: rgba(15, 23, 42, .54) !important;
  border-color: rgba(148, 163, 184, .18) !important;
  color: #dbeafe !important;
}

html.dark-mode [data-theme-choice].theme-selected {
  background: rgba(37, 99, 235, .24) !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
  box-shadow:
    0 0 0 2px rgba(59, 130, 246, .85),
    0 12px 30px rgba(0, 0, 0, .24) !important;
}

html.dark-mode button:not(.nav-link):not(.settings-tab):not([class*="bg-blue"]):not([data-theme-choice]),
html.dark-mode .mobile-search-toggle,
html.dark-mode .mobile-menu-close {
  background-color: rgba(15, 23, 42, .68) !important;
  border-color: rgba(148, 163, 184, .20) !important;
  color: #e5edf8 !important;
}

html.dark-mode .divide-slate-900\/10 > :not([hidden]) ~ :not([hidden]) {
  border-color: rgba(148, 163, 184, .18) !important;
}

html.dark-mode footer {
  border-color: rgba(148, 163, 184, .18) !important;
  color: rgba(226, 232, 240, .74) !important;
}

html.dark-mode .hero {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}

html.dark-mode .toggle input + span {
  background: rgba(71, 85, 105, .9) !important;
}

html.dark-mode .toggle input:checked + span {
  background: #0b7cff !important;
}

html.dark-mode .mac-scroll {
  scrollbar-color: #0b7cff rgba(15, 23, 42, .38);
}

@media (max-width: 1023px) {
  html.dark-mode .mobile-menu-panel {
    background: rgba(15, 23, 42, .82) !important;
  }
}

[data-theme-choice].theme-selected {
  border-color: #0b7cff !important;
  box-shadow:
    0 0 0 2px rgba(11, 124, 255, .70),
    0 12px 26px rgba(15, 23, 42, .12) !important;
}