/* ========================================================================= LIGHT THEME OVERRIDES Activates when ========================================================================= */ body[data-theme="light"] { background-color: #f1f5f9 !important; /* Slate 100 */ color: #1e293b !important; /* Slate 800 */ } /* Base Cards and Containers */ body[data-theme="light"] .main-card, body[data-theme="light"] .em-card, body[data-theme="light"] .bu-card, body[data-theme="light"] .auth-card, body[data-theme="light"] .login-card, body[data-theme="light"] .ml-card, body[data-theme="light"] .stat-card, body[data-theme="light"] .setting-card { background: #ffffff !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05) !important; color: #1e293b !important; } body[data-theme="light"] .perm-box, body[data-theme="light"] .bu-setup-card { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; } body[data-theme="light"] .perm-box .text-white, body[data-theme="light"] .bu-setup-name.text-white { color: #334155 !important; } body[data-theme="light"] .perm-box .text-info { color: #0284c7 !important; } /* Dashboard BU Cards Overrides */ body[data-theme="light"] .bu-card-bg { opacity: 0.7 !important; } body[data-theme="light"] .bu-card:hover .bu-card-bg { opacity: 0.9 !important; } body[data-theme="light"] .bu-card-overlay { background: linear-gradient(180deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 1) 100%) !important; } body[data-theme="light"] .bu-card:hover .bu-card-overlay { background: linear-gradient(180deg, rgba(241, 245, 249, 0.2) 0%, rgba(241, 245, 249, 0.7) 50%, rgba(241, 245, 249, 1) 100%) !important; } body[data-theme="light"] .bu-icon { background: #f1f5f9 !important; color: #6366f1 !important; border-color: #cbd5e1 !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important; } body[data-theme="light"] .bu-title { color: #0f172a !important; text-shadow: none !important; } body[data-theme="light"] .bu-desc { color: #475569 !important; text-shadow: none !important; } body[data-theme="light"] .bu-code { color: #4f46e5 !important; background: rgba(99, 102, 241, 0.15) !important; border-color: rgba(99, 102, 241, 0.25) !important; } body[data-theme="light"] .status-connected { color: #059669 !important; background: rgba(16, 185, 129, 0.15) !important; border-color: rgba(16, 185, 129, 0.3) !important; } body[data-theme="light"] .status-error { color: #e11d48 !important; background: rgba(225, 29, 72, 0.15) !important; border-color: rgba(225, 29, 72, 0.3) !important; } body[data-theme="light"] .access-locked { color: #e11d48 !important; background: rgba(225, 29, 72, 0.15) !important; border-color: rgba(225, 29, 72, 0.3) !important; } body[data-theme="light"] .access-read { color: #0284c7 !important; background: rgba(14, 165, 233, 0.15) !important; border-color: rgba(14, 165, 233, 0.3) !important; } body[data-theme="light"] .access-write { color: #059669 !important; background: rgba(16, 185, 129, 0.15) !important; border-color: rgba(16, 185, 129, 0.3) !important; } body[data-theme="light"] .btn-enter { background: rgba(241, 245, 249, 0.9) !important; color: #0f172a !important; border: 1px solid #cbd5e1 !important; } body[data-theme="light"] .btn-enter:hover:not([disabled]) { background: #e2e8f0 !important; color: #000000 !important; border-color: #94a3b8 !important; } body[data-theme="light"] .btn-setting { background: rgba(241, 245, 249, 0.9) !important; color: #475569 !important; border: 1px solid #cbd5e1 !important; } body[data-theme="light"] .btn-setting:hover { background: #e2e8f0 !important; color: #0f172a !important; border-color: #94a3b8 !important; } body[data-theme="light"] .em-card-header, body[data-theme="light"] .modal-header, body[data-theme="light"] .em-modal-header { background: #f8fafc !important; border-bottom: 1px solid #e2e8f0 !important; color: #0f172a !important; } /* Navbar / Topbar */ body[data-theme="light"] .navbar-custom, body[data-theme="light"] .tm-bu-topbar { background: #ffffff !important; border-bottom: 2px solid #e2e8f0 !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important; color: #1e293b !important; } body[data-theme="light"] .navbar-brand { color: #1e293b !important; } body[data-theme="light"] .bu-title-text, body[data-theme="light"] .bu-title-text span:first-child { color: #1e293b !important; } body[data-theme="light"] .bu-subtitle-text { color: #475569 !important; } body[data-theme="light"] .tm-bu-topbar select { background: #ffffff !important; color: #1e293b !important; border-color: #cbd5e1 !important; } @media (max-width: 991px) { body[data-theme="light"] .navbar-collapse, body[data-theme="light"] .bo-collapse-menu { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05) !important; border-radius: 12px; padding: 15px; margin-top: 15px; } } body[data-theme="light"] .tm-bu-topbar .btn-outline-light { color: #475569 !important; border-color: #cbd5e1 !important; } body[data-theme="light"] .tm-bu-topbar .btn-outline-light:hover { background: #f1f5f9 !important; } /* User Profile Badges in Topbars */ body[data-theme="light"] .bu-profile-nav, body[data-theme="light"] .navbar-brand > div.rounded-pill { background: #f1f5f9 !important; border: 1px solid #cbd5e1 !important; } body[data-theme="light"] .bu-profile-name { color: #334155 !important; } body[data-theme="light"] .navbar-brand.text-white { color: #1e293b !important; } /* Nav Buttons */ body[data-theme="light"] .nav-btn-custom, body[data-theme="light"] .nav-btn-danger, body[data-theme="light"] .theme-toggle-btn { background: #f8fafc !important; color: #475569 !important; border: 1px solid #e2e8f0 !important; } body[data-theme="light"] .setting-card .form-label, body[data-theme="light"] .setting-card label, body[data-theme="light"] .modal-content-dark .form-label, body[data-theme="light"] .modal-content-dark label { color: #334155 !important; } body[data-theme="light"] .setting-card small.text-muted, body[data-theme="light"] .modal-content-dark small.text-muted { color: #64748b !important; } /* Forms */ body[data-theme="light"] .form-control-dark, body[data-theme="light"] .form-select-dark { background: #ffffff !important; border: 1px solid #cbd5e1 !important; color: #1e293b !important; } body[data-theme="light"] .form-control-dark::placeholder { color: #94a3b8 !important; } body[data-theme="light"] .form-control-dark:focus, body[data-theme="light"] .form-select-dark:focus { background: #ffffff !important; border-color: #6366f1 !important; color: #1e293b !important; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2) !important; } /* Sidebar List Group */ body[data-theme="light"] .bu-list-group .list-group-item { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; color: #334155 !important; } body[data-theme="light"] .bu-list-group .list-group-item:hover { background: #f1f5f9 !important; } body[data-theme="light"] .bu-list-group .list-group-item.active { background: linear-gradient(135deg, #6366f1, #4f46e5) !important; color: #ffffff !important; border-color: #6366f1 !important; } body[data-theme="light"] .nav-btn-custom:hover, body[data-theme="light"] .theme-toggle-btn:hover { background: #e2e8f0 !important; color: #0f172a !important; border-color: #cbd5e1 !important; } body[data-theme="light"] .nav-btn-danger:hover { background: #fee2e2 !important; color: #b91c1c !important; border-color: #fca5a5 !important; } /* Typography Overrides */ body[data-theme="light"] h1, body[data-theme="light"] h2, body[data-theme="light"] h3, body[data-theme="light"] h4, body[data-theme="light"] h5, body[data-theme="light"] h6 { color: #0f172a !important; } body[data-theme="light"] .text-white, body[data-theme="light"] .text-light, body[data-theme="light"] .text-muted { color: #475569 !important; } body[data-theme="light"] small.text-muted { color: #64748b !important; } /* Form Controls */ body[data-theme="light"] .form-control-dark, body[data-theme="light"] .form-select-dark, body[data-theme="light"] .em-form-control, body[data-theme="light"] .form-control, body[data-theme="light"] .form-select, body[data-theme="light"] select { background: #f8fafc !important; border-color: #cbd5e1 !important; color: #1e293b !important; } body[data-theme="light"] .form-control-dark:focus, body[data-theme="light"] .form-select-dark:focus, body[data-theme="light"] .em-form-control:focus, body[data-theme="light"] .form-control:focus, body[data-theme="light"] .form-select:focus { background: #ffffff !important; border-color: #818cf8 !important; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2) !important; } /* Tables */ body[data-theme="light"] .table-dark-custom, body[data-theme="light"] .ml-table, body[data-theme="light"] .em-table { color: #334155 !important; border-color: #e2e8f0 !important; } body[data-theme="light"] .table-dark-custom th, body[data-theme="light"] .ml-table th, body[data-theme="light"] .em-table th { background-color: #f1f5f9 !important; color: #1e293b !important; border-bottom: 2px solid #cbd5e1 !important; } body[data-theme="light"] .table-dark-custom td, body[data-theme="light"] .ml-table td, body[data-theme="light"] .em-table td { border-color: #e2e8f0 !important; } body[data-theme="light"] .table-dark-custom tr:hover td { background-color: #f8fafc !important; } /* Modals */ body[data-theme="light"] .modal-content, body[data-theme="light"] .em-modal-content { background: #ffffff !important; color: #1e293b !important; border: 1px solid #e2e8f0 !important; } body[data-theme="light"] .modal-header, body[data-theme="light"] .em-modal-header, body[data-theme="light"] .modal-footer, body[data-theme="light"] .em-modal-footer { border-color: #e2e8f0 !important; } body[data-theme="light"] .btn-close-white { filter: invert(1) grayscale(100%) brightness(200%) !important; } /* Tabs */ body[data-theme="light"] .ms-tab-btn, body[data-theme="light"] .em-tab-btn { background: #f1f5f9 !important; color: #475569 !important; border: 1px solid #cbd5e1 !important; } body[data-theme="light"] .ms-tab-btn:hover, body[data-theme="light"] .em-tab-btn:hover { background: #e2e8f0 !important; color: #0f172a !important; } body[data-theme="light"] .ms-tab-btn.active, body[data-theme="light"] .em-tab-btn.active { background: #4f46e5 !important; color: #ffffff !important; border-color: #4f46e5 !important; box-shadow: 0 4px 10px rgba(79, 70, 229, 0.3) !important; } /* Mobile Overrides specificity fix */ @media (max-width: 768px) { body[data-theme="light"] .table-dark-custom tbody tr { background: #ffffff !important; border-color: #cbd5e1 !important; } body[data-theme="light"] .table-dark-custom tbody td::before { color: #64748b !important; } }