/* ═══════════════════════════════════════════════════════════════════════════════
   JESTHA NAGARIK SEWA SAMAJ - PREMIUM THEME
   Deep Blue + Gold + White Color Scheme
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────────────
   COLOR PALETTE
   ─────────────────────────────────────────────────────────────────────────────── */
:root {
    /* Primary Theme Colors */
    --theme-trust-blue: #0A2540;       /* Deep Trust Blue - Primary */
    --theme-premium-gold: #D4AF37;     /* Premium Gold - Accent */
    --theme-soft-white: #F8FAFC;       /* Soft White - Background */
    --theme-secondary-blue: #1E3A5F;   /* Secondary Blue */
    --theme-cream: #FDF8F3;            /* Warm Cream - Section Background */
    --theme-cream-dark: #F5EDE4;       /* Darker Cream for hover/contrast */
    
    /* Extended Palette */
    --theme-gold-light: #E8C872;       /* Light Gold */
    --theme-gold-dark: #B8962F;        /* Dark Gold */
    --theme-blue-light: #2D5A87;       /* Light Blue */
    --theme-blue-darker: #061526;      /* Darker Blue */
    
    /* Functional Colors */
    --theme-text-primary: #0A2540;
    --theme-text-secondary: #475569;
    --theme-text-light: #64748B;
    --theme-text-on-dark: #F8FAFC;
    --theme-text-on-gold: #0A2540;
    
    /* Background Colors */
    --theme-bg-primary: #FFFFFF;
    --theme-bg-secondary: #F8FAFC;
    --theme-bg-tertiary: #F1F5F9;
    --theme-bg-cream: #FDF8F3;         /* Cream background for sections */
    --theme-bg-dark: #0A2540;
    --theme-bg-dark-secondary: #1E3A5F;
    
    /* Border Colors */
    --theme-border-light: #E2E8F0;
    --theme-border-medium: #CBD5E1;
    --theme-border-gold: rgba(212, 175, 55, 0.3);
    
    /* Shadows */
    --theme-shadow-sm: 0 2px 8px rgba(10, 37, 64, 0.08);
    --theme-shadow-md: 0 8px 24px rgba(10, 37, 64, 0.12);
    --theme-shadow-lg: 0 16px 48px rgba(10, 37, 64, 0.15);
    --theme-shadow-gold: 0 8px 25px rgba(212, 175, 55, 0.35);
    
    /* Gradients */
    --theme-gradient-primary: linear-gradient(135deg, var(--theme-trust-blue) 0%, var(--theme-secondary-blue) 100%);
    --theme-gradient-gold: linear-gradient(135deg, var(--theme-premium-gold) 0%, var(--theme-gold-dark) 100%);
    --theme-gradient-hero: linear-gradient(135deg, rgba(10, 37, 64, 0.92) 0%, rgba(30, 58, 95, 0.88) 50%, rgba(10, 37, 64, 0.95) 100%);
    --theme-gradient-text: linear-gradient(135deg, var(--theme-premium-gold) 0%, #E8C872 50%, var(--theme-gold-dark) 100%);
    
    /* Transitions */
    --theme-transition-fast: 0.2s ease;
    --theme-transition-normal: 0.3s ease;
    --theme-transition-slow: 0.5s ease;
    
    /* Border Radius */
    --theme-radius-sm: 8px;
    --theme-radius-md: 12px;
    --theme-radius-lg: 20px;
    --theme-radius-xl: 32px;
    --theme-radius-full: 9999px;
}

/* Dark Mode Theme Colors */
html[data-theme="dark"] {
    --theme-bg-primary: #0A2540;
    --theme-bg-secondary: #0F2D4A;
    --theme-bg-tertiary: #1E3A5F;
    --theme-bg-cream: #1A3550;          /* Dark mode cream alternative */
    --theme-cream: #1A3550;
    --theme-text-primary: #F8FAFC;
    --theme-text-secondary: #CBD5E1;
    --theme-text-light: #94A3B8;
    --theme-border-light: rgba(212, 175, 55, 0.2);
    --theme-border-medium: rgba(212, 175, 55, 0.3);
}

/* ───────────────────────────────────────────────────────────────────────────────
   BODY & BASE STYLES
   ─────────────────────────────────────────────────────────────────────────────── */
body {
    background-color: var(--theme-cream);
    color: var(--theme-text-primary);
}

/* ───────────────────────────────────────────────────────────────────────────────
   NAVIGATION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.navbar-professional {
    background: linear-gradient(135deg, var(--theme-cream) 0%, #F5EDE4 100%);
    border-bottom: 2px solid rgba(212, 175, 55, 0.2);
    box-shadow: 0 2px 12px rgba(10, 37, 64, 0.08);
}

html[data-theme="dark"] .navbar-professional {
    background: linear-gradient(135deg, var(--theme-trust-blue) 0%, var(--theme-secondary-blue) 100%);
    border-bottom-color: rgba(212, 175, 55, 0.3);
}

.navbar-menu-pro a,
.navbar-menu-pro .submenu-toggle {
    color: var(--theme-trust-blue);
    font-weight: 600;
}

.navbar-menu-pro a:hover,
.navbar-menu-pro .submenu-toggle:hover {
    color: var(--theme-premium-gold);
}

.navbar-menu-pro a::after {
    background: var(--theme-premium-gold);
}

html[data-theme="dark"] .navbar-menu-pro a,
html[data-theme="dark"] .navbar-menu-pro .submenu-toggle {
    color: var(--theme-soft-white);
}

html[data-theme="dark"] .navbar-menu-pro a:hover,
html[data-theme="dark"] .navbar-menu-pro .submenu-toggle:hover {
    color: var(--theme-premium-gold);
}

/* Submenu Theme */
.navbar-menu-pro .submenu {
    background: var(--theme-bg-primary);
    border: 1px solid var(--theme-border-gold);
    box-shadow: var(--theme-shadow-lg);
}

html[data-theme="dark"] .navbar-menu-pro .submenu {
    background: var(--theme-secondary-blue);
    border-color: rgba(212, 175, 55, 0.3);
}

.navbar-menu-pro .submenu a:hover {
    background: rgba(212, 175, 55, 0.1);
    color: var(--theme-premium-gold);
    border-left-color: var(--theme-premium-gold);
}

/* Theme Toggle Button */
.theme-toggle-pro {
    background: rgba(10, 37, 64, 0.1);
    border: 1px solid rgba(10, 37, 64, 0.2);
    color: var(--theme-trust-blue);
}

.theme-toggle-pro:hover {
    background: rgba(212, 175, 55, 0.15);
    border-color: var(--theme-premium-gold);
    color: var(--theme-premium-gold);
}

html[data-theme="dark"] .theme-toggle-pro {
    background: rgba(212, 175, 55, 0.1);
    border-color: rgba(212, 175, 55, 0.3);
    color: var(--theme-premium-gold);
}

/* Language Switcher */
.lang-toggle-pro {
    color: var(--theme-trust-blue);
}

.lang-toggle-pro:hover {
    background: rgba(212, 175, 55, 0.1);
    color: var(--theme-premium-gold);
    border-color: rgba(212, 175, 55, 0.3);
}

html[data-theme="dark"] .lang-toggle-pro {
    color: var(--theme-soft-white);
}

html[data-theme="dark"] .lang-toggle-pro:hover {
    color: var(--theme-premium-gold);
    background: rgba(212, 175, 55, 0.15);
}

/* Premium Donate Button - Light Mode (Orange) */
.btn-donate-pro {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A24 50%, #FF6B35 100%);
    background-size: 200% 200%;
    color: #FFFFFF !important;
    font-weight: 700;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(255, 107, 53, 0.35);
    border: 2px solid transparent;
}

.btn-donate-pro:hover {
    background: linear-gradient(135deg, #FF8555 0%, #FF6B35 50%, #FF8555 100%);
    color: #FFFFFF !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(255, 107, 53, 0.5);
}

/* ───────────────────────────────────────────────────────────────────────────────
   HERO SECTION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.hero-home .hero-overlay {
    background: var(--theme-gradient-hero);
}

.hero-home .hero-badge {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.25) 0%, rgba(212, 175, 55, 0.15) 100%);
    border: 2px solid rgba(212, 175, 55, 0.5);
    color: var(--theme-soft-white);
}

.hero-home .badge-pulse {
    background: var(--theme-premium-gold);
    box-shadow: 0 0 10px var(--theme-premium-gold), 0 0 20px var(--theme-premium-gold);
}

.hero-home .hero-title .line.gradient {
    background: linear-gradient(135deg, var(--theme-premium-gold) 0%, #E8C872 40%, var(--theme-gold-dark) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Hero Stats */
.hero-home .hero-stats {
    background: linear-gradient(135deg, rgba(30, 58, 95, 0.95) 0%, rgba(10, 37, 64, 0.98) 100%);
    border: 1px solid rgba(212, 175, 55, 0.25);
}

.hero-home .stat-num {
    background: linear-gradient(135deg, #FFFFFF 0%, var(--theme-premium-gold) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Hero Buttons */
.hero-home .hero-cta .btn-primary,
.btn-primary {
    background: var(--theme-gradient-gold);
    color: var(--theme-trust-blue);
    border-color: var(--theme-premium-gold);
    font-weight: 700;
}

.hero-home .hero-cta .btn-primary:hover,
.btn-primary:hover {
    background: linear-gradient(135deg, #E8C872 0%, var(--theme-premium-gold) 100%);
    transform: translateY(-3px);
    box-shadow: var(--theme-shadow-gold);
}

.hero-home .hero-cta .btn-outline {
    color: var(--theme-soft-white);
    border-color: rgba(212, 175, 55, 0.5);
    background: rgba(212, 175, 55, 0.1);
}

.hero-home .hero-cta .btn-outline:hover {
    background: rgba(212, 175, 55, 0.25);
    border-color: var(--theme-premium-gold);
    color: var(--theme-premium-gold);
}

/* ───────────────────────────────────────────────────────────────────────────────
   BUTTONS THEME - ORANGE DONATE BUTTONS
   ─────────────────────────────────────────────────────────────────────────────── */
.btn-glow {
    animation: orangeGlow 2s ease-in-out infinite alternate;
}

@keyframes orangeGlow {
    from { box-shadow: 0 4px 15px rgba(255, 107, 53, 0.4); }
    to { box-shadow: 0 4px 30px rgba(255, 107, 53, 0.7); }
}

/* Hero & Donate Section Primary Buttons - Orange */
.hero-cta .btn-primary,
.donate-cta .btn-primary,
.cta-box .btn-primary,
.btn-primary.btn-glow,
.btn-primary.btn-lg {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A24 50%, #FF6B35 100%) !important;
    background-size: 200% 200%;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(255, 107, 53, 0.35);
}

.hero-cta .btn-primary:hover,
.donate-cta .btn-primary:hover,
.cta-box .btn-primary:hover,
.btn-primary.btn-glow:hover,
.btn-primary.btn-lg:hover {
    background: linear-gradient(135deg, #FF8555 0%, #FF6B35 50%, #FF8555 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 25px rgba(255, 107, 53, 0.55);
}

.btn-outline {
    color: var(--theme-trust-blue);
    border-color: var(--theme-border-medium);
}

.btn-outline:hover {
    border-color: var(--theme-premium-gold);
    color: var(--theme-premium-gold);
    background: rgba(212, 175, 55, 0.08);
}

html[data-theme="dark"] .btn-outline {
    color: var(--theme-soft-white);
    border-color: rgba(212, 175, 55, 0.4);
}

html[data-theme="dark"] .btn-outline:hover {
    color: var(--theme-premium-gold);
    border-color: var(--theme-premium-gold);
    background: rgba(212, 175, 55, 0.15);
}

/* ───────────────────────────────────────────────────────────────────────────────
   SECTION HEADERS THEME
   Provides a consistent, attractive pill-style badge for section tags
   with light + dark theme variations for good contrast.
   ─────────────────────────────────────────────────────────────────────────────── */
.section-tag {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    background: linear-gradient(135deg, var(--theme-trust-blue) 0%, var(--theme-secondary-blue) 100%);
    border: 1px solid var(--theme-trust-blue);
    box-shadow: 0 8px 24px rgba(10, 37, 64, 0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.section-tag:hover {
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 12px 36px rgba(10, 37, 64, 0.12);
    background: linear-gradient(135deg, var(--theme-secondary-blue) 0%, var(--theme-trust-blue) 100%);
}

.section-title {
    color: var(--theme-trust-blue);
}

/* Dark theme: use subtle translucent background with premium-gold text */
html[data-theme="dark"] .section-tag {
    color: var(--theme-premium-gold) !important;
    background: rgba(212,175,55,0.08);
    border: 1px solid rgba(212,175,55,0.18);
    box-shadow: none;
}

html[data-theme="dark"] .section-tag:hover {
    background: rgba(212,175,55,0.12);
    transform: translateY(-3px) scale(1.02);
}

/* Improve spacing and style for the "View All Programs" CTA to prevent overlap
   and make it visually prominent without touching other sections */
.programs-section {
    /* ensure enough breathing room below the section */
    padding-bottom: 4.5rem;
}

.programs-section .section-cta {
    margin-top: 32px;
    margin-bottom: 36px; /* extra gap to avoid touching next section */
    position: relative;
    z-index: 5; /* keep the button above adjacent section backgrounds */
    text-align: center;
}

.programs-section .section-cta .btn.btn-outline {
    background: #ffffff;
    color: var(--theme-trust-blue);
    border: 1px solid rgba(10,37,64,0.08);
    padding: 12px 22px;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(10,37,64,0.10);
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.programs-section .section-cta .btn.btn-outline:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 50px rgba(10,37,64,0.14);
    background: linear-gradient(135deg, var(--theme-trust-blue) 0%, var(--theme-secondary-blue) 100%);
    color: #ffffff;
    border-color: transparent;
}

/* Dark theme adjustments: keep contrast but subtle */
html[data-theme="dark"] .programs-section .section-cta .btn.btn-outline {
    background: rgba(255,255,255,0.03);
    color: var(--theme-soft-white);
    border: 1px solid rgba(255,255,255,0.06);
    box-shadow: none;
}

html[data-theme="dark"] .programs-section .section-cta .btn.btn-outline:hover {
    background: linear-gradient(135deg, rgba(74,111,255,0.16) 0%, rgba(157,110,199,0.16) 100%);
    color: var(--theme-soft-white);
    box-shadow: 0 12px 30px rgba(0,0,0,0.35);
}

/* Responsive: keep section titles single-line on medium+ screens for a cleaner look
   but allow stacking on very small screens to avoid overflow. This overrides
   older styles in premium-home.css/minified files without editing vendor files. */
@media (min-width: 576px) {
    .section-title span { display: inline; }
    .section-title span.gradient { display: inline; }
}

@media (max-width: 575.98px) {
    .section-title span { display: block; }
}

html[data-theme="dark"] .section-title {
    color: var(--theme-soft-white);
}

.section-title .gradient,
.gradient {
    background: var(--theme-gradient-text);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Title underline */
.section-title:after {
    background: var(--theme-gradient-gold);
}

/* ───────────────────────────────────────────────────────────────────────────────
   CARDS THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.card,
.about-card,
.program-card-clean,
.activity-card-clean,
.testimonial-card,
.news-card {
    background: var(--theme-bg-primary);
    border: 1px solid var(--theme-border-light);
    box-shadow: var(--theme-shadow-sm);
    transition: all var(--theme-transition-normal);
}

/* Footer quick links two-column layout */
.footer .quick-links-list {
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
    column-gap: 1rem;
}

/* Small screens: single column */
@media (max-width: 767px) {
    .footer .quick-links-list {
        -webkit-columns: 1;
        -moz-columns: 1;
        columns: 1;
    }
}

.card:hover,
.about-card:hover,
.program-card-clean:hover,
.activity-card-clean:hover,
.testimonial-card:hover,
.news-card:hover {
    border-color: var(--theme-border-gold);
    box-shadow: var(--theme-shadow-lg);
    transform: translateY(-5px);
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .about-card,
html[data-theme="dark"] .program-card-clean,
html[data-theme="dark"] .activity-card-clean,
html[data-theme="dark"] .testimonial-card,
html[data-theme="dark"] .news-card {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.15);
}

html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .about-card:hover,
html[data-theme="dark"] .program-card-clean:hover,
html[data-theme="dark"] .activity-card-clean:hover,
html[data-theme="dark"] .testimonial-card:hover,
html[data-theme="dark"] .news-card:hover {
    border-color: rgba(212, 175, 55, 0.4);
}

.card-title,
.card h3 {
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] .card-title,
html[data-theme="dark"] .card h3 {
    color: var(--theme-soft-white);
}

/* Card Icons - Enhanced Contrast */
.about-card .card-icon,
.program-icon,
.value-item i,
.impact-icon,
.impact-stat-icon {
    background: linear-gradient(135deg, #0A2540 0%, #1E3A5F 100%);
    color: #D4AF37;
    box-shadow: 0 4px 15px rgba(10, 37, 64, 0.3);
}

.about-card .card-icon i,
.program-icon i,
.value-item i {
    color: #D4AF37 !important;
    font-size: 1.5rem;
}

html[data-theme="dark"] .about-card .card-icon,
html[data-theme="dark"] .program-icon {
    background: linear-gradient(135deg, #D4AF37 0%, #B8962F 100%);
    color: #0A2540;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.4);
}

html[data-theme="dark"] .about-card .card-icon i,
html[data-theme="dark"] .program-icon i {
    color: #0A2540 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   ABOUT SECTION THEME (Mission, Vision, Values)
   ─────────────────────────────────────────────────────────────────────────────── */
.about-section {
    background: var(--theme-cream);
}

.visual-badge {
    background: var(--theme-gradient-gold);
    color: var(--theme-trust-blue);
    box-shadow: 0 10px 30px rgba(212, 175, 55, 0.4);
}

.values-grid {
    border-top-color: var(--theme-border-gold);
}

.value-item i {
    color: var(--theme-premium-gold);
    background: none;
}

/* ───────────────────────────────────────────────────────────────────────────────
   PROGRAMS SECTION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.programs-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .programs-section {
    background: var(--theme-bg-secondary);
}

.program-list-item {
    background: var(--theme-bg-primary);
    border: 1px solid var(--theme-border-light);
}

.program-list-item:hover {
    border-color: var(--theme-premium-gold);
    box-shadow: var(--theme-shadow-md);
}

html[data-theme="dark"] .program-list-item {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.15);
}

/* Program List Icons - Vibrant & High Contrast - Alternating Gold/Navy */
.program-list-item .program-icon {
    background: linear-gradient(135deg, #D4AF37 0%, #C9A227 100%);
    color: #0A2540;
    width: 60px;
    height: 60px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.5);
    border: 2px solid rgba(212, 175, 55, 0.4);
}

.program-list-item .program-icon i {
    color: #0A2540 !important;
    font-size: 1.5rem;
}

.program-list-item:nth-child(2) .program-icon {
    background: linear-gradient(135deg, #0A2540 0%, #1E3A5F 100%);
    color: #D4AF37;
    border-color: rgba(212, 175, 55, 0.3);
    box-shadow: 0 6px 20px rgba(10, 37, 64, 0.4);
}

.program-list-item:nth-child(2) .program-icon i {
    color: #D4AF37 !important;
}

.program-list-item:nth-child(3) .program-icon {
    background: linear-gradient(135deg, #E8C872 0%, #D4AF37 100%);
    color: #0A2540;
    border-color: rgba(212, 175, 55, 0.4);
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.5);
}

.program-list-item:nth-child(3) .program-icon i {
    color: #0A2540 !important;
}

.program-list-item:nth-child(4) .program-icon {
    background: linear-gradient(135deg, #1E3A5F 0%, #0A2540 100%);
    color: #D4AF37;
    border-color: rgba(212, 175, 55, 0.3);
    box-shadow: 0 6px 20px rgba(10, 37, 64, 0.4);
}

.program-list-item:nth-child(4) .program-icon i {
    color: #D4AF37 !important;
}

.program-list-item:nth-child(5) .program-icon {
    background: linear-gradient(135deg, #0A2540 0%, #1E3A5F 100%);
    color: #D4AF37;
    border-color: rgba(212, 175, 55, 0.3);
    box-shadow: 0 6px 20px rgba(10, 37, 64, 0.4);
}

.program-list-item:nth-child(5) .program-icon i {
    color: #D4AF37 !important;
}

/* Hover effect for all program icons */
.program-list-item:hover .program-icon {
    transform: scale(1.05);
    box-shadow: 0 8px 25px rgba(212, 175, 55, 0.5);
}

.program-list-item .program-info h3 {
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] .program-list-item .program-info h3 {
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   IMPACT SECTION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.impact-section {
    background: var(--theme-gradient-primary);
    position: relative;
}

.impact-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(10, 37, 64, 0.95) 0%, rgba(30, 58, 95, 0.9) 100%);
}

.impact-section .section-header.light .section-tag {
    color: var(--theme-premium-gold);
}

.impact-section .section-header.light .section-title {
    color: var(--theme-soft-white);
}

.impact-card {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(212, 175, 55, 0.2);
    backdrop-filter: blur(10px);
    border-radius: var(--theme-radius-lg);
    padding: 32px;
    text-align: center;
    transition: all var(--theme-transition-normal);
}

.impact-card:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(212, 175, 55, 0.5);
    transform: translateY(-8px);
}

.impact-card .impact-icon {
    width: 70px;
    height: 70px;
    background: var(--theme-gradient-gold);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-size: 1.8rem;
    color: var(--theme-trust-blue);
}

.impact-card .impact-num {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--theme-premium-gold);
}

.impact-card .impact-label {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.95rem;
    margin-top: 8px;
}

.impact-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 30px;
}

/* ───────────────────────────────────────────────────────────────────────────────
   GALLERY SECTION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.gallery-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .gallery-section {
    background: var(--theme-bg-secondary);
}

.gallery-item {
    border-radius: var(--theme-radius-md);
    overflow: hidden;
    position: relative;
    box-shadow: var(--theme-shadow-sm);
    transition: all var(--theme-transition-normal);
}

.gallery-item:hover {
    transform: scale(1.03);
    box-shadow: var(--theme-shadow-lg);
}

.gallery-item .overlay {
    position: absolute;
    inset: 0;
    background: rgba(10, 37, 64, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity var(--theme-transition-normal);
}

.gallery-item:hover .overlay {
    opacity: 1;
}

.gallery-item .overlay i {
    color: var(--theme-premium-gold);
    font-size: 2rem;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.gallery-item img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DONATE SECTION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.donate-section {
    background: var(--theme-gradient-primary);
    position: relative;
}

.donate-wrapper {
    position: relative;
    z-index: 1;
    padding: 60px;
    max-width: 980px; /* wider card so longer headings fit on a single line */
    width: 100%;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: var(--theme-radius-xl);
    backdrop-filter: blur(10px);
}

.donate-content {
    color: var(--theme-soft-white);
}

.donate-content .section-tag {
    color: var(--theme-premium-gold);
}

.donate-content .section-title {
    color: var(--theme-soft-white);
}

.donate-tiers {
    display: flex;
    gap: 20px;
    margin: 30px 0;
    flex-wrap: wrap;
}

.donate-tiers .tier {
    padding: 20px 24px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(212, 175, 55, 0.3);
    border-radius: var(--theme-radius-md);
    text-align: center;
    flex: 1;
    min-width: 150px;
}

.donate-tiers .tier .amount {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--theme-premium-gold);
    margin-bottom: 8px;
}

.donate-tiers .tier span:last-child {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9rem;
}

/* ───────────────────────────────────────────────────────────────────────────────
   NEWSLETTER SECTION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.newsletter-section {
    background: var(--theme-cream);
    padding: 80px 0;
}

html[data-theme="dark"] .newsletter-section {
    background: var(--theme-bg-secondary);
}

.newsletter-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
    padding: 40px;
    background: #FFFFFF;
    border-radius: var(--theme-radius-xl);
    box-shadow: var(--theme-shadow-md);
    border: 1px solid var(--theme-border-light);
}

html[data-theme="dark"] .newsletter-wrapper {
    background: var(--theme-bg-tertiary);
    border-color: rgba(212, 175, 55, 0.2);
}

.newsletter-content h3 {
    font-size: 1.5rem;
    color: #0A2540 !important;
    -webkit-text-fill-color: #0A2540 !important;
    margin-bottom: 8px;
}

html[data-theme="dark"] .newsletter-content h3 {
    color: #F8FAFC !important;
    -webkit-text-fill-color: #F8FAFC !important;
}

.newsletter-content p {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

html[data-theme="dark"] .newsletter-content p {
    color: #CBD5E1 !important;
    -webkit-text-fill-color: #CBD5E1 !important;
}

.newsletter-form {
    display: flex;
    gap: 12px;
}

.newsletter-form input {
    padding: 14px 20px;
    border: 2px solid var(--theme-border-medium);
    border-radius: var(--theme-radius-md);
    font-size: 1rem;
    min-width: 280px;
    background: var(--theme-bg-primary);
    color: var(--theme-text-primary);
    transition: all var(--theme-transition-normal);
}

.newsletter-form input:focus {
    outline: none;
    border-color: var(--theme-premium-gold);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.15);
}

html[data-theme="dark"] .newsletter-form input {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.3);
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   FOOTER THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.footer {
    background: linear-gradient(180deg, var(--theme-trust-blue) 0%, var(--theme-blue-darker) 100%);
    color: var(--theme-soft-white);
    border-top: 3px solid var(--theme-premium-gold);
}

.footer h5 {
    color: var(--theme-premium-gold);
    font-weight: 700;
}

.footer a:not(.btn):not(.btn-accent),
.footer li a:not(.btn):not(.btn-accent),
.footer ul a:not(.btn):not(.btn-accent),
.footer .list-unstyled a:not(.btn):not(.btn-accent) {
    color: rgba(248, 250, 252, 0.85) !important;
    -webkit-text-fill-color: rgba(248, 250, 252, 0.85) !important;
    transition: color var(--theme-transition-fast);
}

.footer a:not(.btn):not(.btn-accent):hover,
.footer li a:not(.btn):not(.btn-accent):hover,
.footer ul a:not(.btn):not(.btn-accent):hover,
.footer .list-unstyled a:not(.btn):not(.btn-accent):hover {
    color: var(--theme-premium-gold) !important;
    -webkit-text-fill-color: var(--theme-premium-gold) !important;
}

.footer li,
.footer ul li,
.footer .list-unstyled li {
    color: rgba(248, 250, 252, 0.85) !important;
}

.footer p {
    color: rgba(248, 250, 252, 0.8) !important;
}

.footer-bottom {
    border-top-color: rgba(212, 175, 55, 0.2);
    color: rgba(248, 250, 252, 0.7);
}

.social-links a {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(212, 175, 55, 0.1);
    border: 1px solid rgba(212, 175, 55, 0.3);
    transition: all var(--theme-transition-normal);
}

.social-links a:hover {
    background: var(--theme-premium-gold);
    color: var(--theme-trust-blue) !important;
    transform: translateY(-3px);
}

/* Ensure icons inside social links keep their color and do not become transparent
   due to any text-fill or background-clip rules elsewhere. */
.social-links a i,
.social-links a svg {
    color: inherit;
    -webkit-text-fill-color: inherit;
}

.social-links a:hover i,
.social-links a:hover svg {
    color: var(--theme-text-on-gold) !important;
    -webkit-text-fill-color: var(--theme-text-on-gold) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   FORM CONTROLS THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.form-control {
    border-color: var(--theme-border-medium);
    background: var(--theme-bg-primary);
    color: var(--theme-text-primary);
}

.form-control:focus {
    border-color: var(--theme-premium-gold);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25);
}

html[data-theme="dark"] .form-control {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.3);
    color: var(--theme-soft-white);
}

.form-label {
    color: var(--theme-text-primary);
    font-weight: 600;
}

html[data-theme="dark"] .form-label {
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   MEMBERSHIP & BOARD CARDS THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.membership-card {
    background: var(--theme-gradient-primary);
    color: var(--theme-soft-white);
    border: 2px solid rgba(212, 175, 55, 0.3);
}

.membership-card h3 {
    color: var(--theme-premium-gold);
}

.board-member-card {
    background: var(--theme-bg-primary);
    border: 1px solid var(--theme-border-light);
}

html[data-theme="dark"] .board-member-card {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.2);
}

.board-member-photo {
    border-color: var(--theme-premium-gold);
}

.board-member-name {
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] .board-member-name {
    color: var(--theme-soft-white);
}

.board-member-position {
    color: var(--theme-premium-gold);
}

/* ───────────────────────────────────────────────────────────────────────────────
   ALERTS THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.alert-success {
    background: rgba(16, 185, 129, 0.1);
    border-left: 4px solid #10B981;
}

.alert-danger {
    background: rgba(239, 68, 68, 0.1);
    border-left: 4px solid #EF4444;
}

.alert-warning {
    background: rgba(212, 175, 55, 0.15);
    border-left: 4px solid var(--theme-premium-gold);
    color: var(--theme-text-primary);
}

.alert-info {
    background: rgba(30, 58, 95, 0.1);
    border-left: 4px solid var(--theme-secondary-blue);
}

/* ───────────────────────────────────────────────────────────────────────────────
   PAGE HERO / BANNER THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.page-hero,
.page-banner,
.hero-banner {
    background: var(--theme-gradient-primary);
    color: var(--theme-soft-white);
    position: relative;
}

.page-hero::before,
.page-banner::before,
.hero-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, transparent 50%);
    pointer-events: none;
}

.page-hero h1,
.page-banner h1,
.hero-banner h1 {
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   BLOG PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.news-read-more,
.activity-card-link {
    background: var(--theme-trust-blue);
    color: var(--theme-soft-white);
}

.news-read-more:hover,
.activity-card-link:hover {
    background: var(--theme-secondary-blue);
}

/* ───────────────────────────────────────────────────────────────────────────────
   PAGINATION THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.pagination .page-link {
    color: var(--theme-trust-blue);
    border-color: var(--theme-border-medium);
}

.pagination .page-link:hover {
    background: rgba(212, 175, 55, 0.1);
    border-color: var(--theme-premium-gold);
    color: var(--theme-premium-gold);
}

.pagination .page-item.active .page-link {
    background: var(--theme-gradient-gold);
    border-color: var(--theme-premium-gold);
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] .pagination .page-link {
    color: var(--theme-soft-white);
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.3);
}

/* ───────────────────────────────────────────────────────────────────────────────
   SCROLL TO TOP BUTTON
   ─────────────────────────────────────────────────────────────────────────────── */
.scroll-to-top {
    background: var(--theme-gradient-gold);
    color: var(--theme-trust-blue);
    border: none;
    box-shadow: var(--theme-shadow-gold);
}

.scroll-to-top:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(212, 175, 55, 0.5);
}

/* ───────────────────────────────────────────────────────────────────────────────
   ABOUT PAGE SPECIFIC - TOC SIDEBAR
   ─────────────────────────────────────────────────────────────────────────────── */
.toc-sidebar {
    background: var(--theme-bg-primary);
    border: 1px solid var(--theme-border-light);
}

html[data-theme="dark"] .toc-sidebar {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.2);
}

.toc-title {
    color: var(--theme-trust-blue);
    border-bottom: 2px solid var(--theme-premium-gold);
}

html[data-theme="dark"] .toc-title {
    color: var(--theme-premium-gold);
}

.toc-link {
    color: var(--theme-text-secondary);
}

.toc-link:hover,
.toc-link.active {
    color: var(--theme-premium-gold);
    border-left-color: var(--theme-premium-gold);
}

/* ───────────────────────────────────────────────────────────────────────────────
   CONTACT PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.contact-info-card {
    background: var(--theme-bg-primary);
    border: 1px solid var(--theme-border-light);
}

.contact-info-card:hover {
    border-color: var(--theme-border-gold);
}

html[data-theme="dark"] .contact-info-card {
    background: var(--theme-bg-secondary);
    border-color: rgba(212, 175, 55, 0.2);
}

.contact-icon {
    background: var(--theme-gradient-gold);
    color: var(--theme-trust-blue);
}

/* ───────────────────────────────────────────────────────────────────────────────
   RESPONSIVE ADJUSTMENTS
   ─────────────────────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .newsletter-wrapper {
        flex-direction: column;
        text-align: center;
    }
    
    .newsletter-form {
        flex-direction: column;
        width: 100%;
    }
    
    .newsletter-form input {
        min-width: auto;
        width: 100%;
    }
    
    .donate-wrapper {
        padding: 40px 24px;
    }
    
    .donate-tiers {
        flex-direction: column;
    }
    
    .donate-tiers .tier {
        min-width: auto;
    }
    
    .impact-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .impact-grid {
        grid-template-columns: 1fr;
    }
    
    .hero-home .hero-stats {
        flex-direction: column;
    }
    
    .hero-home .stat-item::after {
        display: none;
    }
}

/* ───────────────────────────────────────────────────────────────────────────────
   404 PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.error-page h1 {
    color: var(--theme-premium-gold);
    text-shadow: 2px 2px 4px rgba(10, 37, 64, 0.2);
}

.error-page h2 {
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] .error-page h2 {
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   CONTACT PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.contact-hero {
    background: linear-gradient(135deg, rgba(10, 37, 64, 0.05) 0%, rgba(212, 175, 55, 0.08) 100%) !important;
}

html[data-theme="dark"] .contact-hero {
    background: linear-gradient(135deg, rgba(30, 58, 95, 0.3) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
}

.contact-hero h1 {
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] .contact-hero h1 {
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   DONATE PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.fa-hand-holding-heart.text-primary {
    color: var(--theme-premium-gold) !important;
}

.fa-utensils.text-primary,
.fa-heartbeat.text-primary {
    color: var(--theme-premium-gold) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   PROGRAMS PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.program-card {
    border-left: 4px solid var(--theme-premium-gold);
}

.program-date {
    color: var(--theme-premium-gold);
}

/* ───────────────────────────────────────────────────────────────────────────────
   BOARD PAGE THEME
   ─────────────────────────────────────────────────────────────────────────────── */
.board-member-photo {
    border-color: var(--theme-premium-gold);
}

.board-member-position {
    color: var(--theme-premium-gold);
}

/* ───────────────────────────────────────────────────────────────────────────────
   OVERRIDE TEXT-PRIMARY CLASS
   ─────────────────────────────────────────────────────────────────────────────── */
.text-primary {
    color: var(--theme-trust-blue) !important;
}

html[data-theme="dark"] .text-primary {
    color: var(--theme-premium-gold) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   OVERRIDE BG-PRIMARY CLASS
   ─────────────────────────────────────────────────────────────────────────────── */
.bg-primary {
    background-color: var(--theme-trust-blue) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   HEADINGS THEME
   ─────────────────────────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    color: var(--theme-trust-blue);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6 {
    color: var(--theme-soft-white);
}

/* ───────────────────────────────────────────────────────────────────────────────
   LINKS THEME
   ─────────────────────────────────────────────────────────────────────────────── */
a:not(.btn):not(.nav-link):not(.navbar-brand-pro) {
    color: var(--theme-trust-blue);
    transition: color var(--theme-transition-fast);
}

a:not(.btn):not(.nav-link):not(.navbar-brand-pro):hover {
    color: var(--theme-premium-gold);
}

html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.navbar-brand-pro) {
    color: var(--theme-premium-gold);
}

html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.navbar-brand-pro):hover {
    color: #E8C872;
}

/* ───────────────────────────────────────────────────────────────────────────────
   CARD PRIMARY COLOR ICON
   ─────────────────────────────────────────────────────────────────────────────── */
.card-body .fa-2x.text-primary,
.card-body .fa-3x.text-primary,
.card-body .fa-4x.text-primary {
    color: var(--theme-premium-gold) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   CREAM BACKGROUND SECTIONS
   Apply warm cream (#FDF8F3) to content sections
   ─────────────────────────────────────────────────────────────────────────────── */

/* Main container backgrounds on inner pages */
.container.py-5,
.container.py-4,
main > .container {
    background: transparent;
}

/* Inner page content wrappers */
.py-5,
.py-4 {
    background: var(--theme-cream);
}

html[data-theme="dark"] .py-5,
html[data-theme="dark"] .py-4 {
    background: var(--theme-bg-primary);
}

/* Cards should remain white on cream background */
.card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .card {
    background: var(--theme-bg-secondary) !important;
}

/* Values grid row cream background */
.values-grid {
    background: var(--theme-cream);
    padding: 40px;
    border-radius: var(--theme-radius-lg);
    margin-top: 40px;
}

html[data-theme="dark"] .values-grid {
    background: var(--theme-bg-secondary);
}

/* Core values items */
.value-item {
    background: #FFFFFF;
    padding: 30px 20px;
    border-radius: var(--theme-radius-md);
    box-shadow: var(--theme-shadow-sm);
    transition: all var(--theme-transition-normal);
}

.value-item:hover {
    transform: translateY(-5px);
    box-shadow: var(--theme-shadow-md);
}

html[data-theme="dark"] .value-item {
    background: var(--theme-bg-tertiary);
}

/* About page sections */
.about-section,
.mission-section,
.vision-section,
.values-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .about-section,
html[data-theme="dark"] .mission-section,
html[data-theme="dark"] .vision-section,
html[data-theme="dark"] .values-section {
    background: var(--theme-bg-secondary);
}

/* About cards remain white */
.about-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .about-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Program list items with white background on cream section */
.program-list-item {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .program-list-item {
    background: var(--theme-bg-tertiary) !important;
}

/* Contact page hero with cream tint */
.contact-hero {
    background: linear-gradient(135deg, var(--theme-cream) 0%, rgba(212, 175, 55, 0.08) 100%) !important;
}

html[data-theme="dark"] .contact-hero {
    background: linear-gradient(135deg, var(--theme-bg-secondary) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
}

/* Blog page with cream background */
.blog-section,
.news-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .blog-section,
html[data-theme="dark"] .news-section {
    background: var(--theme-bg-secondary);
}

/* News cards white on cream */
.news-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .news-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Membership page sections */
.membership-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .membership-section {
    background: var(--theme-bg-secondary);
}

/* Board member cards white on cream */
.board-member-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .board-member-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Donate page - keep cards white */
.donate-page .card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .donate-page .card {
    background: var(--theme-bg-tertiary) !important;
}

/* Gallery main section cream */
.gallery-main {
    background: var(--theme-cream) !important;
}

html[data-theme="dark"] .gallery-main {
    background: var(--theme-bg-secondary) !important;
}

/* TOC sidebar on about page */
.toc-sidebar {
    background: #FFFFFF;
}

html[data-theme="dark"] .toc-sidebar {
    background: var(--theme-bg-tertiary);
}

/* Form sections cream background */
.contact-form-section,
.membership-form-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .contact-form-section,
html[data-theme="dark"] .membership-form-section {
    background: var(--theme-bg-secondary);
}

/* Alert boxes remain visible on cream */
.alert {
    background: #FFFFFF;
    border-left-width: 4px;
}

.alert-info {
    background: rgba(10, 37, 64, 0.05);
    border-left-color: var(--theme-secondary-blue);
}

.alert-success {
    background: rgba(16, 185, 129, 0.08);
}

.alert-warning {
    background: rgba(212, 175, 55, 0.1);
}

.alert-danger {
    background: rgba(239, 68, 68, 0.08);
}

/* Program cards on programs page */
.program-card-modern,
.program-card-clean {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .program-card-modern,
html[data-theme="dark"] .program-card-clean {
    background: var(--theme-bg-tertiary) !important;
}

/* Testimonial section cream */
.testimonials-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .testimonials-section {
    background: var(--theme-bg-secondary);
}

/* Testimonial cards white */
.testimonial-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .testimonial-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Features section cream */
.features-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .features-section {
    background: var(--theme-bg-secondary);
}

/* Feature cards white */
.feature-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .feature-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Stat cards white on cream sections */
.stat-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .stat-card {
    background: var(--theme-bg-tertiary) !important;
}

/* CTA sections - keep dark/branded */
.cta-section {
    background: var(--theme-gradient-primary);
}

/* Activity cards white */
.activity-card-clean {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .activity-card-clean {
    background: var(--theme-bg-tertiary) !important;
}

/* Page wrappers */
.page-wrapper,
.content-wrapper {
    background: var(--theme-cream);
}

html[data-theme="dark"] .page-wrapper,
html[data-theme="dark"] .content-wrapper {
    background: var(--theme-bg-primary);
}

/* Bootstrap row backgrounds on inner pages */
.row.py-5,
.row.py-4,
.row.py-3 {
    background: transparent;
}

/* Section with cream background class utility */
.bg-cream {
    background: var(--theme-cream) !important;
}

html[data-theme="dark"] .bg-cream {
    background: var(--theme-bg-secondary) !important;
}

/* White card on cream utility */
.card-white {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .card-white {
    background: var(--theme-bg-tertiary) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   EXCLUSIONS - Keep original styling (NOT cream)
   Hero, Footer, Dark Stats/Impact sections
   ─────────────────────────────────────────────────────────────────────────────── */

/* Hero section - keep original, NOT cream */
.premium-hero {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%) !important;
}

.hero-home {
    background: transparent !important;
}

html[data-theme="dark"] .premium-hero {
    background: linear-gradient(135deg, var(--theme-bg-primary) 0%, var(--theme-bg-secondary) 100%) !important;
}

html[data-theme="dark"] .hero-home {
    background: transparent !important;
}

/* Footer - keep dark blue styling */
.premium-footer,
footer.premium-footer,
.site-footer,
footer {
    background: var(--theme-gradient-primary) !important;
}

/* Impact/Stats section - keep dark blue */
.impact-section,
.stats-dark-section,
.dark-stats-section {
    background: var(--theme-gradient-primary) !important;
}

/* Inner page hero banners - slight gold tint, not cream */
.page-hero,
.inner-hero,
.page-banner {
    background: linear-gradient(135deg, var(--theme-primary-blue) 0%, var(--theme-secondary-blue) 100%);
    color: var(--theme-soft-white);
}

.page-hero h1,
.inner-hero h1,
.page-banner h1 {
    color: var(--theme-soft-white);
}

.page-hero .breadcrumb a,
.inner-hero .breadcrumb a,
.page-banner .breadcrumb a {
    color: var(--theme-premium-gold);
}

/* Ensure dark sections with py-5 don't get cream */
.bg-dark.py-5,
.bg-primary.py-5,
.bg-gradient-primary.py-5,
section.impact-section.py-5 {
    background: var(--theme-gradient-primary) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   ABOUT PAGE SECTIONS - CREAM BACKGROUND
   ─────────────────────────────────────────────────────────────────────────────── */

/* About page main sections */
.about-who-we-are,
.about-mvv,
.about-story,
.about-programs,
.about-objectives,
.about-why-we-exist,
.about-daily-programs,
.about-infrastructure,
.about-annual-programs,
.about-sustainability,
.about-long-term {
    background: var(--theme-cream);
}

html[data-theme="dark"] .about-who-we-are,
html[data-theme="dark"] .about-mvv,
html[data-theme="dark"] .about-story,
html[data-theme="dark"] .about-programs,
html[data-theme="dark"] .about-objectives,
html[data-theme="dark"] .about-why-we-exist,
html[data-theme="dark"] .about-daily-programs,
html[data-theme="dark"] .about-infrastructure,
html[data-theme="dark"] .about-annual-programs,
html[data-theme="dark"] .about-sustainability,
html[data-theme="dark"] .about-long-term {
    background: var(--theme-bg-secondary);
}

/* Why We Exist section - dark text for light mode (cream background) */
.about-why-we-exist .section-title,
.about-why-we-exist .story-paragraph,
.about-why-we-exist p {
    color: #1a1a1a !important;
}

/* Why We Exist section - white text for dark mode */
html[data-theme="dark"] .about-why-we-exist .section-title,
html[data-theme="dark"] .about-why-we-exist .story-paragraph,
html[data-theme="dark"] .about-why-we-exist p {
    color: #ffffff !important;
}

/* MVV Cards (Mission/Vision/Values) - white on cream */
.mvv-card {
    background: #FFFFFF !important;
    border-radius: var(--theme-radius-lg);
    box-shadow: var(--theme-shadow-sm);
    transition: all var(--theme-transition-normal);
}

.mvv-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--theme-shadow-md);
}

html[data-theme="dark"] .mvv-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Objective cards */
.objective-card {
    background: #FFFFFF !important;
    border-radius: var(--theme-radius-md);
    box-shadow: var(--theme-shadow-sm);
}

html[data-theme="dark"] .objective-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Program cards on about page */
.about-program-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .about-program-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Story sections */
.story-text-full {
    background: #FFFFFF;
    padding: 40px;
    border-radius: var(--theme-radius-lg);
    box-shadow: var(--theme-shadow-sm);
}

html[data-theme="dark"] .story-text-full {
    background: var(--theme-bg-tertiary);
}

/* Infrastructure cards */
.infrastructure-card {
    background: #FFFFFF !important;
}

html[data-theme="dark"] .infrastructure-card {
    background: var(--theme-bg-tertiary) !important;
}

/* Py-100 sections on inner pages get cream */
.py-100 {
    background: var(--theme-cream);
}

html[data-theme="dark"] .py-100 {
    background: var(--theme-bg-secondary);
}

/* ───────────────────────────────────────────────────────────────────────────────
   INNER PAGES - GENERIC CREAM STYLING
   ─────────────────────────────────────────────────────────────────────────────── */

/* Generic main content area */
main {
    background: var(--theme-cream);
}

html[data-theme="dark"] main {
    background: var(--theme-bg-primary);
}

/* Bootstrap container sections on inner pages */
.container > .row.py-5,
.container > .row.py-4 {
    background: var(--theme-cream);
    padding: 40px;
    border-radius: var(--theme-radius-lg);
    margin-bottom: 30px;
}

html[data-theme="dark"] .container > .row.py-5,
html[data-theme="dark"] .container > .row.py-4 {
    background: var(--theme-bg-secondary);
}

/* Content blocks on blog, membership, etc */
.content-block,
.info-block,
.detail-block {
    background: #FFFFFF;
    padding: 30px;
    border-radius: var(--theme-radius-md);
    box-shadow: var(--theme-shadow-sm);
}

html[data-theme="dark"] .content-block,
html[data-theme="dark"] .info-block,
html[data-theme="dark"] .detail-block {
    background: var(--theme-bg-tertiary);
}

/* Blog single page */
.blog-single-content,
.blog-content-area,
.post-content {
    background: #FFFFFF;
    padding: 40px;
    border-radius: var(--theme-radius-lg);
    box-shadow: var(--theme-shadow-sm);
}

html[data-theme="dark"] .blog-single-content,
html[data-theme="dark"] .blog-content-area,
html[data-theme="dark"] .post-content {
    background: var(--theme-bg-tertiary);
}

/* Board page */
.board-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .board-section {
    background: var(--theme-bg-secondary);
}

/* Donate page sections */
.donate-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .donate-section {
    background: var(--theme-bg-secondary);
}

/* Contact page sections */
.contact-section {
    background: var(--theme-cream);
}

html[data-theme="dark"] .contact-section {
    background: #0D1B2A;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   COMPLETE DARK MODE REWRITE
   Dark Background + White Text for ALL Components
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - ROOT VARIABLES
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] {
    /* Dark Backgrounds */
    --dark-bg-primary: #0D1B2A;
    --dark-bg-secondary: #1B2838;
    --dark-bg-card: #1E3A5F;
    --dark-bg-input: #0D1B2A;
    
    /* White/Light Text */
    --dark-text-primary: #FFFFFF;
    --dark-text-secondary: #E2E8F0;
    --dark-text-muted: #94A3B8;
    
    /* Accent Colors */
    --dark-accent: #D4AF37;
    --dark-accent-light: #E8C872;
    
    /* Borders */
    --dark-border: rgba(255, 255, 255, 0.1);
    --dark-border-accent: rgba(212, 175, 55, 0.3);
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - GLOBAL RESETS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"],
html[data-theme="dark"] body {
    background: #0D1B2A !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] * {
    border-color: rgba(255, 255, 255, 0.1);
}

/* All text white */
html[data-theme="dark"] p,
html[data-theme="dark"] span,
html[data-theme="dark"] div,
html[data-theme="dark"] li,
html[data-theme="dark"] td,
html[data-theme="dark"] th,
html[data-theme="dark"] label,
html[data-theme="dark"] small,
html[data-theme="dark"] strong,
html[data-theme="dark"] em,
html[data-theme="dark"] blockquote {
    color: #E2E8F0 !important;
}

/* All headings white */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .hero-title,
html[data-theme="dark"] .premium-hero-title,
html[data-theme="dark"] .about-hero-title {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

/* Links - Gold accent */
html[data-theme="dark"] a {
    color: #D4AF37 !important;
}

html[data-theme="dark"] a:hover {
    color: #E8C872 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - NAVIGATION
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .navbar-professional,
html[data-theme="dark"] .navbar,
html[data-theme="dark"] nav {
    background: #0D1B2A !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .navbar-menu-pro a,
html[data-theme="dark"] .navbar-menu-pro .submenu-toggle,
html[data-theme="dark"] .nav-link,
html[data-theme="dark"] .navbar-nav a {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .navbar-menu-pro a:hover,
html[data-theme="dark"] .nav-link:hover {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .navbar-menu-pro .submenu {
    background: #1B2838 !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .navbar-menu-pro .submenu a {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .navbar-menu-pro .submenu a:hover {
    background: rgba(212, 175, 55, 0.1) !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .navbar-brand-pro,
html[data-theme="dark"] .navbar-brand {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .brand-text-pro,
html[data-theme="dark"] .brand-tagline {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .theme-toggle-pro,
html[data-theme="dark"] .lang-toggle-pro {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Premium Header Donate Button - Dark Mode (Orange) */
html[data-theme="dark"] .btn-donate-pro {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A24 50%, #FF6B35 100%) !important;
    background-size: 200% 200% !important;
    color: #FFFFFF !important;
    border: 2px solid rgba(255, 107, 53, 0.6) !important;
    box-shadow: 0 4px 20px rgba(255, 107, 53, 0.45) !important;
}

html[data-theme="dark"] .btn-donate-pro:hover {
    background: linear-gradient(135deg, #FF8555 0%, #FF6B35 50%, #FF8555 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 30px rgba(255, 107, 53, 0.6) !important;
}

html[data-theme="dark"] .btn-donate-pro i {
    color: #FFFFFF !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - SECTIONS & CONTAINERS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] main,
html[data-theme="dark"] section,
html[data-theme="dark"] .container,
html[data-theme="dark"] .container-fluid,
html[data-theme="dark"] .row,
html[data-theme="dark"] .col,
html[data-theme="dark"] [class*="col-"] {
    background: transparent !important;
}

html[data-theme="dark"] .about-section,
html[data-theme="dark"] .programs-section,
html[data-theme="dark"] .gallery-section,
html[data-theme="dark"] .newsletter-section,
html[data-theme="dark"] .testimonials-section,
html[data-theme="dark"] .features-section,
html[data-theme="dark"] .blog-section,
html[data-theme="dark"] .news-section,
html[data-theme="dark"] .membership-section,
html[data-theme="dark"] .contact-section,
html[data-theme="dark"] .donate-section,
html[data-theme="dark"] .board-section,
html[data-theme="dark"] .about-who-we-are,
html[data-theme="dark"] .about-mvv,
html[data-theme="dark"] .about-story,
html[data-theme="dark"] .about-what-we-do,
html[data-theme="dark"] .about-objectives,
html[data-theme="dark"] .about-why-we-exist,
html[data-theme="dark"] .about-daily-programs,
html[data-theme="dark"] .about-infrastructure,
html[data-theme="dark"] .about-annual-programs,
html[data-theme="dark"] .about-sustainability,
html[data-theme="dark"] .about-long-term,
html[data-theme="dark"] .py-5,
html[data-theme="dark"] .py-4,
html[data-theme="dark"] .py-100 {
    background: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - HERO SECTIONS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .hero-home,
html[data-theme="dark"] .premium-hero,
html[data-theme="dark"] .page-hero,
html[data-theme="dark"] .hero-banner {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .hero-overlay {
    background: linear-gradient(135deg, rgba(13, 27, 42, 0.95) 0%, rgba(27, 40, 56, 0.9) 100%) !important;
}

html[data-theme="dark"] .hero-title,
html[data-theme="dark"] .hero-title .line,
html[data-theme="dark"] .premium-hero-title,
html[data-theme="dark"] .hero-home h1 {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .hero-title .line.gradient,
html[data-theme="dark"] .hero-title .gradient {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

html[data-theme="dark"] .hero-desc,
html[data-theme="dark"] .hero-subtitle {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .hero-badge {
    background: rgba(212, 175, 55, 0.2) !important;
    border: 1px solid rgba(212, 175, 55, 0.5) !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .hero-stats {
    background: rgba(27, 40, 56, 0.9) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .stat-num {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .stat-label {
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - CARDS (ALL TYPES)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .card,
html[data-theme="dark"] .about-card,
html[data-theme="dark"] .program-card,
html[data-theme="dark"] .program-card-clean,
html[data-theme="dark"] .activity-card,
html[data-theme="dark"] .activity-card-clean,
html[data-theme="dark"] .testimonial-card,
html[data-theme="dark"] .news-card,
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .mvv-card,
html[data-theme="dark"] .objective-card,
html[data-theme="dark"] .value-item,
html[data-theme="dark"] .program-list-item,
html[data-theme="dark"] .board-member-card,
html[data-theme="dark"] .contact-info-card,
html[data-theme="dark"] .contact-info-item,
html[data-theme="dark"] .what-we-do-card,
html[data-theme="dark"] .infrastructure-card,
html[data-theme="dark"] .sustainability-card,
html[data-theme="dark"] .blog-card,
html[data-theme="dark"] .donate-card,
html[data-theme="dark"] .payment-card {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .about-card:hover,
html[data-theme="dark"] .program-card:hover,
html[data-theme="dark"] .mvv-card:hover {
    border-color: rgba(212, 175, 55, 0.5) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .card-body,
html[data-theme="dark"] .card-footer {
    background: transparent !important;
    color: #FFFFFF !important;
}

/* Keep colored card headers visible in dark mode */
html[data-theme="dark"] .card-header:not(.bg-primary):not(.bg-success):not(.bg-info):not(.bg-warning):not(.bg-danger) {
    background: transparent !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .card-header.bg-primary,
html[data-theme="dark"] .card-header.bg-success,
html[data-theme="dark"] .card-header.bg-info,
html[data-theme="dark"] .card-header.bg-warning,
html[data-theme="dark"] .card-header.bg-danger {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .card-title,
html[data-theme="dark"] .card h3,
html[data-theme="dark"] .card h4,
html[data-theme="dark"] .card h5 {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .card-text,
html[data-theme="dark"] .card p,
html[data-theme="dark"] .card-description {
    color: #E2E8F0 !important;
}

/* Card Icons */
html[data-theme="dark"] .card-icon,
html[data-theme="dark"] .about-card .card-icon,
html[data-theme="dark"] .mvv-icon,
html[data-theme="dark"] .program-icon,
html[data-theme="dark"] .feature-icon,
html[data-theme="dark"] .contact-icon,
html[data-theme="dark"] .contact-icon-small {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

html[data-theme="dark"] .card-icon i,
html[data-theme="dark"] .mvv-icon i,
html[data-theme="dark"] .program-icon i,
html[data-theme="dark"] .feature-icon i,
html[data-theme="dark"] .contact-icon i,
html[data-theme="dark"] .contact-icon-small i {
    color: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - SECTION HEADERS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .section-header,
html[data-theme="dark"] .section-header * {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .section-tag {
    color: #D4AF37 !important;
    background: rgba(212, 175, 55, 0.1) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .section-title {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .section-title span {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .section-title .gradient,
html[data-theme="dark"] .section-title span.gradient {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

html[data-theme="dark"] .section-desc,
html[data-theme="dark"] .section-subtitle {
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - PREMIUM DONATE BUTTONS (Orange)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .btn-accent {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A24 50%, #FF6B35 100%) !important;
    background-size: 200% 200% !important;
    color: #FFFFFF !important;
    border: 2px solid rgba(255, 107, 53, 0.5) !important;
    box-shadow: 0 4px 20px rgba(255, 107, 53, 0.4) !important;
}

html[data-theme="dark"] .btn-accent:hover {
    background: linear-gradient(135deg, #FF8555 0%, #FF6B35 50%, #FF8555 100%) !important;
    color: #FFFFFF !important;
    border-color: #FF6B35 !important;
    box-shadow: 0 8px 25px rgba(255, 107, 53, 0.55);
}

/* Dark Mode - All Donate/Primary Buttons Orange */
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-primary.btn-glow,
html[data-theme="dark"] .btn-primary.btn-lg,
html[data-theme="dark"] .hero-cta .btn-primary,
html[data-theme="dark"] .donate-cta .btn-primary,
html[data-theme="dark"] .cta-box .btn-primary {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A24 50%, #FF6B35 100%) !important;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(255, 107, 53, 0.45) !important;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary.btn-glow:hover,
html[data-theme="dark"] .btn-primary.btn-lg:hover,
html[data-theme="dark"] .hero-cta .btn-primary:hover,
html[data-theme="dark"] .donate-cta .btn-primary:hover,
html[data-theme="dark"] .cta-box .btn-primary:hover {
    background: linear-gradient(135deg, #FF8555 0%, #FF6B35 50%, #FF8555 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 30px rgba(255, 107, 53, 0.6) !important;
}

html[data-theme="dark"] .btn-gold,
html[data-theme="dark"] .btn-warning {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
    border: none !important;
}

/* Ensure preview button text remains visible in dark mode */
html[data-theme="dark"] .btn-preview,
html[data-theme="dark"] .btn-preview i {
    color: #0D1B2A !important;
    -webkit-text-fill-color: #0D1B2A !important;
}

html[data-theme="dark"] .btn-preview:hover,
html[data-theme="dark"] .btn-preview:hover i {
    color: #0D1B2A !important;
    -webkit-text-fill-color: #0D1B2A !important;
}

/* Button hover states for gold/warning */
html[data-theme="dark"] .btn-gold:hover,
html[data-theme="dark"] .btn-warning:hover {
    background: linear-gradient(135deg, #E8C872 0%, #F0D77C 100%) !important;
    color: #0D1B2A !important;
    border: none !important;
}

html[data-theme="dark"] .btn-outline,
html[data-theme="dark"] .btn-outline-primary,
html[data-theme="dark"] .btn-outline-light {
    background: transparent !important;
    color: #FFFFFF !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
}

html[data-theme="dark"] .btn-outline:hover,
html[data-theme="dark"] .btn-outline-primary:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: #D4AF37 !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .btn-secondary {
    background: #1B2838 !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] .news-read-more,
html[data-theme="dark"] .read-more-btn {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - FORMS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .form-input,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    background: #0D1B2A !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-input:focus,
html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus {
    border-color: #D4AF37 !important;
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.2) !important;
    background: #0D1B2A !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: #94A3B8 !important;
}

html[data-theme="dark"] .form-label,
html[data-theme="dark"] label {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .form-text,
html[data-theme="dark"] .form-check-label {
    color: #E2E8F0 !important;
}

/* File Upload */
html[data-theme="dark"] .file-upload-area,
html[data-theme="dark"] .dropzone,
html[data-theme="dark"] .upload-box {
    background: #1B2838 !important;
    border: 2px dashed rgba(255, 255, 255, 0.3) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .file-upload-area:hover {
    border-color: #D4AF37 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - TABLES
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] table,
html[data-theme="dark"] .table {
    color: #FFFFFF !important;
    background: transparent !important;
}

html[data-theme="dark"] .table thead th,
html[data-theme="dark"] thead th {
    background: #1B2838 !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .table tbody td,
html[data-theme="dark"] tbody td {
    background: #0D1B2A !important;
    color: #E2E8F0 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) td {
    background: #1B2838 !important;
}

html[data-theme="dark"] .daily-programs-table {
    background: #1B2838 !important;
}

html[data-theme="dark"] .daily-programs-table thead {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .program-day {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .program-activity {
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - FOOTER
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .footer,
html[data-theme="dark"] footer,
html[data-theme="dark"] .premium-footer {
    background: #0A1520 !important;
    border-top: 2px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .footer h5,
html[data-theme="dark"] footer h5 {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .footer p,
html[data-theme="dark"] .footer li,
html[data-theme="dark"] footer p,
html[data-theme="dark"] footer li {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .footer a:not(.btn):not(.btn-accent),
html[data-theme="dark"] footer a:not(.btn):not(.btn-accent) {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .footer a:not(.btn):not(.btn-accent):hover,
html[data-theme="dark"] footer a:not(.btn):not(.btn-accent):hover {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .social-links a {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #D4AF37 !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .social-links a:hover {
    background: #D4AF37 !important;
    color: #0D1B2A !important;
}

/* Footer Buttons - Orange Donate Style (High Specificity) */
html[data-theme="dark"] .footer .btn-accent,
html[data-theme="dark"] .footer a.btn-accent,
html[data-theme="dark"] footer .btn-accent,
html[data-theme="dark"] footer a.btn-accent,
html[data-theme="dark"] .footer .btn.btn-accent,
html[data-theme="dark"] footer .btn.btn-accent {
    background: linear-gradient(135deg, #FF6B35 0%, #E85A24 100%) !important;
    color: #FFFFFF !important;
    border: 2px solid rgba(255, 107, 53, 0.6) !important;
    box-shadow: 0 4px 15px rgba(255, 107, 53, 0.4) !important;
    border-radius: 50px !important;
}

html[data-theme="dark"] .footer .btn-accent:hover,
html[data-theme="dark"] .footer a.btn-accent:hover,
html[data-theme="dark"] footer .btn-accent:hover,
html[data-theme="dark"] footer a.btn-accent:hover,
html[data-theme="dark"] .footer .btn.btn-accent:hover,
html[data-theme="dark"] footer .btn.btn-accent:hover {
    background: linear-gradient(135deg, #FF8555 0%, #FF6B35 100%) !important;
    color: #FFFFFF !important;
    border-color: #FF6B35 !important;
    box-shadow: 0 8px 25px rgba(255, 107, 53, 0.55) !important;
    transform: translateY(-2px);
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - PAGINATION
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .pagination .page-link {
    background: #1B2838 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .pagination .page-link:hover {
    background: rgba(212, 175, 55, 0.2) !important;
    border-color: #D4AF37 !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .pagination .page-item.active .page-link {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    border-color: #D4AF37 !important;
    color: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - ALERTS & BADGES
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .alert {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .alert-success {
    background: rgba(16, 185, 129, 0.2) !important;
    border-color: rgba(16, 185, 129, 0.5) !important;
    color: #10B981 !important;
}

html[data-theme="dark"] .alert-danger {
    background: rgba(239, 68, 68, 0.2) !important;
    border-color: rgba(239, 68, 68, 0.5) !important;
    color: #EF4444 !important;
}

html[data-theme="dark"] .alert-warning {
    background: rgba(212, 175, 55, 0.2) !important;
    border-color: rgba(212, 175, 55, 0.5) !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .alert-info {
    background: rgba(59, 130, 246, 0.2) !important;
    border-color: rgba(59, 130, 246, 0.5) !important;
    color: #60A5FA !important;
}

html[data-theme="dark"] .badge {
    background: rgba(212, 175, 55, 0.2) !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .count-badge {
    background: rgba(212, 175, 55, 0.2) !important;
    color: #D4AF37 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - MODALS & DROPDOWNS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .modal-content {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .modal-header {
    background: #0D1B2A !important;
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .modal-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .modal-body {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .modal-footer {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .btn-close {
    filter: invert(1) !important;
}

html[data-theme="dark"] .dropdown-menu {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .dropdown-item {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .dropdown-item:hover {
    background: rgba(212, 175, 55, 0.1) !important;
    color: #D4AF37 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - TOC SIDEBAR
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .toc-sidebar {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .toc-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .toc-link {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .toc-link:hover,
html[data-theme="dark"] .toc-link.active {
    color: #D4AF37 !important;
    background: rgba(212, 175, 55, 0.1) !important;
}

html[data-theme="dark"] .toc-drawer {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .toc-mobile-btn {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - GALLERY
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .gallery-section,
html[data-theme="dark"] .gallery-main,
html[data-theme="dark"] .gallery-page {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .gallery-hero {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .gallery-hero-title,
html[data-theme="dark"] .gallery-hero h1 {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .gallery-hero-subtitle,
html[data-theme="dark"] .gallery-hero p {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .gallery-stat-number {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .gallery-stat-label {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .gallery-filter-section {
    background: #1B2838 !important;
}

html[data-theme="dark"] .category-select {
    background: #0D1B2A !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] .gallery-filter-tab {
    background: #1B2838 !important;
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .gallery-filter-tab.active {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

html[data-theme="dark"] .gallery-item {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .gallery-item-title {
    color: #FFFFFF !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - PROGRAMS PAGE
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .programs-page,
html[data-theme="dark"] .programs-wrapper {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .upcoming-program,
html[data-theme="dark"] .past-program,
html[data-theme="dark"] .past-program-item {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .program-title,
html[data-theme="dark"] .program-name,
html[data-theme="dark"] .past-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .program-description,
html[data-theme="dark"] .program-details {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .program-date-badge,
html[data-theme="dark"] .date-badge,
html[data-theme="dark"] .past-date {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

html[data-theme="dark"] .program-location,
html[data-theme="dark"] .past-venue {
    color: #94A3B8 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - BLOG/NEWS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .blog-page,
html[data-theme="dark"] .blog-grid,
html[data-theme="dark"] .news-wrapper {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .blog-card .card-img-top + .card-body,
html[data-theme="dark"] .blog-article,
html[data-theme="dark"] .article-body,
html[data-theme="dark"] .blog-content,
html[data-theme="dark"] .post-content {
    background: #1B2838 !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .blog-title,
html[data-theme="dark"] .article-title,
html[data-theme="dark"] .post-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .blog-excerpt,
html[data-theme="dark"] .article-content p,
html[data-theme="dark"] .post-content p {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .blog-date,
html[data-theme="dark"] .post-meta,
html[data-theme="dark"] .news-date {
    color: #D4AF37 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - DONATE PAGE
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .donate-page,
html[data-theme="dark"] .donate-wrapper {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .donate-card,
html[data-theme="dark"] .payment-card,
html[data-theme="dark"] .bank-info-card {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .donate-amount,
html[data-theme="dark"] .amount-option {
    background: #0D1B2A !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .donate-amount.active,
html[data-theme="dark"] .amount-option.active {
    background: rgba(212, 175, 55, 0.2) !important;
    border-color: #D4AF37 !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .qr-modal-title {
    color: #FFFFFF !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - CONTACT PAGE
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .contact-page,
html[data-theme="dark"] .contact-wrapper,
html[data-theme="dark"] .contact-hero {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .contact-form-card {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .contact-text h6,
html[data-theme="dark"] .contact-info h5,
html[data-theme="dark"] .contact-info h6 {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .contact-text p,
html[data-theme="dark"] .contact-info p {
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - MEMBERSHIP PAGE
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .membership-section,
html[data-theme="dark"] .membership-form-section,
html[data-theme="dark"] .application-form-wrapper {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .form-card,
html[data-theme="dark"] .application-card {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .nepali-display-text {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .step-indicator.active,
html[data-theme="dark"] .step-indicator.completed {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - BOARD PAGE
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .board-page,
html[data-theme="dark"] .board-wrapper,
html[data-theme="dark"] .board-section {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .board-member-card {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .board-member-name {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .board-member-position {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .board-member-photo {
    border-color: #D4AF37 !important;
}

html[data-theme="dark"] .board-year-selector select,
html[data-theme="dark"] .branch-selector-wrapper select {
    background: #0D1B2A !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] .committee-btn {
    background: #1B2838 !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] .committee-btn.active {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - ABOUT PAGE SPECIFIC
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .story-paragraph {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .story-text-full {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .mvv-card-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .mvv-card-text {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .mvv-values-list li {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .mvv-values-list li:before {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .objective-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .objective-description {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .subsection-title {
    color: #FFFFFF !important;
    border-left-color: #D4AF37 !important;
}

html[data-theme="dark"] .infrastructure-list li,
html[data-theme="dark"] .sustainability-list li {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .infrastructure-list li:before,
html[data-theme="dark"] .sustainability-list li:before {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .sustainability-card-title {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .plan-card {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .plan-title {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .plan-description {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .program-item {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .program-item i {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .program-item span {
    color: #E2E8F0 !important;
}

/* Values Grid */
html[data-theme="dark"] .values-grid {
    background: #1B2838 !important;
}

html[data-theme="dark"] .value-item h4 {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .value-item i {
    color: #D4AF37 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - NEWSLETTER
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .newsletter-section {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .newsletter-wrapper {
    background: #1B2838 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .newsletter-content h3 {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .newsletter-content p {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .newsletter-form input {
    background: #0D1B2A !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    color: #FFFFFF !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - IMPACT SECTION
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .impact-section {
    background: #0A1520 !important;
}

html[data-theme="dark"] .impact-card {
    background: rgba(27, 40, 56, 0.8) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .impact-icon {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    color: #0D1B2A !important;
}

html[data-theme="dark"] .impact-num {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .impact-label {
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - UTILITY CLASSES
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-light {
    background: #1B2838 !important;
}

html[data-theme="dark"] .text-dark {
    color: #FFFFFF !important;
}

html[data-theme="dark"] .text-muted {
    color: #94A3B8 !important;
}

html[data-theme="dark"] .text-secondary {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .text-primary {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .border {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] hr {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - BREADCRUMBS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .breadcrumb {
    background: transparent !important;
}

html[data-theme="dark"] .breadcrumb-item a {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .breadcrumb-item.active {
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - ACCORDIONS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .accordion-item {
    background: #1B2838 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .accordion-button {
    background: #1B2838 !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .accordion-button:not(.collapsed) {
    background: rgba(212, 175, 55, 0.1) !important;
    color: #D4AF37 !important;
}

html[data-theme="dark"] .accordion-body {
    background: #0D1B2A !important;
    color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - TABS
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .nav-tabs {
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .nav-tabs .nav-link {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] .nav-tabs .nav-link.active {
    background: #1B2838 !important;
    color: #D4AF37 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - SCROLLBAR
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"]::-webkit-scrollbar {
    width: 10px;
    background: #0D1B2A;
}

html[data-theme="dark"]::-webkit-scrollbar-track {
    background: #0D1B2A;
}

html[data-theme="dark"]::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.5);
    border-radius: 5px;
}

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

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - ICONS (General)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .fa,
html[data-theme="dark"] .fas,
html[data-theme="dark"] .far,
html[data-theme="dark"] .fab,
html[data-theme="dark"] i[class*="fa-"] {
    color: inherit;
}

html[data-theme="dark"] .text-muted i,
html[data-theme="dark"] .text-muted .fa {
    color: #94A3B8 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   DARK MODE - INLINE STYLE OVERRIDES
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] [style*="color: #6B7280"],
html[data-theme="dark"] [style*="color:#6B7280"],
html[data-theme="dark"] [style*="color: #475569"],
html[data-theme="dark"] [style*="color:#475569"],
html[data-theme="dark"] [style*="color: #1a202c"],
html[data-theme="dark"] [style*="color:#1a202c"] {
    color: #E2E8F0 !important;
}

html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background:white"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background:#ffffff"] {
    background: #1B2838 !important;
}

/* Count Badge Secondary */
.count-badge-secondary {
    background: #6c757d !important;
}

html[data-theme="dark"] .count-badge-secondary {
    background: #1B2838 !important;
    color: #E2E8F0 !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   QR MODAL STYLES - For Donate Page
   ─────────────────────────────────────────────────────────────────────────────── */

.qr-modal-title {
    margin-top: 0;
    color: #1a202c;
    text-align: center;
}

html[data-theme="dark"] .qr-modal-title {
    color: #FFFFFF !important;
}

.qr-modal-image {
    text-align: center;
    margin: 2rem 0;
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qr-modal-image img {
    max-width: 100%;
    max-height: 400px;
    height: auto;
    border-radius: 8px;
    border: 2px solid #e2e8f0;
}

html[data-theme="dark"] .qr-modal-image img {
    border-color: rgba(255, 255, 255, 0.2) !important;
}

.qr-modal-download {
    text-align: center;
}

.btn-download-qr {
    display: inline-block;
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%);
    color: #0D1B2A;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-download-qr:hover {
    background: linear-gradient(135deg, #E8C872 0%, #D4AF37 100%);
    color: #0D1B2A;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.4);
}

/* Nepali Display Text */
.nepali-display-text {
    margin-top: 8px;
    font-size: 0.9rem;
    color: #6B7280;
    font-weight: 500;
    min-height: 20px;
    font-style: italic;
}

html[data-theme="dark"] .nepali-display-text {
    color: #D4AF37 !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   ADDITIONAL DARK MODE FIXES - Home Page Specific
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────────────
   FIX 1: About Card Description Text (Our Mission & Our Vision)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .about-card p,
html[data-theme="dark"] .about-card .card-text,
html[data-theme="dark"] .about-content .about-card p {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   FIX 2: Core Values (Compassion, Integrity, Community, Dignity)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .values-grid .value-item h4,
html[data-theme="dark"] .value-item h4 {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .values-grid .value-item i,
html[data-theme="dark"] .value-item i {
    color: #D4AF37 !important;
}

html[data-theme="dark"] .values-grid,
html[data-theme="dark"] .values-grid .value-item {
    background: #1B2838 !important;
    border-color: rgba(212, 175, 55, 0.3) !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   FIX 3: What We Do - Program List Items (Health Camps, Social Gatherings, etc.)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .program-list-item {
    background: #1B2838 !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

/* ALL program icons bright gold in dark mode for maximum visibility */
html[data-theme="dark"] .program-list-item .program-icon,
html[data-theme="dark"] .program-list-item:nth-child(1) .program-icon,
html[data-theme="dark"] .program-list-item:nth-child(2) .program-icon,
html[data-theme="dark"] .program-list-item:nth-child(3) .program-icon,
html[data-theme="dark"] .program-list-item:nth-child(4) .program-icon,
html[data-theme="dark"] .program-list-item:nth-child(5) .program-icon {
    background: linear-gradient(135deg, #D4AF37 0%, #F0D77C 100%) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 6px 25px rgba(212, 175, 55, 0.6) !important;
}

html[data-theme="dark"] .program-list-item .program-icon i,
html[data-theme="dark"] .program-list-item:nth-child(1) .program-icon i,
html[data-theme="dark"] .program-list-item:nth-child(2) .program-icon i,
html[data-theme="dark"] .program-list-item:nth-child(3) .program-icon i,
html[data-theme="dark"] .program-list-item:nth-child(4) .program-icon i,
html[data-theme="dark"] .program-list-item:nth-child(5) .program-icon i {
    color: #0A1929 !important;
    font-size: 1.5rem !important;
}

html[data-theme="dark"] .program-list-item .program-info h3,
html[data-theme="dark"] .program-list-item h3 {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .program-list-item .program-info p,
html[data-theme="dark"] .program-list-item p {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
}

html[data-theme="dark"] .programs-list .program-list-item {
    background: #1B2838 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   FIX 4: Photo Gallery Section Title (Moments of Care & Joy)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .gallery-section .section-title,
html[data-theme="dark"] .gallery-section .section-title span {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .gallery-section .section-title span.gradient {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   FIX 5: Donate Section - Tiers (रु. 500, रु. 2,000, etc.)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .donate-section {
    background: #0D1B2A !important;
}

html[data-theme="dark"] .donate-wrapper {
    background: #1B2838 !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .donate-content .section-title,
html[data-theme="dark"] .donate-content .section-title span {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .donate-content .section-title span.gradient {
    background: linear-gradient(135deg, #D4AF37 0%, #E8C872 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

html[data-theme="dark"] .donate-content p {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
}

html[data-theme="dark"] .donate-tiers {
    background: transparent !important;
}

html[data-theme="dark"] .donate-tiers .tier {
    background: rgba(13, 27, 42, 0.8) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

html[data-theme="dark"] .donate-tiers .tier .amount {
    color: #D4AF37 !important;
    -webkit-text-fill-color: #D4AF37 !important;
    font-weight: 700 !important;
}

html[data-theme="dark"] .donate-tiers .tier span {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

html[data-theme="dark"] .tier {
    background: rgba(13, 27, 42, 0.8) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    color: #FFFFFF !important;
}

html[data-theme="dark"] .tier .amount {
    color: #D4AF37 !important;
    -webkit-text-fill-color: #D4AF37 !important;
}

/* Compact footer overrides: reduce vertical space and tighten layout */
.footer {
    padding-top: 20px; /* tighter top padding for compact footer */
    padding-bottom: 12px; /* tighter bottom padding */
    background-image: linear-gradient(180deg, rgba(10,37,64,0.02), rgba(10,37,64,0.06));
}

.footer h5 {
    margin-bottom: 0.4rem; /* tighter spacing under headings */
    font-size: 1rem;
    color: var(--theme-premium-gold, #D4AF37);
    font-weight: 700;
}

.footer p {
    margin-bottom: 0.4rem;
    line-height: 1.45;
    color: rgba(255,255,255,0.88);
}

.footer .social-links a {
    margin-right: 0.6rem;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.footer .quick-links-list li {
    margin-bottom: 0.35rem;
    font-size: 0.98rem;
}

.footer .footer-bottom {
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 12px;
    border-top: 1px solid rgba(255,255,255,0.04);
    font-size: 0.95rem;
}

/* Reduce the visual height on small screens as well */
@media (max-width: 767px) {
    .footer {
        padding-top: 16px;
        padding-bottom: 12px;
    }
    .footer h5 {
        font-size: 1rem;
    }
}

/* Make privacy/terms show horizontally and aligned with donate area */
.footer .col-lg-3 .list-unstyled.mt-3 {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding-left: 0;
    margin-top: 0.6rem;
}

.footer .col-lg-3 .list-unstyled.mt-3 li {
    margin-bottom: 0;
}

.footer .col-lg-3 .list-unstyled.mt-3 li a {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255,255,255,0.92);
    font-size: 0.95rem;
}

.footer .col-lg-3 .list-unstyled.mt-3 li a i {
    color: var(--theme-premium-gold, #D4AF37);
}

/* Slight card-like separation for donate column to make it look premium */
.footer .col-lg-3 {
    position: relative;
}
.footer .col-lg-3 .btn-accent {
    box-shadow: 0 6px 18px rgba(255,100,40,0.12);
    border-radius: 40px;
    padding: 10px 20px;
}

/* Reduce overall footer column vertical gaps */
.footer .row > [class*="col-"] {
    margin-bottom: 0.4rem;
}

/* Fine tune quick links columns spacing */
.footer .quick-links-list {
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
    column-gap: 0.8rem;
}

@media (max-width: 767px) {
    .footer .col-lg-3 .list-unstyled.mt-3 {
        flex-direction: column;
        gap: 0.4rem;
    }
}

html[data-theme="dark"] .tier span:not(.amount) {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   FIX 6: Annual Programs Section (About Page - 15 programs text)
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-theme="dark"] .about-annual-programs p,
html[data-theme="dark"] .about-annual-programs .section-desc,
html[data-theme="dark"] .annual-programs-intro {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────────
   LIGHT MODE - About Infrastructure & Annual Programs Text
   ─────────────────────────────────────────────────────────────────────────────── */
.about-infrastructure .text-center,
.about-annual-programs .text-center {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

html[data-theme="dark"] .about-infrastructure .text-center,
html[data-theme="dark"] .about-annual-programs .text-center {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
}