/* * Dark Mode overrides for AdminKit v3.0.2 * Applied when is set */ /* ── CSS variable overrides (AdminKit reads these for body) ── */ [data-bs-theme="dark"] { --bs-body-bg: #151828; --bs-body-color: #c8d0e8; --bs-body-bg-rgb: 21, 24, 40; --bs-border-color: #2f3350; color-scheme: dark; } /* ── Body & page wrapper ── */ [data-bs-theme="dark"] body { background-color: #151828 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .wrapper { background: #0f1120 !important; } [data-bs-theme="dark"] .main { background: #151828 !important; } /* ── Headings ── */ [data-bs-theme="dark"] h1, [data-bs-theme="dark"] h2, [data-bs-theme="dark"] h3, [data-bs-theme="dark"] h4, [data-bs-theme="dark"] h5, [data-bs-theme="dark"] h6, [data-bs-theme="dark"] .h1, [data-bs-theme="dark"] .h2, [data-bs-theme="dark"] .h3, [data-bs-theme="dark"] .h4, [data-bs-theme="dark"] .h5, [data-bs-theme="dark"] .h6 { color: #dde4f5 !important; } [data-bs-theme="dark"] strong { color: inherit; } /* ── Navbar ── */ [data-bs-theme="dark"] .navbar-bg { background: #1a1d2f !important; border-bottom: 1px solid #2a2e47 !important; box-shadow: 0 1px 6px rgba(0,0,0,0.4) !important; } [data-bs-theme="dark"] .clock-display { background: #22263d !important; color: #8892aa !important; } [data-bs-theme="dark"] .clock-icon { color: #5a6280 !important; } [data-bs-theme="dark"] .username { color: #c0c8e0 !important; } [data-bs-theme="dark"] .dark-toggle-btn { color: #7a82a0; } [data-bs-theme="dark"] .dark-toggle-btn:hover { background: #272b42; color: #dde4f5; } /* ── Sidebar ── */ [data-bs-theme="dark"] .sidebar, [data-bs-theme="dark"] .sidebar-content { background: #111324 !important; } [data-bs-theme="dark"] .sidebar-brand { background: #111324 !important; color: #dde4f5 !important; } [data-bs-theme="dark"] .sidebar-brand:hover { color: #fff !important; } [data-bs-theme="dark"] .sidebar-link, [data-bs-theme="dark"] a.sidebar-link { background: #111324 !important; color: rgba(190, 200, 228, 0.55) !important; } [data-bs-theme="dark"] .sidebar-link:hover, [data-bs-theme="dark"] a.sidebar-link:hover { background: rgba(255,255,255,0.05) !important; color: #dde4f5 !important; } [data-bs-theme="dark"] .sidebar-item.active > .sidebar-link, [data-bs-theme="dark"] .sidebar-item.active .sidebar-link:hover { background: linear-gradient(90deg, rgba(59,125,221,.18), rgba(59,125,221,.12) 50%, transparent) !important; border-left-color: #3b7ddd !important; color: #7cb5f8 !important; } [data-bs-theme="dark"] .sidebar-header { color: #3e445e !important; background: transparent !important; } /* ── Cards ── */ [data-bs-theme="dark"] .card { background-color: #1e2235 !important; border-color: #2a2e47 !important; } [data-bs-theme="dark"] .card-header { background-color: #1a1e32 !important; border-bottom-color: #2a2e47 !important; color: #c0c8e0 !important; } [data-bs-theme="dark"] .card-footer { background-color: #1a1e32 !important; border-top-color: #2a2e47 !important; } [data-bs-theme="dark"] .card-title { color: #dde4f5 !important; } [data-bs-theme="dark"] .card-body { color: #c8d0e8; } /* ── Modals ── */ [data-bs-theme="dark"] .modal-content { background-color: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .modal-header { background-color: #1a1e32 !important; border-bottom-color: #2a2e47 !important; color: #dde4f5 !important; } [data-bs-theme="dark"] .modal-footer { background-color: #1a1e32 !important; border-top-color: #2a2e47 !important; } [data-bs-theme="dark"] .modal-title { color: #dde4f5 !important; } [data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } /* ── Dropdowns ── */ [data-bs-theme="dark"] .dropdown-menu { background-color: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; box-shadow: 0 4px 16px rgba(0,0,0,0.5) !important; } [data-bs-theme="dark"] .dropdown-item { color: #b8c2dc !important; } [data-bs-theme="dark"] .dropdown-item:hover, [data-bs-theme="dark"] .dropdown-item:focus { background-color: #272b42 !important; color: #dde4f5 !important; } [data-bs-theme="dark"] .dropdown-header { color: #7a82a0 !important; } [data-bs-theme="dark"] .dropdown-divider { border-color: #2a2e47 !important; } /* ── Tables ── */ [data-bs-theme="dark"] .table { color: #c8d0e8 !important; --bs-table-bg: transparent; --bs-table-striped-bg: rgba(255,255,255,0.03); --bs-table-striped-color: #c8d0e8; --bs-table-hover-bg: rgba(255,255,255,0.05); --bs-table-hover-color: #dde4f5; --bs-table-border-color: #2a2e47; } [data-bs-theme="dark"] .table > :not(caption) > * > * { background-color: transparent !important; border-bottom-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .table thead > tr > th { border-bottom-color: #2a2e47 !important; color: #7a82a0 !important; } [data-bs-theme="dark"] .table-hover > tbody > tr:hover > * { background-color: rgba(255,255,255,0.04) !important; color: #dde4f5 !important; } /* ── Form controls ── */ [data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select, [data-bs-theme="dark"] textarea.form-control { background-color: #12152a !important; border-color: #2f3350 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .form-control::placeholder { color: #4e5470 !important; } [data-bs-theme="dark"] .form-control:focus, [data-bs-theme="dark"] .form-select:focus { background-color: #12152a !important; border-color: #3b7ddd !important; color: #dde4f5 !important; box-shadow: 0 0 0 .2rem rgba(59,125,221,.25) !important; } [data-bs-theme="dark"] .form-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%237a82a0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E") !important; } [data-bs-theme="dark"] .form-label { color: #9098b8 !important; } [data-bs-theme="dark"] .form-text, [data-bs-theme="dark"] .text-muted { color: #5e6680 !important; } [data-bs-theme="dark"] .form-check-input { background-color: #12152a !important; border-color: #2f3350 !important; } [data-bs-theme="dark"] .form-check-label { color: #9098b8 !important; } [data-bs-theme="dark"] .input-group-text { background-color: #1a1e32 !important; border-color: #2f3350 !important; color: #7a82a0 !important; } /* ── Alerts (override common.css !important) ── */ [data-bs-theme="dark"] .alert-success { background-color: #0d2e1a !important; color: #72c493 !important; border-color: #194d2c !important; } [data-bs-theme="dark"] .alert-danger { background-color: #2e0d10 !important; color: #e88090 !important; border-color: #4d1920 !important; } [data-bs-theme="dark"] .alert-info { background-color: #092830 !important; color: #62c4d5 !important; border-color: #124555 !important; } [data-bs-theme="dark"] .alert-warning { background-color: #2e2200 !important; color: #f0c040 !important; border-color: #4d3a00 !important; } /* ── Buttons — outline variants ── */ [data-bs-theme="dark"] .btn-outline-secondary { color: #8892aa !important; border-color: #3a3e58 !important; } [data-bs-theme="dark"] .btn-outline-secondary:hover { background-color: #272b42 !important; color: #dde4f5 !important; border-color: #4a4e70 !important; } [data-bs-theme="dark"] .btn-light { background-color: #272b42 !important; border-color: #3a3e58 !important; color: #c8d0e8 !important; } /* ── Badges ── */ [data-bs-theme="dark"] .badge.bg-secondary { background-color: #2e3250 !important; color: #9098b8 !important; } /* ── HR / dividers ── */ [data-bs-theme="dark"] hr { border-color: #2a2e47 !important; } /* ── Stat icons (dashboard) ── */ [data-bs-theme="dark"] .stat { background: #1e3060 !important; } /* ── Progress bars ── */ [data-bs-theme="dark"] .progress { background-color: #22263d !important; } /* ── Text utilities ── */ [data-bs-theme="dark"] .text-dark { color: #c8d0e8 !important; } /* ── Code blocks ── */ [data-bs-theme="dark"] code { background-color: #1a1e32; color: #7cb5f8; padding: 1px 5px; border-radius: 3px; } /* ── Font cards (global_settings.php) ── */ [data-bs-theme="dark"] .font-card { background: #1e2235 !important; border-color: #2f3350 !important; } [data-bs-theme="dark"] .font-card:hover { border-color: #5d8dd9 !important; box-shadow: 0 2px 8px rgba(59,125,221,0.2) !important; } [data-bs-theme="dark"] .font-card.selected { background: #172858 !important; border-color: #3b7ddd !important; } [data-bs-theme="dark"] .font-card .fc-sample { color: #dde4f5 !important; } [data-bs-theme="dark"] .font-card .fc-name { color: #8890b0 !important; } [data-bs-theme="dark"] .font-card .fc-cat { color: #4e5470 !important; } [data-bs-theme="dark"] .separator-label { color: #3e445e !important; } [data-bs-theme="dark"] .preview-weight { background: #22263d !important; color: #8890b0 !important; } /* ── Footer ── */ [data-bs-theme="dark"] .footer { background: #1a1d2f !important; border-top: 1px solid #2a2e47 !important; color: #7a82a0 !important; } [data-bs-theme="dark"] .footer a { color: #5d8dd9 !important; } /* ── List group ── */ [data-bs-theme="dark"] .list-group-item { background-color: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .list-group-item:hover { background-color: #272b42 !important; color: #dde4f5 !important; } /* ── Calendar (calendar.js injected styles) ── */ [data-bs-theme="dark"] .calendar-day-header { background: #1e2235 !important; color: #9098b8 !important; } [data-bs-theme="dark"] .calendar-day { background: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .calendar-day:hover:not(.other-month) { border-color: #3b7ddd !important; box-shadow: 0 4px 8px rgba(59,125,221,0.25) !important; } [data-bs-theme="dark"] .calendar-day.other-month { background: #12152a !important; color: #3e445e !important; } [data-bs-theme="dark"] .calendar-day.other-month .day-number { color: #3e445e !important; } [data-bs-theme="dark"] .calendar-day.today { background: #1e1020 !important; border-color: #dc3545 !important; } [data-bs-theme="dark"] .day-number { color: #c8d0e8 !important; } /* ── Attendance.php ── */ [data-bs-theme="dark"] .type-header-top { background: #1a1e32 !important; color: #c0c8e0 !important; border-bottom-color: #2a2e47 !important; } [data-bs-theme="dark"] .type-header-top:hover { background: #272b42 !important; } [data-bs-theme="dark"] .type-name { color: #dde4f5 !important; } [data-bs-theme="dark"] .save-section { background: #12152a !important; border-top-color: #2a2e47 !important; } [data-bs-theme="dark"] .status-btn { background: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .status-btn:hover { background: #272b42 !important; border-color: #3b7ddd !important; } [data-bs-theme="dark"] .status-btn.active { border-color: #3b7ddd !important; } [data-bs-theme="dark"] .badge-present { background: #0d2e1a !important; color: #72c493 !important; } [data-bs-theme="dark"] .badge-absent { background: #2e0d10 !important; color: #e88090 !important; } [data-bs-theme="dark"] .bulk-apply-btn { background: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } /* ── Activity log ── */ [data-bs-theme="dark"] .auth-card { background: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .activity-item:hover { background-color: #1e2235 !important; } [data-bs-theme="dark"] .activity-type-attendance { background: #0d2e1a !important; color: #72c493 !important; } [data-bs-theme="dark"] .activity-type-employee { background: #092830 !important; color: #62c4d5 !important; } [data-bs-theme="dark"] .activity-type-user { background: #1a1028 !important; color: #a08ce8 !important; } [data-bs-theme="dark"] .activity-type-status, [data-bs-theme="dark"] .activity-type-type { background: #2e2200 !important; color: #f0c040 !important; } [data-bs-theme="dark"] .activity-type-access { background: #2e0d10 !important; color: #e88090 !important; } [data-bs-theme="dark"] .activity-type-contract { background: #1e2235 !important; color: #8892aa !important; } [data-bs-theme="dark"] .activity-type-vacation { background: #092830 !important; color: #62c4d5 !important; } /* ── Employee detail ── */ [data-bs-theme="dark"] .section-header { background: #1a4a5c !important; color: #dde4f5 !important; } [data-bs-theme="dark"] .access-warning { background: #2e2200 !important; color: #f0c040 !important; border-color: #4d3a00 !important; } [data-bs-theme="dark"] .absences-summary { background: #1e2235 !important; border-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .info-row { border-bottom-color: #2a2e47 !important; color: #c8d0e8 !important; } [data-bs-theme="dark"] .info-row:hover { background-color: #1e2235 !important; } /* ── Employees.php ── */ [data-bs-theme="dark"] .section-title { color: #9098b8 !important; } [data-bs-theme="dark"] .section-divider { border-color: #2a2e47 !important; } [data-bs-theme="dark"] .training-input { background: #12152a !important; border-color: #2f3350 !important; color: #c8d0e8 !important; } /* ── Attendance statuses ── */ [data-bs-theme="dark"] .type-present { background: #0d2e1a !important; color: #72c493 !important; border-color: #194d2c !important; } [data-bs-theme="dark"] .type-absent { background: #2e0d10 !important; color: #e88090 !important; border-color: #4d1920 !important; } [data-bs-theme="dark"] .type-dayoff { background: #0a1e38 !important; color: #6ba8f0 !important; border-color: #1a3a5c !important; } [data-bs-theme="dark"] .type-remote { background: #092830 !important; color: #62c4d5 !important; border-color: #124555 !important; } [data-bs-theme="dark"] .type-cancelled { background: #2e2200 !important; color: #f0c040 !important; border-color: #4d3a00 !important; } [data-bs-theme="dark"] .protected-row { background-color: #1e1e10 !important; color: #c8d0e8 !important; }