/* ========================================================== */
/* INDEX PAGE - OVERRIDE ALL SECTION BACKGROUNDS             */
/* ========================================================== */

/* FORCE CORRECT BACKGROUND - OVERRIDE EVERYTHING */
/* LIGHT THEME - DEFAULT (FORCE THIS) */
body,
body #home,
body #about,
body #announcement,
body #clubs,
body #activities,
body #documents,
body #achievement,
body #contact,
body .hero,
body .welcome-section,
body .carousel-section {
    background: #e8ecf4 !important;
}

/* DARK THEME - ONLY WHEN dark-theme CLASS IS PRESENT */
body.dark-theme,
body.dark-theme #home,
body.dark-theme #about,
body.dark-theme #announcement,
body.dark-theme #clubs,
body.dark-theme #activities,
body.dark-theme #documents,
body.dark-theme #achievement,
body.dark-theme #contact,
body.dark-theme .hero,
body.dark-theme .welcome-section,
body.dark-theme .carousel-section {
    background: #0f0f1a !important;
}

/* ALL CARDS - WHITE WITH SHADOW */
.about-card,
.achievement-card,
.activity-card,
.club-card,
.document-card,
.contact-info-card,
.welcome-box,
.calendar-box,
.announcement-card,
.upload-card,
.list-card,
.contact-wrapper,
.carousel-container,
.reports-wrapper,
.gallery-wrapper,
.main-card,
.vision-card,
.mission-card,
.announcement-card {
    background: #ffffff !important;
    backdrop-filter: none !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05) !important;
}

/* Dark theme cards */
body.dark-theme .about-card,
body.dark-theme .achievement-card,
body.dark-theme .activity-card,
body.dark-theme .club-card,
body.dark-theme .document-card,
body.dark-theme .contact-info-card,
body.dark-theme .welcome-box,
body.dark-theme .calendar-box,
body.dark-theme .announcement-card,
body.dark-theme .upload-card,
body.dark-theme .list-card,
body.dark-theme .contact-wrapper,
body.dark-theme .carousel-container,
body.dark-theme .reports-wrapper,
body.dark-theme .gallery-wrapper,
body.dark-theme .main-card,
body.dark-theme .vision-card,
body.dark-theme .mission-card {
    background: #1a1a2e !important;
    border-color: #2a2a4a !important;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3) !important;
}

/* ALL TEXT - DARK */
.section-title,
.about-card h4,
.achievement-card h4,
.activity-card h4,
.club-card h4,
.document-card h4,
.contact-info-card h4,
.welcome-box h3,
.calendar-box h3,
.hero h1,
.hero h2,
.reports-header h2,
.gallery-header h2,
.vision-card h3,
.mission-card h3,
.announcement-card .card-title {
    color: #1a1a2e !important;
}

/* Dark theme text */
body.dark-theme .section-title,
body.dark-theme .about-card h4,
body.dark-theme .achievement-card h4,
body.dark-theme .activity-card h4,
body.dark-theme .club-card h4,
body.dark-theme .document-card h4,
body.dark-theme .contact-info-card h4,
body.dark-theme .welcome-box h3,
body.dark-theme .calendar-box h3,
body.dark-theme .hero h1,
body.dark-theme .hero h2,
body.dark-theme .reports-header h2,
body.dark-theme .gallery-header h2,
body.dark-theme .vision-card h3,
body.dark-theme .mission-card h3,
body.dark-theme .announcement-card .card-title {
    color: #e5e7eb !important;
}

/* ALL PARAGRAPHS */
.about-card p,
.achievement-card p,
.activity-card p,
.club-card p,
.document-card p,
.contact-info-card p,
.welcome-box p,
.calendar-box p,
.hero .lead,
.reports-header p,
.gallery-header p,
.announcement-card .date-text {
    color: rgba(0, 0, 0, 0.6) !important;
}

/* Dark theme paragraphs */
body.dark-theme .about-card p,
body.dark-theme .achievement-card p,
body.dark-theme .activity-card p,
body.dark-theme .club-card p,
body.dark-theme .document-card p,
body.dark-theme .contact-info-card p,
body.dark-theme .welcome-box p,
body.dark-theme .calendar-box p,
body.dark-theme .hero .lead,
body.dark-theme .reports-header p,
body.dark-theme .gallery-header p,
body.dark-theme .announcement-card .date-text {
    color: #9ca3af !important;
}

/* HERO BADGE */
.hero-badge {
    background: rgba(102, 126, 234, 0.1) !important;
    border: 1px solid rgba(102, 126, 234, 0.2) !important;
    color: #667eea !important;
}

