/**
 * EmpowerHR - Dark Mode Styles
 * Complete dark theme for the application
 * Version: 1.0.0
 */

[data-theme="dark"] {
    /* Override colors for dark mode */
    --gray-50: #111827;
    --gray-100: #1f2937;
    --gray-200: #374151;
    --gray-300: #4b5563;
    --gray-400: #6b7280;
    --gray-500: #9ca3af;
    --gray-600: #d1d5db;
    --gray-700: #e5e7eb;
    --gray-800: #f3f4f6;
    --gray-900: #f9fafb;
    --dark: #f9fafb;
    --white: #1f2937;
}

[data-theme="dark"] body {
    background-color: #0f172a;
    color: var(--gray-800);
}

[data-theme="dark"] .card {
    background: var(--white);
    border-color: var(--gray-200);
}

[data-theme="dark"] .card-header {
    border-color: var(--gray-200);
}

[data-theme="dark"] .app-header {
    background: var(--white);
    border-color: var(--gray-200);
}

[data-theme="dark"] .sidebar {
    background: #0f172a;
    border-left: 1px solid var(--gray-200);
}

[data-theme="dark"] .sidebar-brand {
    border-color: var(--gray-200);
}

[data-theme="dark"] .table thead th {
    background: var(--gray-100);
    color: var(--gray-500);
}

[data-theme="dark"] .table tbody td {
    border-color: var(--gray-200);
    color: var(--gray-700);
}

[data-theme="dark"] .table tbody tr:hover {
    background: var(--gray-100);
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background: var(--white);
    border-color: var(--gray-300);
    color: var(--gray-800);
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
    background: var(--white);
}

[data-theme="dark"] .form-control::placeholder {
    color: var(--gray-500);
}

[data-theme="dark"] .modal {
    background: var(--white);
}

[data-theme="dark"] .dropdown-menu {
    background: var(--white);
    border-color: var(--gray-200);
}

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

[data-theme="dark"] .dropdown-item:hover {
    background: var(--gray-100);
    color: var(--gray-900);
}

[data-theme="dark"] .toast {
    background: var(--white);
}

[data-theme="dark"] .pagination-link {
    background: var(--white);
    border-color: var(--gray-200);
    color: var(--gray-600);
}

[data-theme="dark"] .pagination-link:hover {
    background: var(--gray-100);
    color: var(--gray-800);
}

[data-theme="dark"] .header-search input {
    background: var(--gray-100);
    border-color: var(--gray-200);
    color: var(--gray-800);
}

[data-theme="dark"] .header-search input:focus {
    background: var(--white);
}

[data-theme="dark"] .empty-state-icon {
    background: var(--gray-100);
    color: var(--gray-400);
}

[data-theme="dark"] .timeline-content {
    background: var(--white);
    border-color: var(--gray-200);
}

[data-theme="dark"] .input-group-text {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-600);
}

[data-theme="dark"] .tabs {
    border-color: var(--gray-200);
}

[data-theme="dark"] .tab {
    color: var(--gray-500);
}

[data-theme="dark"] .tab:hover {
    color: var(--gray-700);
}

[data-theme="dark"] .user-dropdown:hover {
    background: var(--gray-100);
}

[data-theme="dark"] .stat-card .stat-value {
    color: var(--gray-900);
}

[data-theme="dark"] .card-footer {
    background: var(--gray-100);
    border-color: var(--gray-100);
}

[data-theme="dark"] .progress {
    background: var(--gray-200);
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--gray-100);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--gray-300);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--gray-400);
}