/* ========================================
   Dark Mode Optimizations for UTSS
   ======================================== */

/* Force hide logo-dark in dark mode */
[data-layout-mode="dark"] .logo-dark {
    display: none !important;
}

[data-layout-mode="dark"] .logo-light {
    display: block !important;
}

/* Force hide logo-light in light mode */
[data-layout-mode="light"] .logo-dark {
    display: block !important;
}

[data-layout-mode="light"] .logo-light {
    display: none !important;
}

/* Logo adjustments for better visibility in dark mode */
[data-layout-mode="dark"] .navbar-brand-box {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    padding: 10px;
}

[data-layout-mode="dark"] .logo img {
    filter: brightness(1.1) contrast(1.1);
}

/* Sidebar dark mode improvements */
[data-layout-mode="dark"] .vertical-menu {
    background: #1a1d21 !important;
}

[data-layout-mode="dark"] .modern-sidebar {
    background: linear-gradient(180deg, #1a1d21 0%, #0f1113 100%) !important;
}

/* Menu items dark mode */
[data-layout-mode="dark"] .modern-sidebar #sidebar-menu ul li a {
    background: rgba(255, 255, 255, 0.03) !important;
    color: #e9ecef !important;
}

[data-layout-mode="dark"] .modern-sidebar #sidebar-menu ul li a:hover {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.3) 0%, rgba(118, 75, 162, 0.3) 100%) !important;
}

[data-layout-mode="dark"] .modern-sidebar #sidebar-menu ul li.mm-active > a {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.4) 0%, rgba(118, 75, 162, 0.4) 100%) !important;
}

[data-layout-mode="dark"] .modern-sidebar #sidebar-menu ul li a .menu-label {
    color: #e9ecef !important;
}

[data-layout-mode="dark"] .modern-sidebar #sidebar-menu ul li a:hover .menu-label {
    color: #ffffff !important;
}

/* Menu title dark mode */
[data-layout-mode="dark"] .menu-title {
    color: #adb5bd !important;
}

/* Footer dark mode */
[data-layout-mode="dark"] .footer {
    background: #1a1d21 !important;
    border-top-color: rgba(255, 255, 255, 0.1) !important;
    color: #adb5bd !important;
}

/* Cards dark mode */
[data-layout-mode="dark"] .card {
    background-color: #1e2125 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-layout-mode="dark"] .card-header {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.8) 0%, rgba(118, 75, 162, 0.8) 100%) !important;
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

/* Table dark mode */
[data-layout-mode="dark"] .table {
    color: #e9ecef !important;
}

[data-layout-mode="dark"] .table thead th {
    background-color: #1a1d21 !important;
    color: #adb5bd !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-layout-mode="dark"] .table tbody tr {
    border-color: rgba(255, 255, 255, 0.05) !important;
}

[data-layout-mode="dark"] .table tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.03) !important;
}

/* Form elements dark mode */
[data-layout-mode="dark"] .form-control {
    background-color: #1a1d21 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #e9ecef !important;
}

[data-layout-mode="dark"] .form-control:focus {
    background-color: #1e2125 !important;
    border-color: #667eea !important;
    color: #ffffff !important;
}

[data-layout-mode="dark"] .form-label {
    color: #adb5bd !important;
}

/* Buttons dark mode */
[data-layout-mode="dark"] .btn-light {
    background-color: #2b2f33 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #e9ecef !important;
}

[data-layout-mode="dark"] .btn-light:hover {
    background-color: #3a3f44 !important;
    color: #ffffff !important;
}

/* Modal dark mode */
[data-layout-mode="dark"] .modal-content {
    background-color: #1e2125 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-layout-mode="dark"] .modal-header {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.2) 0%, rgba(118, 75, 162, 0.2) 100%) !important;
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

[data-layout-mode="dark"] .modal-footer {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

/* Dropdown dark mode */
[data-layout-mode="dark"] .dropdown-menu {
    background-color: #1e2125 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-layout-mode="dark"] .dropdown-item {
    color: #adb5bd !important;
}

[data-layout-mode="dark"] .dropdown-item:hover {
    background-color: rgba(102, 126, 234, 0.2) !important;
    color: #ffffff !important;
}

/* Topbar dark mode */
[data-layout-mode="dark"] .topbar {
    background: #1a1d21 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-layout-mode="dark"] .header-item {
    color: #adb5bd !important;
}

[data-layout-mode="dark"] .header-item:hover {
    color: #ffffff !important;
}

/* Page content dark mode */
[data-layout-mode="dark"] .page-content {
    background-color: #0f1113 !important;
}

[data-layout-mode="dark"] body {
    background-color: #0f1113 !important;
    color: #e9ecef !important;
}

/* Breadcrumb dark mode */
[data-layout-mode="dark"] .breadcrumb {
    background-color: transparent !important;
}

[data-layout-mode="dark"] .breadcrumb-item {
    color: #adb5bd !important;
}

[data-layout-mode="dark"] .breadcrumb-item.active {
    color: #667eea !important;
}

/* Badge dark mode */
[data-layout-mode="dark"] .badge {
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Alert dark mode */
[data-layout-mode="dark"] .alert {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Text colors dark mode */
[data-layout-mode="dark"] .text-muted {
    color: #6c757d !important;
}

[data-layout-mode="dark"] h1,
[data-layout-mode="dark"] h2,
[data-layout-mode="dark"] h3,
[data-layout-mode="dark"] h4,
[data-layout-mode="dark"] h5,
[data-layout-mode="dark"] h6 {
    color: #e9ecef !important;
}

/* Stat cards dark mode */
[data-layout-mode="dark"] .stat-card {
    background: #1e2125 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Pagination dark mode */
[data-layout-mode="dark"] .page-link {
    background-color: #1e2125 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #adb5bd !important;
}

[data-layout-mode="dark"] .page-link:hover {
    background-color: #667eea !important;
    border-color: #667eea !important;
    color: #ffffff !important;
}

[data-layout-mode="dark"] .page-item.active .page-link {
    background-color: #667eea !important;
    border-color: #667eea !important;
}

/* Scrollbar dark mode */
[data-layout-mode="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-layout-mode="dark"] ::-webkit-scrollbar-track {
    background: #1a1d21;
}

[data-layout-mode="dark"] ::-webkit-scrollbar-thumb {
    background: #3a3f44;
    border-radius: 4px;
}

[data-layout-mode="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #4a5057;
}