/* Dark Mode Styles */

/* Immediate Theme Loading Classes (Prevent Flash) */
html.dark-theme,
html.dark-mode-loading {
  background-color: #1a1a1a !important;
  color: #e0e0e0 !important;
}

html.light-theme {
  background-color: #ffffff !important;
  color: #212529 !important;
}

/* Main Dark Mode Styles */
.dark-mode {
  --bs-body-bg: #1a1a1a;
  --bs-body-color: #e0e0e0;
  --bs-border-color: #333;
  --bs-light-rgb: 51, 51, 51;
  background-color: #1a1a1a !important;
  color: #e0e0e0 !important;
}

.dark-mode .content-header {
  background: #2a2a2a !important;
  border-bottom-color: #444 !important;
}

.dark-mode .card {
  background-color: #2a2a2a !important;
  border-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .card-header {
  background-color: #333 !important;
  border-bottom-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .form-control,
.dark-mode .form-select {
  background-color: #333 !important;
  border-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .form-control:focus,
.dark-mode .form-select:focus {
  background-color: #3a3a3a !important;
  border-color: #5a5a5a !important;
  color: #e0e0e0 !important;
}

.dark-mode .form-control::placeholder {
  color: #999 !important;
}

.dark-mode .btn {
  border-color: #444 !important;
}

.dark-mode .table {
  color: #e0e0e0 !important;
  border-color: #444 !important;
}

.dark-mode .table thead th {
  background-color: #333 !important;
  color: #e0e0e0 !important;
  border-color: #444 !important;
}

.dark-mode .table tbody tr:hover {
  background-color: #333 !important;
}

.dark-mode .sidebar {
  background-color: #1f1f1f !important;
}

/* Brand Logo Styles */
.dark-mode .brand-link {
  background-color: #1f1f1f !important;
  border-bottom-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .brand-link:hover {
  background-color: #2a2a2a !important;
}

.dark-mode .brand-text {
  color: #e0e0e0 !important;
}

.dark-mode .main-sidebar {
  background-color: #1f1f1f !important;
}

.dark-mode .sidebar-light-primary {
  background-color: #1f1f1f !important;
}

/* User Panel Styles */
.dark-mode .user-panel {
  border-bottom-color: #444 !important;
}

.dark-mode .user-panel .info a {
  color: #e0e0e0 !important;
}

.dark-mode .user-panel .info a:hover {
  color: #fff !important;
}

/* Sidebar Menu Items */
.dark-mode .nav-sidebar > .nav-item > .nav-link {
  color: #b0b0b0 !important;
}

.dark-mode .nav-sidebar > .nav-item > .nav-link:hover {
  background-color: #2a2a2a !important;
  color: #fff !important;
}

.dark-mode .nav-sidebar > .nav-item.menu-open > .nav-link,
.dark-mode .nav-sidebar > .nav-item:hover > .nav-link,
.dark-mode .nav-sidebar > .nav-item > .nav-link.active {
  background-color: #333 !important;
  color: #fff !important;
}

.dark-mode .nav-treeview > .nav-item > .nav-link {
  color: #999 !important;
}

.dark-mode .nav-treeview > .nav-item > .nav-link:hover,
.dark-mode .nav-treeview > .nav-item > .nav-link.active {
  background-color: #2a2a2a !important;
  color: #fff !important;
}

.dark-mode .nav-sidebar .nav-link {
  color: #b0b0b0 !important;
}

.dark-mode .nav-sidebar .nav-link:hover,
.dark-mode .nav-sidebar .nav-link.active {
  background-color: #333 !important;
  color: #fff !important;
}

.dark-mode .navbar-light {
  background-color: #2a2a2a !important;
  border-bottom-color: #444 !important;
}

.dark-mode .navbar-light .nav-link {
  color: #b0b0b0 !important;
}

.dark-mode .navbar-light .nav-link:hover {
  color: #fff !important;
}

.dark-mode .dropdown-menu {
  background-color: #2a2a2a !important;
  border-color: #444 !important;
}

.dark-mode .dropdown-item {
  color: #e0e0e0 !important;
}

.dark-mode .dropdown-item:hover,
.dark-mode .dropdown-item.active {
  background-color: #3a3a3a !important;
  color: #fff !important;
}

.dark-mode .breadcrumb {
  background-color: #2a2a2a !important;
  border-color: #444 !important;
}

.dark-mode .breadcrumb-item.active {
  color: #e0e0e0 !important;
}

.dark-mode .breadcrumb-item a {
  color: #0dcaf0 !important;
}

.dark-mode .alert {
  border-color: #444 !important;
}

.dark-mode .badge {
  background-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .text-muted {
  color: #999 !important;
}

.dark-mode .border {
  border-color: #444 !important;
}

.dark-mode .modal-content {
  background-color: #2a2a2a !important;
  border-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .modal-header {
  border-bottom-color: #444 !important;
}

.dark-mode .modal-footer {
  border-top-color: #444 !important;
}

.dark-mode .close {
  color: #e0e0e0 !important;
}

.dark-mode .pagination .page-link {
  background-color: #333 !important;
  border-color: #444 !important;
  color: #e0e0e0 !important;
}

.dark-mode .pagination .page-link:hover {
  background-color: #3a3a3a !important;
  color: #fff !important;
}