/* NAVIGATION - WHITE */
.navbar-custom {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.navbar-custom .navbar-brand {
    color: #1a1a2e !important;
}

.navbar-custom .nav-link {
    color: rgba(0, 0, 0, 0.6) !important;
}

.navbar-custom .nav-link:hover {
    color: #667eea !important;
}

.navbar-custom .nav-link.active {
    color: #667eea !important;
}

.navbar-custom .nav-link.active::after {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
}

/* Dark theme navigation */
body.dark-theme .navbar-custom {
    background: rgba(26, 26, 46, 0.95) !important;
    border-bottom: 1px solid #2a2a4a !important;
}

body.dark-theme .navbar-custom .navbar-brand {
    color: #e5e7eb !important;
}

body.dark-theme .navbar-custom .nav-link {
    color: rgba(255, 255, 255, 0.6) !important;
}

body.dark-theme .navbar-custom .nav-link:hover {
    color: #818cf8 !important;
}

body.dark-theme .navbar-custom .nav-link.active {
    color: #818cf8 !important;
}

/* ========================================================== */
/* FOOTER - MATCH PAGE BACKGROUND (LIGHT)                     */
/* ========================================================== */
footer {
    background: #e8ecf4 !important;
    border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
    padding: 25px 0 !important;
}

footer p {
    color: rgba(0, 0, 0, 0.5) !important;
    margin: 0 !important;
    font-size: 14px;
}

/* Dark theme footer */
body.dark-theme footer {
    background: #0f0f1a !important;
    border-top: 1px solid #2a2a4a !important;
}

body.dark-theme footer p {
    color: #6b7280 !important;
}

/* MINI CALENDAR */
.mini-calendar-wrapper {
    background: rgba(102, 126, 234, 0.04) !important;
    border: 1px solid rgba(102, 126, 234, 0.08) !important;
}

.mini-calendar-header span {
    color: #1a1a2e !important;
}

.mini-calendar-table td {
    color: rgba(0, 0, 0, 0.7) !important;
}

.mini-calendar-table td.other-month {
    color: rgba(0, 0, 0, 0.2) !important;
}

.mini-calendar-table td.today {
    border: 2px solid #667eea !important;
}

.mini-event-text {
    color: rgba(0, 0, 0, 0.6) !important;
}

.mini-event-more {
    color: #667eea !important;
}

.mini-event-more:hover {
    color: #764ba2 !important;
}

/* Dark theme calendar */
body.dark-theme .mini-calendar-wrapper {
    background: rgba(99, 102, 241, 0.05) !important;
    border-color: #2a2a4a !important;
}

body.dark-theme .mini-calendar-header span {
    color: #e5e7eb !important;
}

body.dark-theme .mini-calendar-table td {
    color: #9ca3af !important;
}

body.dark-theme .mini-calendar-table td.other-month {
    color: #3a3a5a !important;
}

body.dark-theme .mini-event-text {
    color: #9ca3af !important;
}

/* BUTTONS - PURPLE GRADIENT */
.btn-about,
.btn-club,
.btn-document,
.btn-activity,
.btn-announce,
.btn-contact-link,
.btn-explore,
.btn-login-nav {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: #ffffff !important;
    border: none !important;
}

.btn-about:hover,
.btn-club:hover,
.btn-document:hover,
.btn-activity:hover,
.btn-announce:hover,
.btn-contact-link:hover,
.btn-explore:hover,
.btn-login-nav:hover {
    background: linear-gradient(135deg, #764ba2, #667eea) !important;
    color: #ffffff !important;
}

/* SECTION TITLE UNDERLINE */
.section-title::after {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
}

/* ========================================================== */
/* RESPONSIVE                                                 */
/* ========================================================== */
@media (max-width: 768px) {
    body,
    body #home,
    body #about,
    body #announcement,
    body #clubs,
    body #activities,
    body #documents,
    body #achievement,
    body #contact,
    body .hero,
    body .welcome-section,
    body .carousel-section {
        background: #e8ecf4 !important;
    }
    
    body.dark-theme,
    body.dark-theme #home,
    body.dark-theme #about,
    body.dark-theme #announcement,
    body.dark-theme #clubs,
    body.dark-theme #activities,
    body.dark-theme #documents,
    body.dark-theme #achievement,
    body.dark-theme #contact,
    body.dark-theme .hero,
    body.dark-theme .welcome-section,
    body.dark-theme .carousel-section {
        background: #0f0f1a !important;
    }
    
    footer {
        background: #e8ecf4 !important;
        padding: 20px 0 !important;
    }
    
    body.dark-theme footer {
        background: #0f0f1a !important;
    }
}