/* File: static/css/dark_theme.css */
/* Dark theme overlay — overrides hardcoded colors across all CSS files */
/* Version: 1.2.0 */
/* Last Modified: 2026-02-13 */
/* Change: Replace archive filter drawer overrides with browse-style sidebar overrides */

/* ============================================
   CSS Variable Overrides
   ============================================ */

[data-theme="dark"] {
    --primary: #4CAF50;
    --primary-dark: #388E3C;
    --primary-light: #66BB6A;
    --secondary: #78909C;
    --danger: #ef5350;
    --warning: #ffa726;
    --success: #66bb6a;
    --surface: #1e1e1e;
    --background: #121212;
    --background-dark: #0a0a0a;
    --text-primary: #e0e0e0;
    --text-secondary: #a0a0a0;
    --border: #333;
    --shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 4px 20px rgba(0, 0, 0, 0.4);
}

/* ============================================
   Smooth Transitions (disabled on initial load)
   ============================================ */

.theme-transition,
.theme-transition *,
.theme-transition *::before,
.theme-transition *::after {
    transition: background-color 0.3s ease, color 0.3s ease,
                border-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* ============================================
   Global Body & Inputs
   ============================================ */

[data-theme="dark"] body {
    background: #121212;
    color: #e0e0e0;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: #777;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
    border-color: #4CAF50;
}

[data-theme="dark"] a {
    color: #66bb6a;
}

[data-theme="dark"] a:hover {
    color: #81c784;
}

/* ============================================
   App Header + Bottom Nav (mobile.css)
   ============================================ */

[data-theme="dark"] .app-header {
    background: #1a3a2a;
}

[data-theme="dark"] .search-bar {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .bottom-nav {
    background: #1e1e1e;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .nav-item {
    color: #888;
}

[data-theme="dark"] .nav-item.active {
    color: #4CAF50;
}

/* ============================================
   Main Content (mobile.css)
   ============================================ */

[data-theme="dark"] .main-content {
    background: #121212;
}

[data-theme="dark"] .section-title {
    color: #e0e0e0;
}

[data-theme="dark"] .section-link {
    color: #4CAF50;
}

/* ============================================
   Home Page — Cards
   ============================================ */

[data-theme="dark"] .mosque-card {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .mosque-icon {
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .mosque-name {
    color: #e0e0e0;
}

[data-theme="dark"] .mosque-distance {
    color: #888;
}

[data-theme="dark"] .mosque-status.live {
    background: #3d1c1c;
    color: #ef5350;
}

[data-theme="dark"] .mosque-status.upcoming {
    background: #1a2d3d;
    color: #64b5f6;
}

[data-theme="dark"] .sermon-card {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .sermon-title {
    color: #e0e0e0;
}

[data-theme="dark"] .sermon-mosque {
    color: #a0a0a0;
}

[data-theme="dark"] .sermon-meta {
    color: #888;
}

[data-theme="dark"] .sermon-play {
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .quick-label {
    color: #a0a0a0;
}

/* ============================================
   Landing Page (main.css)
   ============================================ */

[data-theme="dark"] .feature-card {
    background: #1e1e1e;
}

[data-theme="dark"] .language-card {
    background: #1e1e1e;
    color: #e0e0e0;
}

[data-theme="dark"] .language-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* ============================================
   Buttons (main.css overrides)
   ============================================ */

[data-theme="dark"] .btn-outline {
    border-color: #4CAF50;
    color: #4CAF50;
}

[data-theme="dark"] .btn-outline:hover {
    background: #1a3a2a;
}

[data-theme="dark"] .btn-secondary {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] .btn-secondary:hover {
    background: #333;
}

[data-theme="dark"] .btn-white {
    background: #2a2a2a;
    color: #4CAF50;
}

[data-theme="dark"] .btn-white:hover {
    background: #333;
}

/* ============================================
   Forms (main.css overrides)
   ============================================ */

[data-theme="dark"] .form-input {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] .form-input:focus {
    border-color: #4CAF50;
}

/* ============================================
   Cards & Modals (main.css)
   ============================================ */

[data-theme="dark"] .card {
    background: #1e1e1e;
}

[data-theme="dark"] .modal {
    background: #1e1e1e;
}

[data-theme="dark"] .modal-header {
    border-bottom-color: #333;
}

[data-theme="dark"] .modal-header h2 {
    color: #e0e0e0;
}

[data-theme="dark"] .modal-footer {
    border-top-color: #333;
}

/* ============================================
   Badges (main.css overrides)
   ============================================ */

[data-theme="dark"] .badge-primary {
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .badge-danger {
    background: #3d1c1c;
    color: #ef5350;
}

[data-theme="dark"] .badge-warning {
    background: #3d2e1a;
    color: #ffa726;
}

[data-theme="dark"] .badge-info {
    background: #1a2d3d;
    color: #64b5f6;
}

/* ============================================
   Settings Page (settings.html inline styles)
   ============================================ */

[data-theme="dark"] .settings-page-title {
    color: #e0e0e0;
}

[data-theme="dark"] .settings-page .settings-section {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .settings-page .section-title {
    color: #a0a0a0;
}

[data-theme="dark"] .profile-name {
    color: #e0e0e0;
}

[data-theme="dark"] .profile-email {
    color: #a0a0a0;
}

[data-theme="dark"] .btn-edit-profile {
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .btn-edit-profile:hover {
    background: #245535;
}

[data-theme="dark"] .setting-row {
    border-bottom-color: #333;
}

[data-theme="dark"] .setting-label {
    color: #e0e0e0;
}

[data-theme="dark"] .setting-value {
    color: #a0a0a0;
}

[data-theme="dark"] .setting-link {
    color: #4CAF50;
}

[data-theme="dark"] .toggle-switch {
    background: #444;
}

[data-theme="dark"] .toggle-switch:checked {
    background: #4CAF50;
}

[data-theme="dark"] .size-btn {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .size-btn:hover {
    border-color: #4CAF50;
}

[data-theme="dark"] .size-btn.active {
    border-color: #4CAF50;
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .setting-saved-badge {
    color: #4CAF50;
    background: #1a3a2a;
}

[data-theme="dark"] .storage-text {
    color: #a0a0a0;
}

[data-theme="dark"] .storage-bar {
    background: #333;
}

[data-theme="dark"] .storage-fill {
    background: #4CAF50;
}

[data-theme="dark"] .btn-clear-cache {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] .btn-clear-cache:hover {
    background: #333;
}

[data-theme="dark"] .danger-zone {
    border-color: #5c2020;
}

[data-theme="dark"] .danger-zone .section-title {
    color: #ef5350;
}

[data-theme="dark"] .btn-delete-account {
    background: #3d1c1c;
    color: #ef5350;
    border-color: #5c2020;
}

[data-theme="dark"] .btn-delete-account:hover {
    background: #5c2020;
}

[data-theme="dark"] .btn-sign-out {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] .btn-sign-out:hover {
    background: #333;
}

/* Settings Language Modal */
[data-theme="dark"] .language-modal {
    background: #1e1e1e;
}

[data-theme="dark"] .language-modal-title {
    color: #e0e0e0;
}

[data-theme="dark"] .language-modal-close {
    color: #a0a0a0;
}

[data-theme="dark"] .language-card-name {
    color: #e0e0e0;
}

[data-theme="dark"] .language-card-native {
    color: #a0a0a0;
}

[data-theme="dark"] .settings-page .language-card {
    border-color: #444;
    background: #2a2a2a;
}

[data-theme="dark"] .settings-page .language-card:hover {
    border-color: #4CAF50;
}

[data-theme="dark"] .settings-page .language-card.selected {
    border-color: #4CAF50;
    background: #1a3a2a;
}

/* Edit Profile Modal */
[data-theme="dark"] #editProfileModal .language-modal {
    background: #1e1e1e;
}

[data-theme="dark"] #editProfileModal label {
    color: #a0a0a0 !important;
}

[data-theme="dark"] #editProfileModal input,
[data-theme="dark"] #editProfileModal select {
    background: #2a2a2a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

[data-theme="dark"] #editProfileError {
    background: #3d1c1c !important;
    color: #ef5350 !important;
}

[data-theme="dark"] #editProfileModal button[onclick="hideEditProfileModal()"] {
    background: #2a2a2a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

/* ============================================
   Auth Pages (auth.css)
   ============================================ */

[data-theme="dark"] .auth-page {
    background: linear-gradient(135deg, #0d3320 0%, #061a10 100%);
}

[data-theme="dark"] .auth-container {
    background: #1e1e1e;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .auth-body {
    background: #1e1e1e;
}

[data-theme="dark"] .tab-switcher {
    background: #2a2a2a;
}

[data-theme="dark"] .tab-btn {
    color: #a0a0a0;
}

[data-theme="dark"] .tab-btn.active {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    color: #4CAF50;
}

[data-theme="dark"] .auth-body .form-group input {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .auth-body .form-group input::placeholder {
    color: #777;
}

[data-theme="dark"] .auth-body .form-group input:focus {
    border-color: #4CAF50;
}

[data-theme="dark"] .password-toggle {
    color: #888;
}

[data-theme="dark"] .password-toggle:hover {
    color: #e0e0e0;
}

[data-theme="dark"] .divider {
    color: #666;
}

[data-theme="dark"] .divider::before,
[data-theme="dark"] .divider::after {
    background: #444;
}

[data-theme="dark"] .btn-social {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .btn-social:hover {
    border-color: #4CAF50;
    background: #1a3a2a;
}

[data-theme="dark"] .phone-login {
    background: #2a2a2a;
}

[data-theme="dark"] .phone-login a {
    color: #4CAF50;
}

[data-theme="dark"] .auth-error {
    background: #3d1c1c;
    color: #ef5350;
    border-left-color: #ef5350;
}

[data-theme="dark"] .back-link {
    color: #a0a0a0;
}

[data-theme="dark"] .back-link:hover {
    color: #4CAF50;
}

[data-theme="dark"] .step {
    background: #444;
}

[data-theme="dark"] .country-select,
[data-theme="dark"] .phone-input {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .otp-digit {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .info-text {
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .phone-display {
    color: #e0e0e0;
}

[data-theme="dark"] .resend-section {
    color: #a0a0a0;
}

/* ============================================
   Custom Alert (custom_alert.css)
   ============================================ */

[data-theme="dark"] .custom-alert-card {
    background: #1e1e1e;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .custom-alert-title {
    color: #e0e0e0;
}

[data-theme="dark"] .custom-alert-message {
    color: #a0a0a0;
}

[data-theme="dark"] .custom-alert-icon.success { background: #1a3a2a; color: #4CAF50; }
[data-theme="dark"] .custom-alert-icon.error   { background: #3d1c1c; color: #ef5350; }
[data-theme="dark"] .custom-alert-icon.warning  { background: #3d2e1a; color: #ffa726; }
[data-theme="dark"] .custom-alert-icon.info     { background: #1a2d3d; color: #64b5f6; }
[data-theme="dark"] .custom-alert-icon.confirm  { background: #3d2e1a; color: #ffa726; }

[data-theme="dark"] .custom-alert-btn.cancel {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] .custom-alert-btn.confirm-btn {
    background: #4CAF50;
}

[data-theme="dark"] .custom-alert-btn.confirm-btn.error {
    background: #ef5350;
}

/* ============================================
   Library Page (library.css)
   ============================================ */

[data-theme="dark"] .library-title {
    color: #4CAF50;
}

[data-theme="dark"] .library-sidebar {
    background: #1e1e1e;
    border-right-color: #333;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .sidebar-item {
    color: #a0a0a0;
}

[data-theme="dark"] .sidebar-item:hover {
    background: #2a2a2a;
    color: #e0e0e0;
}

[data-theme="dark"] .sidebar-item.active {
    background: #1a3a2a;
    color: #4CAF50;
}

[data-theme="dark"] .sidebar-item.active svg {
    stroke: #4CAF50;
}

[data-theme="dark"] .sidebar-item svg {
    stroke: #888;
}

[data-theme="dark"] .sidebar-divider {
    background: #333;
}

[data-theme="dark"] .library-main {
    background: #121212;
}

[data-theme="dark"] .section-header {
    border-bottom-color: #333;
}

[data-theme="dark"] .section-view-all {
    color: #4CAF50;
}

[data-theme="dark"] .section-view-all:hover {
    color: #66bb6a;
}

[data-theme="dark"] .section-empty {
    background: #1e1e1e;
    color: #888;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-card {
    background: #1e1e1e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .library-card-title {
    color: #e0e0e0;
}

[data-theme="dark"] .library-card-subtitle {
    color: #a0a0a0;
}

[data-theme="dark"] .library-card-meta {
    color: #888;
}

[data-theme="dark"] .library-card-btn {
    color: #a0a0a0;
}

[data-theme="dark"] .library-card-btn:hover {
    background: #333;
    color: #e0e0e0;
}

[data-theme="dark"] .library-card-progress {
    background: #333;
}

[data-theme="dark"] .library-card-progress-fill {
    background: #4CAF50;
}

[data-theme="dark"] .stats-card,
[data-theme="dark"] .library-page .stats-card {
    background: #1e1e1e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .stats-value {
    color: #4CAF50;
}

[data-theme="dark"] .stats-label {
    color: #a0a0a0;
}

[data-theme="dark"] .playlist-card {
    background: #1e1e1e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .playlist-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .playlist-name {
    color: #e0e0e0;
}

[data-theme="dark"] .playlist-count {
    color: #a0a0a0;
}

[data-theme="dark"] .follow-card {
    background: #1e1e1e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .follow-avatar {
    background: #1a3a2a;
}

[data-theme="dark"] .follow-avatar svg {
    stroke: #4CAF50;
}

[data-theme="dark"] .follow-name {
    color: #e0e0e0;
}

[data-theme="dark"] .follow-detail {
    color: #a0a0a0;
}

[data-theme="dark"] .follow-btn.following {
    background: #2a2a2a;
    color: #e0e0e0;
}

[data-theme="dark"] .note-card {
    background: #1e1e1e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .note-sermon {
    color: #4CAF50;
}

[data-theme="dark"] .note-content {
    color: #e0e0e0;
}

[data-theme="dark"] .note-meta {
    color: #888;
}

[data-theme="dark"] .library-load-more {
    background: #1e1e1e;
    border-color: #4CAF50;
    color: #4CAF50;
}

[data-theme="dark"] .library-load-more:hover {
    background: #4CAF50;
    color: #fff;
}

[data-theme="dark"] .library-spinner {
    border-color: #333;
    border-top-color: #4CAF50;
}

[data-theme="dark"] .library-spinner-small {
    border-color: #333;
    border-top-color: #4CAF50;
}

[data-theme="dark"] .library-back-link {
    color: #4CAF50;
}

/* Library modal */
[data-theme="dark"] .library-page .modal-content {
    background: #1e1e1e;
}

[data-theme="dark"] .library-page .modal-header {
    border-bottom-color: #333;
}

[data-theme="dark"] .library-page .modal-header h3 {
    color: #e0e0e0;
}

[data-theme="dark"] .library-page .modal-close {
    color: #888;
}

[data-theme="dark"] .library-page .modal-body input,
[data-theme="dark"] .library-page .modal-body textarea {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .library-page .modal-footer {
    border-top-color: #333;
}

[data-theme="dark"] .btn-secondary {
    background: #2a2a2a;
    color: #e0e0e0;
}

/* Library sidebar overlay */
[data-theme="dark"] .sidebar-overlay.active {
    background: rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] .sidebar-toggle {
    background: #4CAF50;
}

/* Clear history button */
[data-theme="dark"] .clear-history-btn {
    background: #3d1c1c;
    color: #ef5350;
}

/* ============================================
   Explore Page
   ============================================ */

[data-theme="dark"] .explore-filter-btn {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

[data-theme="dark"] .explore-filter-btn.active,
[data-theme="dark"] .explore-filter-btn:hover {
    background: #1a3a2a;
    color: #4CAF50;
    border-color: #4CAF50;
}

[data-theme="dark"] .explore-sort select {
    background: #2a2a2a;
    color: #e0e0e0;
    border-color: #444;
}

/* ============================================
   Sermon Pages
   ============================================ */

[data-theme="dark"] .sermon-detail-header {
    background: #1e1e1e;
}

[data-theme="dark"] .sermon-detail-title {
    color: #e0e0e0;
}

[data-theme="dark"] .sermon-detail-meta {
    color: #a0a0a0;
}

/* ============================================
   Admin Pages (admin.css)
   ============================================ */

/* Admin sidebar — keep green branded but darken slightly */
[data-theme="dark"] .admin-sidebar {
    background: #133d28;
}

[data-theme="dark"] .admin-main-content {
    background: #121212;
}

[data-theme="dark"] .page-title {
    color: #e0e0e0;
}

[data-theme="dark"] .last-updated {
    color: #888;
}

/* Admin stat cards */
[data-theme="dark"] .stat-card {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .stat-value {
    color: #e0e0e0;
}

[data-theme="dark"] .stat-label {
    color: #a0a0a0;
}

[data-theme="dark"] .stat-icon.users { background: #1a2d3d; color: #64b5f6; }
[data-theme="dark"] .stat-icon.mosques { background: #1a3a2a; color: #4CAF50; }
[data-theme="dark"] .stat-icon.sermons { background: #3d2e1a; color: #ffa726; }
[data-theme="dark"] .stat-icon.active { background: #3d1a2a; color: #f48fb1; }

/* Admin charts */
[data-theme="dark"] .chart-card {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .chart-header h3 {
    color: #e0e0e0;
}

/* Admin tables */
[data-theme="dark"] .data-table {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .table-header {
    border-bottom-color: #333;
}

[data-theme="dark"] .table-title {
    color: #e0e0e0;
}

[data-theme="dark"] .table-subtitle {
    color: #888;
}

[data-theme="dark"] th {
    background: #252525;
    color: #a0a0a0;
    border-bottom-color: #333;
}

[data-theme="dark"] td {
    color: #e0e0e0;
    border-bottom-color: #2a2a2a;
}

[data-theme="dark"] tr:hover td {
    background: #252525;
}

[data-theme="dark"] .user-name {
    color: #e0e0e0;
}

[data-theme="dark"] .user-email {
    color: #a0a0a0;
}

/* Admin badges */
[data-theme="dark"] .role-badge.admin { background: #3d1c1c; color: #ef5350; }
[data-theme="dark"] .role-badge.imam { background: #1a3a2a; color: #4CAF50; }
[data-theme="dark"] .role-badge.mosque-admin { background: #1a2d3d; color: #64b5f6; }
[data-theme="dark"] .role-badge.moderator { background: #3d2e1a; color: #ffa726; }
[data-theme="dark"] .role-badge.support { background: #2d1a3d; color: #ce93d8; }
[data-theme="dark"] .role-badge.user { background: #2a2a2a; color: #a0a0a0; }

[data-theme="dark"] .severity-badge.success { background: #1a3a2a; color: #4CAF50; }
[data-theme="dark"] .severity-badge.error { background: #3d1c1c; color: #ef5350; }
[data-theme="dark"] .severity-badge.warning { background: #3d2e1a; color: #ffa726; }
[data-theme="dark"] .severity-badge.info { background: #1a2d3d; color: #64b5f6; }

[data-theme="dark"] .category-badge {
    background: #2a2a2a;
    color: #a0a0a0;
}

/* Admin filters */
[data-theme="dark"] .search-input {
    background-color: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .search-input:focus {
    border-color: #4CAF50;
}

[data-theme="dark"] .filter-select {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .filter-select:focus {
    border-color: #4CAF50;
}

[data-theme="dark"] .date-presets .preset-btn {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .date-presets .preset-btn.active,
[data-theme="dark"] .date-presets .preset-btn:hover {
    background: #4CAF50;
    color: #fff;
    border-color: #4CAF50;
}

/* Admin action buttons */
[data-theme="dark"] .action-btn {
    color: #a0a0a0;
}

[data-theme="dark"] .action-btn:hover {
    background: #333;
}

/* Admin modals */
[data-theme="dark"] .admin-main-content .modal {
    background: #1e1e1e;
}

[data-theme="dark"] .modal-title {
    color: #e0e0e0;
}

[data-theme="dark"] .modal-close {
    color: #a0a0a0;
}

[data-theme="dark"] .form-group label {
    color: #e0e0e0;
}

/* Admin pagination */
[data-theme="dark"] .pagination {
    border-top-color: #333;
}

[data-theme="dark"] .pagination-info {
    color: #a0a0a0;
}

[data-theme="dark"] .page-btn {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .page-btn:hover {
    background: #333;
}

[data-theme="dark"] .page-btn.active {
    background: #4CAF50;
    color: #fff;
    border-color: #4CAF50;
}

/* Admin tabs */
[data-theme="dark"] .tab-buttons {
    border-bottom-color: #333;
}

[data-theme="dark"] .tab-btn {
    color: #a0a0a0;
}

[data-theme="dark"] .tab-btn.active {
    color: #4CAF50;
    border-bottom-color: #4CAF50;
}

[data-theme="dark"] .tab-btn:hover {
    color: #e0e0e0;
}

/* Admin settings panels */
[data-theme="dark"] .admin-main-content .settings-section {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .settings-section-header {
    color: #e0e0e0;
    border-bottom-color: #333;
}

[data-theme="dark"] .setting-info h4 {
    color: #e0e0e0;
}

[data-theme="dark"] .setting-info p {
    color: #888;
}

/* Admin role cards */
[data-theme="dark"] .role-card {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .role-card-header {
    border-bottom-color: #333;
}

[data-theme="dark"] .role-card-header h3 {
    color: #e0e0e0;
}

[data-theme="dark"] .role-card-header .user-count {
    background: #1a2d3d;
    color: #64b5f6;
}

[data-theme="dark"] .role-card-body .description {
    color: #a0a0a0;
}

[data-theme="dark"] .permission-item {
    color: #a0a0a0;
}

[data-theme="dark"] .permission-item input[type="checkbox"] {
    accent-color: #4CAF50;
}

/* Health indicators */
[data-theme="dark"] .health-item {
    background: #2a2a2a;
}

/* Link card */
[data-theme="dark"] .link-card {
    background: #2a2a2a;
}

[data-theme="dark"] .link-card:hover {
    background: #333;
}

/* Admin imam privacy */
[data-theme="dark"] .privacy-legend {
    background: #2a2a2a;
}

[data-theme="dark"] .legend-item {
    color: #a0a0a0;
}

[data-theme="dark"] .bio-display {
    background: #2a2a2a;
    color: #e0e0e0;
}

[data-theme="dark"] .bio-empty {
    color: #888;
}

/* Admin bulk actions */
[data-theme="dark"] .bulk-actions {
    background: #1a2d3d;
    border-bottom-color: #333;
}

[data-theme="dark"] .bulk-actions .selected-count {
    color: #64b5f6;
}

[data-theme="dark"] .bulk-actions-bar {
    background: #2a2a2a;
    border-color: #444;
}

[data-theme="dark"] .bulk-label {
    color: #e0e0e0;
}

/* Admin sortable columns */
[data-theme="dark"] .sortable:hover {
    background: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .sortable.active-sort {
    color: #4CAF50;
}

[data-theme="dark"] .results-count {
    color: #a0a0a0;
}

/* Admin auto-refresh */
[data-theme="dark"] .auto-refresh {
    color: #a0a0a0;
}

[data-theme="dark"] .auto-refresh input[type="checkbox"] {
    accent-color: #4CAF50;
}

/* Admin empty state */
[data-theme="dark"] .empty-state {
    color: #888;
}

/* Admin summary cards */
[data-theme="dark"] .summary-card {
    background: #1e1e1e;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .summary-card .summary-value {
    color: #e0e0e0;
}

[data-theme="dark"] .summary-card .summary-label {
    color: #a0a0a0;
}

/* Admin log viewer — already dark by default, ensure consistency */
[data-theme="dark"] .log-unavailable {
    background: #2a2a2a;
    border-color: #444;
}

/* Admin activity feed */
[data-theme="dark"] .activity-item {
    border-bottom-color: #333;
}

[data-theme="dark"] .activity-action {
    color: #e0e0e0;
}

[data-theme="dark"] .activity-detail {
    color: #888;
}

[data-theme="dark"] .activity-time {
    color: #888;
}

/* Admin responsive overrides */
[data-theme="dark"] .admin-sidebar .nav-item.active {
    background: rgba(255, 255, 255, 0.15);
}

/* ============================================
   Admin Responsive (admin_responsive.css cards)
   ============================================ */

[data-theme="dark"] [data-label]::before {
    color: #a0a0a0;
}

/* ============================================
   Live Player — unified with global data-theme
   ============================================ */

[data-theme="dark"] .live-player-page {
    background: #0a0a0a;
    color: #fff;
}

/* Light overrides for live player when global theme is light */
html:not([data-theme="dark"]) .live-player-page {
    background: #f8f9fa;
    color: #212529;
}

html:not([data-theme="dark"]) .live-top-bar {
    background: linear-gradient(180deg, rgba(255,255,255,0.9) 0%, transparent 100%);
}

html:not([data-theme="dark"]) .live-back-btn,
html:not([data-theme="dark"]) .live-settings-btn,
html:not([data-theme="dark"]) .live-share-btn,
html:not([data-theme="dark"]) .live-theme-btn {
    color: #212529;
    background: rgba(0,0,0,0.08);
}

html:not([data-theme="dark"]) .live-back-btn:hover,
html:not([data-theme="dark"]) .live-settings-btn:hover,
html:not([data-theme="dark"]) .live-share-btn:hover,
html:not([data-theme="dark"]) .live-theme-btn:hover {
    background: rgba(0,0,0,0.15);
}

html:not([data-theme="dark"]) .live-mosque-name { color: #212529; }
html:not([data-theme="dark"]) .live-mosque-name-ar { color: rgba(0,0,0,0.6); }
html:not([data-theme="dark"]) .live-lang-name { color: rgba(0,0,0,0.5); }

html:not([data-theme="dark"]) .subtitle-single { color: #212529; }
html:not([data-theme="dark"]) .subtitle-scroll-item {
    color: #212529;
    border-bottom-color: rgba(0,0,0,0.1);
}

html:not([data-theme="dark"]) .live-mute-btn {
    border-color: rgba(0,0,0,0.15);
    background: rgba(0,0,0,0.05);
    color: rgba(0,0,0,0.7);
}

html:not([data-theme="dark"]) .live-mute-btn:hover {
    background: rgba(0,0,0,0.08);
    border-color: rgba(0,0,0,0.25);
}

html:not([data-theme="dark"]) .settings-overlay {
    background: rgba(0,0,0,0.25);
}

html:not([data-theme="dark"]) .settings-drawer {
    background: #fff;
}

html:not([data-theme="dark"]) .settings-drawer-header {
    border-bottom-color: rgba(0,0,0,0.1);
}

html:not([data-theme="dark"]) .settings-drawer-title {
    color: #212529;
}

html:not([data-theme="dark"]) .settings-close-btn {
    background: rgba(0,0,0,0.06);
    color: #212529;
}

html:not([data-theme="dark"]) .settings-close-btn:hover {
    background: rgba(0,0,0,0.12);
}

html:not([data-theme="dark"]) .live-player-page .settings-section {
    border-bottom-color: rgba(0,0,0,0.06);
}

html:not([data-theme="dark"]) .settings-section-label {
    color: rgba(0,0,0,0.45);
}

html:not([data-theme="dark"]) .settings-lang-name {
    color: #212529;
}

html:not([data-theme="dark"]) .settings-lang-endonym {
    color: rgba(0,0,0,0.5);
}

html:not([data-theme="dark"]) .settings-lang-item:hover {
    background: rgba(0,0,0,0.04);
}

html:not([data-theme="dark"]) .settings-lang-item.active {
    background: rgba(26,95,60,0.1);
}

html:not([data-theme="dark"]) .settings-toggle-btn {
    border-color: rgba(0,0,0,0.15);
    color: rgba(0,0,0,0.5);
}

html:not([data-theme="dark"]) .settings-toggle-btn:hover {
    border-color: rgba(0,0,0,0.3);
    color: #212529;
}

html:not([data-theme="dark"]) .settings-toggle-btn.active {
    background: rgba(26,95,60,0.12);
    border-color: #1a5f3c;
    color: #1a5f3c;
}

html:not([data-theme="dark"]) .settings-font-tile {
    border-color: rgba(0,0,0,0.15);
    color: rgba(0,0,0,0.5);
}

html:not([data-theme="dark"]) .settings-font-tile:hover {
    border-color: rgba(0,0,0,0.3);
    color: #212529;
}

html:not([data-theme="dark"]) .settings-font-tile.active {
    background: rgba(26,95,60,0.12);
    border-color: #1a5f3c;
    color: #1a5f3c;
}

html:not([data-theme="dark"]) .settings-font-tile-label {
    color: rgba(0,0,0,0.45);
}

html:not([data-theme="dark"]) .settings-font-tile.active .settings-font-tile-label {
    color: #1a5f3c;
}

html:not([data-theme="dark"]) .share-toast {
    background: rgba(0,0,0,0.8);
    color: #fff;
}

/* Bottom-sheet handle bar in light mode */
@media (max-width: 767px) {
    html:not([data-theme="dark"]) .settings-drawer::before {
        background: rgba(0,0,0,0.18);
    }
}

/* ============================================
   Sermon Player Page
   ============================================ */

[data-theme="dark"] .sermon-player-wrapper {
    background: #121212;
}

/* ============================================
   Downloads, Change Password, QR Scanner
   ============================================ */

[data-theme="dark"] .downloads-page,
[data-theme="dark"] .change-password-page,
[data-theme="dark"] .qr-scanner-page {
    background: #121212;
}

/* ============================================
   Sermon Grid Cards (sermon_grid.css)
   ============================================ */

[data-theme="dark"] .sermon-grid-card {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .sermon-grid-play-btn {
    background: #2a2a2a;
    color: #4CAF50;
}

[data-theme="dark"] .sermon-grid-title {
    color: #e0e0e0;
}

[data-theme="dark"] .sermon-grid-mosque {
    color: #4CAF50;
}

[data-theme="dark"] .sermon-grid-meta {
    color: #888;
}

[data-theme="dark"] .sermon-grid-duration {
    background: rgba(0, 0, 0, 0.8);
}

[data-theme="dark"] .lang-badge {
    background: #2a2a2a;
    color: #a0a0a0;
}

[data-theme="dark"] .sermon-grid-hidden-badge {
    background: #3d1c1c;
    color: #ef5350;
}

[data-theme="dark"] .sermon-grid-stats {
    color: #888;
}

[data-theme="dark"] .sermon-grid-action {
    color: #4CAF50;
    border-top-color: #333;
}

[data-theme="dark"] .sermon-grid-skeleton {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .sermon-grid-skeleton .skel-thumb {
    background: #2a2a2a;
}

[data-theme="dark"] .sermon-grid-skeleton .skel-line {
    background: #2a2a2a;
}

/* Archive browse sidebar dark overrides */
[data-theme="dark"] .filter-section {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .filter-title {
    color: #e0e0e0;
}

[data-theme="dark"] .checkbox-item {
    color: #ccc;
}

[data-theme="dark"] .checkbox-item input {
    accent-color: #4CAF50;
}

[data-theme="dark"] .filter-search-input {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .date-input {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .date-label {
    color: #888;
}

[data-theme="dark"] .sort-select {
    background: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

[data-theme="dark"] .browse-header h1 {
    color: #e0e0e0;
}

[data-theme="dark"] .browse-back {
    color: #4CAF50;
}

[data-theme="dark"] .category-tab {
    background: #2a2a2a;
    border-color: #444;
    color: #a0a0a0;
}

[data-theme="dark"] .category-tab.active {
    background: #1a5f3c;
    border-color: #1a5f3c;
    color: white;
}

[data-theme="dark"] .mobile-filter-toggle {
    background: #1e1e1e;
    border-color: #444;
    color: #ccc;
}

[data-theme="dark"] .btn-clear-filters {
    color: #888;
}

[data-theme="dark"] .btn-clear-filters:hover {
    color: #e0e0e0;
}

[data-theme="dark"] .browse-sidebar .filter-section {
    border-color: #333;
}

[data-theme="dark"] .page-dots {
    color: #888;
}

/* --- Mosque Grid Cards (Dark) --- */

[data-theme="dark"] .mosque-grid-card {
    background: #1e1e1e;
    border-color: #333;
}

[data-theme="dark"] .mosque-grid-thumb {
    background: linear-gradient(135deg, #1a3a2a 0%, #1e4d35 100%);
}

[data-theme="dark"] .mosque-grid-name {
    color: #e0e0e0;
}

[data-theme="dark"] .mosque-grid-name-ar {
    color: #e0e0e0;
}

[data-theme="dark"] .mosque-grid-name-en {
    color: #999;
}

[data-theme="dark"] .mosque-grid-location {
    color: #888;
}

[data-theme="dark"] .mosque-grid-stats {
    border-top-color: #333;
}

[data-theme="dark"] .mosque-grid-stat-value {
    color: #4CAF50;
}

[data-theme="dark"] .mosque-grid-stat-label {
    color: #777;
}

/* ============================================
   Scrollbar Styling
   ============================================ */

[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #1e1e1e;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #444;
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* ============================================
   Admin Analytics Page
   ============================================ */

[data-theme="dark"] .progress-bar-bg {
    background: #333;
}

[data-theme="dark"] .breakdown-bar-bg {
    background: #333;
}

/* ============================================
   Selection / Highlight Colors
   ============================================ */

[data-theme="dark"] ::selection {
    background: #4CAF50;
    color: #fff;
}