/** * Dark Theme CSS Overrides * Applied when [data-theme="dark"] is set on */ [data-theme="dark"] { /* Brand overrides (from brand.css) */ --primary-bg: #2a1a1d; --light: #1a1d23; --light-gray: #2d3139; --medium: #9ca3af; --dark: #e5e7eb; --white: #1e2128; --black: #f3f4f6; /* Theme overrides (from analyzelegal-theme.css) */ --neutral-50: #111318; --neutral-100: #1a1d23; --neutral-200: #2d3139; --neutral-300: #3f4451; --neutral-400: #6b7280; --neutral-500: #9ca3af; --neutral-600: #d1d5db; --neutral-700: #e5e7eb; --neutral-800: #f3f4f6; --neutral-900: #f9fafb; /* Shadows - stronger for dark mode */ --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3); --shadow: 0 4px 6px rgba(0, 0, 0, 0.4); --shadow-md: 0 8px 12px rgba(0, 0, 0, 0.4); --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.5); } /* Body */ [data-theme="dark"] body { background-color: #111318; color: #e5e7eb; } /* ===== Cards ===== */ [data-theme="dark"] .card, [data-theme="dark"] .settings-section { background-color: #1e2128; border-color: #2d3139; } [data-theme="dark"] .card-header { background-color: #252830; border-bottom-color: #2d3139; color: #e5e7eb; } [data-theme="dark"] .card-footer { background-color: #1a1d23; border-top-color: #2d3139; } [data-theme="dark"] .card-body { color: #e5e7eb; } /* ===== Forms ===== */ [data-theme="dark"] .form-control, [data-theme="dark"] .form-select { background-color: #1a1d23; border-color: #3f4451; color: #e5e7eb; } [data-theme="dark"] .form-control::placeholder { color: #6b7280; } [data-theme="dark"] .form-label { color: #d1d5db; } [data-theme="dark"] .form-text { color: #6b7280; } [data-theme="dark"] .form-control-plaintext { color: #e5e7eb; } [data-theme="dark"] .state-select { background: #1a1d23; border-color: #3f4451; } /* ===== Tables ===== */ [data-theme="dark"] .table { color: #e5e7eb; } [data-theme="dark"] .table th { background-color: #252830; color: #e5e7eb; } [data-theme="dark"] .table td, [data-theme="dark"] .table th { border-color: #2d3139; } [data-theme="dark"] .table-hover tbody tr:hover { background-color: #252830; } /* ===== Alerts ===== */ [data-theme="dark"] .alert-success { background-color: rgba(39, 174, 96, 0.15); border-color: rgba(39, 174, 96, 0.3); color: #6ee7a0; } [data-theme="dark"] .alert-warning { background-color: rgba(243, 156, 18, 0.15); border-color: rgba(243, 156, 18, 0.3); color: #fbbf24; } [data-theme="dark"] .alert-danger { background-color: rgba(231, 76, 60, 0.15); border-color: rgba(231, 76, 60, 0.3); color: #fca5a5; } [data-theme="dark"] .alert-info { background-color: rgba(52, 152, 219, 0.15); border-color: rgba(52, 152, 219, 0.3); color: #93c5fd; } /* ===== Dropdowns ===== */ [data-theme="dark"] .dropdown-menu { background-color: #1e2128; border-color: #2d3139; } [data-theme="dark"] .dropdown-item { color: #e5e7eb; } [data-theme="dark"] .dropdown-item:hover, [data-theme="dark"] .dropdown-item:focus { background-color: #252830; color: #f3f4f6; } [data-theme="dark"] .dropdown-item.active, [data-theme="dark"] .dropdown-item:active { background-color: var(--primary) !important; color: #ffffff !important; } [data-theme="dark"] .dropdown-divider { border-top-color: #2d3139; } [data-theme="dark"] .dropdown-header { color: #9ca3af; } /* ===== Modals ===== */ [data-theme="dark"] .modal-content { background-color: #1e2128; border-color: #2d3139; } [data-theme="dark"] .modal-header { border-bottom-color: #2d3139; background-color: #252830; } [data-theme="dark"] .modal-footer { border-top-color: #2d3139; background-color: #252830; } [data-theme="dark"] .modal-title { color: #e5e7eb; } [data-theme="dark"] .modal-body { color: #e5e7eb; } /* ===== Navbar (light version from includes/header.php) ===== */ [data-theme="dark"] header .navbar.navbar-light, [data-theme="dark"] nav.navbar.navbar-light { background-color: #1a1d23 !important; border-bottom-color: #2d3139 !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); } [data-theme="dark"] .navbar-light .nav-link, [data-theme="dark"] .navbar-light .navbar-brand, [data-theme="dark"] nav.navbar.navbar-light .nav-link, [data-theme="dark"] nav.navbar.navbar-light .navbar-brand { color: #e5e7eb !important; } [data-theme="dark"] .navbar-light .nav-link:hover, [data-theme="dark"] nav.navbar.navbar-light .nav-link:hover { color: #ffffff !important; } /* ===== Admin Header (public-template.php) ===== */ [data-theme="dark"] .admin-header { background-color: #1e2128; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); } [data-theme="dark"] .admin-header .nav-link { color: #e5e7eb !important; } /* ===== Breadcrumbs ===== */ [data-theme="dark"] .breadcrumb { background-color: transparent; } [data-theme="dark"] .breadcrumb-item a { color: #9ca3af; } [data-theme="dark"] .breadcrumb-item.active span { color: #e5e7eb; } /* ===== Buttons ===== */ [data-theme="dark"] .btn-outline-secondary { color: #9ca3af; border-color: #3f4451; } [data-theme="dark"] .btn-outline-secondary:hover { background-color: #252830; color: #e5e7eb; border-color: #6b7280; } [data-theme="dark"] .btn-outline-primary { color: var(--primary-light); border-color: var(--primary-light); } [data-theme="dark"] .btn-light { color: #e5e7eb; border-color: #3f4451; background-color: #252830; } [data-theme="dark"] .btn-light:hover { background-color: #2d3139; color: #f3f4f6; } /* ===== Profile Dropdown ===== */ [data-theme="dark"] .profile-dropdown-toggle { background-color: #252830 !important; color: #e5e7eb !important; } [data-theme="dark"] .profile-dropdown-menu { background-color: #1e2128; border-color: #2d3139; } [data-theme="dark"] .profile-dropdown-menu .dropdown-item { color: #e5e7eb; } [data-theme="dark"] .profile-dropdown-menu .dropdown-item:hover { background-color: #252830; color: #3498db; } [data-theme="dark"] .profile-dropdown-menu .dropdown-divider { border-top-color: #2d3139; } /* ===== Pagination ===== */ [data-theme="dark"] .page-link { background-color: #1e2128; border-color: #2d3139; color: #e5e7eb; } [data-theme="dark"] .page-link:hover { background-color: #252830; color: #f3f4f6; } [data-theme="dark"] .page-item.active .page-link { background-color: var(--primary); border-color: var(--primary); color: #ffffff; } /* ===== History Cards ===== */ [data-theme="dark"] .history-card { background-color: #1e2128; border-color: #2d3139; } /* ===== Document Content ===== */ [data-theme="dark"] .document-content, [data-theme="dark"] #doc-formatted-content-display { background-color: #1a1d23; border-color: #2d3139; color: #d1d5db; } [data-theme="dark"] .document-container, [data-theme="dark"] .analysis-container { background: #1e2128; } [data-theme="dark"] .document-browser-content, [data-theme="dark"] .analysis-content { background: #1e2128; } /* ===== Settings Page ===== */ [data-theme="dark"] .settings-header { background: var(--primary) !important; } [data-theme="dark"] .settings-body { background-color: #1e2128; } [data-theme="dark"] .slider { background-color: #3f4451; } /* ===== Detail Sections ===== */ [data-theme="dark"] .detail-header { background: linear-gradient(135deg, #1a1d23 0%, #252830 100%); border-left-color: var(--primary); } [data-theme="dark"] .detail-section { background: #1e2128; border-color: #2d3139; } [data-theme="dark"] .detail-section h3 { border-bottom-color: #2d3139; } [data-theme="dark"] .detail-meta-item { background: #252830; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); } /* ===== Issue and Recommendation Cards ===== */ [data-theme="dark"] .issue-card { background-color: #1e2128; border-color: #2d3139; } [data-theme="dark"] .issue-card .card-header { background-color: rgba(139, 33, 49, 0.1); border-bottom-color: rgba(139, 33, 49, 0.3); } [data-theme="dark"] .recommendation-card { background-color: #1e2128; } [data-theme="dark"] .problematic-text-content { background-color: rgba(139, 33, 49, 0.1); } [data-theme="dark"] .reference-content { background-color: rgba(13, 110, 253, 0.1); } [data-theme="dark"] .explanation-content { background-color: rgba(108, 117, 125, 0.1); } [data-theme="dark"] .suggested-fix-container { background-color: rgba(25, 135, 84, 0.1); } /* ===== Empty State ===== */ [data-theme="dark"] .empty-state { background: #1a1d23; } /* ===== Statute Modal ===== */ [data-theme="dark"] #statuteModal .modal-header { background-color: #252830; } [data-theme="dark"] #statute-code { color: #e5e7eb; } [data-theme="dark"] #statute-description { color: #d1d5db; } [data-theme="dark"] #statute-compliance-container { background-color: rgba(246, 173, 85, 0.1); border-left-color: #f6ad55; } [data-theme="dark"] #statute-subsections .list-group-item { background-color: #1e2128; border-color: #2d3139; color: #e5e7eb; } [data-theme="dark"] #statute-subsections .list-group-item:hover { background-color: #252830; } /* ===== Scrollbar ===== */ [data-theme="dark"] ::-webkit-scrollbar { width: 8px; } [data-theme="dark"] ::-webkit-scrollbar-track { background: #1a1d23; } [data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3f4451; border-radius: 4px; } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #6b7280; } /* ===== Text Colors ===== */ [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6 { color: #f3f4f6; } [data-theme="dark"] p, [data-theme="dark"] span, [data-theme="dark"] label, [data-theme="dark"] li { color: #e5e7eb; } [data-theme="dark"] .text-muted { color: #9ca3af !important; } [data-theme="dark"] .text-dark { color: #e5e7eb !important; } [data-theme="dark"] .text-secondary { color: #9ca3af !important; } /* ===== Background Utility Overrides ===== */ [data-theme="dark"] .bg-light { background-color: #1a1d23 !important; } [data-theme="dark"] .bg-white { background-color: #1e2128 !important; } /* Fix forced black text from brand.css ".bg-light, .bg-light *" rule */ [data-theme="dark"] .bg-light, [data-theme="dark"] .bg-light *:not(.text-danger):not(.text-success):not(.text-warning):not(.text-info):not(.text-primary) { color: #e5e7eb !important; } /* ===== Misc ===== */ [data-theme="dark"] .container-fluid { background-color: transparent; } [data-theme="dark"] .border { border-color: #2d3139 !important; } [data-theme="dark"] .border-top { border-top-color: #2d3139 !important; } [data-theme="dark"] .border-bottom { border-bottom-color: #2d3139 !important; } [data-theme="dark"] hr { border-color: #2d3139; opacity: 0.3; } /* Validation overlay */ [data-theme="dark"] .validation-overlay { background: rgba(0, 0, 0, 0.7) !important; } [data-theme="dark"] .validation-overlay-text { color: #f3f4f6; } [data-theme="dark"] .validation-overlay-subtext { color: #d1d5db; } [data-theme="dark"] .validation-overlay-icon { background: rgba(30, 33, 40, 0.7); border-color: rgba(45, 49, 57, 0.3); } /* Validator container */ [data-theme="dark"] .validator-container { background-color: #1e2128; } /* Close button */ [data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } /* Accordion */ [data-theme="dark"] .accordion-item { background-color: #1e2128; border-color: #2d3139; } [data-theme="dark"] .accordion-button { background-color: #252830; color: #e5e7eb; } [data-theme="dark"] .accordion-button:not(.collapsed) { background-color: #2d3139; color: #f3f4f6; } [data-theme="dark"] .accordion-body { background-color: #1e2128; } /* List groups */ [data-theme="dark"] .list-group-item { background-color: #1e2128; border-color: #2d3139; color: #e5e7eb; } /* Tooltip */ [data-theme="dark"] .tooltip-inner { background-color: #252830; color: #e5e7eb; } /* Progress bars */ [data-theme="dark"] .progress { background-color: #2d3139; } /* Tab / Nav pills */ [data-theme="dark"] .nav-tabs { border-bottom-color: #2d3139; } [data-theme="dark"] .nav-tabs .nav-link { color: #9ca3af; } [data-theme="dark"] .nav-tabs .nav-link.active { background-color: #1e2128; border-color: #2d3139 #2d3139 #1e2128; color: #e5e7eb; } [data-theme="dark"] .nav-pills .nav-link { color: #9ca3af; } /* Input group */ [data-theme="dark"] .input-group-text { background-color: #252830; border-color: #3f4451; color: #e5e7eb; } /* Badge overrides */ [data-theme="dark"] .badge.bg-light { background-color: #252830 !important; color: #e5e7eb !important; } [data-theme="dark"] .badge.bg-secondary { background-color: #3f4451 !important; } /* Sidebar already dark - ensure consistency */ [data-theme="dark"] .admin-sidebar { background-color: #1a1f2e; } [data-theme="dark"] .admin-user-info { background: #141925; } [data-theme="dark"] .sidebar-footer { background: rgba(0, 0, 0, 0.2); } /* Footer - already dark but ensure consistent dark */ [data-theme="dark"] .footer { background-color: #0a0c10 !important; } /* Highlight pulse */ [data-theme="dark"] .highlight-pulse { background-color: #854d0e !important; color: #fde68a !important; }