/* Dark Mode Base Styles */
body.dark-mode {
    background-color: #121212;
    color: #e0e0e0;
}

/* Header & Navigation */
.dark-mode .header {
    background-color: #1e1e1e !important;
    border-bottom: 1px solid #333;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.dark-mode .sidebar-nav-wrapper {
    background-color: #1e1e1e;
    border-right: 1px solid #333;
}

.dark-mode .sidebar-nav li a {
    color: #b0b0b0;
}

.dark-mode .sidebar-nav li a:hover,
.dark-mode .sidebar-nav li a.active {
    color: #ffffff;
    background-color: #2d2d2d;
}

/* Cards & Tables */
.dark-mode .card {
    background-color: #1e1e1e;
    border-color: #333;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
}

.dark-mode .table {
    color: #e0e0e0;
    background-color: #1e1e1e;
}

.dark-mode .table th {
    background-color: #252525;
    border-color: #333;
}

.dark-mode .table td {
    border-color: #333;
}

/* Forms & Inputs */
.dark-mode .form-control,
.dark-mode .form-select {
    background-color: #2d2d2d;
    border-color: #444;
    color: #e0e0e0;
}

.dark-mode .form-control:focus,
.dark-mode .form-select:focus {
    background-color: #333;
    border-color: #555;
    color: #ffffff;
    box-shadow: 0 0 0 0.25rem rgba(70, 70, 70, 0.25);
}

/* Buttons */
.dark-mode .btn-light {
    background-color: #333;
    border-color: #444;
    color: #e0e0e0;
}

.dark-mode .btn-light:hover {
    background-color: #3d3d3d;
    border-color: #555;
    color: #ffffff;
}

.dark-mode .btn-outline-secondary {
    border-color: #555;
    color: #b0b0b0;
}

.dark-mode .btn-outline-secondary:hover {
    background-color: #333;
    color: #ffffff;
}

/* Dropdowns */
.dark-mode .dropdown-menu {
    background-color: #252525;
    border-color: #333;
}

.dark-mode .dropdown-item {
    color: #d0d0d0;
}

.dark-mode .dropdown-item:hover,
.dark-mode .dropdown-item:focus {
    background-color: #333;
    color: #ffffff;
}

/* Text Colors */
.dark-mode .text-dark {
    color: #e0e0e0 !important;
}

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

.dark-mode .text-black-50 {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* Badges */
.dark-mode .badge.bg-light {
    background-color: #333 !important;
    color: #e0e0e0 !important;
}

/* Toggle Button Styles */
.theme-toggle-box button {
    transition: all 0.3s ease;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.theme-toggle-box button:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.dark-mode .theme-toggle-box button:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

#theme-icon {
    font-size: 1.2rem;
    transition: transform 0.3s ease, color 0.3s ease;
}

.dark-mode #theme-icon {
    color: #ffc107;
    transform: rotate(180deg);
}