/* Dark Mode Variables */
:root {
    --bg-primary: #1A202C; /* Dark blue-gray */
    --bg-secondary: #2D3748; /* Slightly lighter dark blue-gray */
    --bg-tertiary: #4A5568; /* Even lighter dark blue-gray */
    --text-color: #E2E8F0; /* Light gray for text */
    --heading-color: #F7FAFC; /* White for headings */
    --primary-color: #68D391; /* Brighter green */
    --secondary-color: #63B3ED; /* Brighter blue */
    --accent-color: #F6AD55; /* Orange-gold */
    --header-bg: #1A202C; /* Same as primary bg for subtle header */
    --header-text: #F7FAFC;
    --hero-overlay: rgba(0,0,0,0.8); /* Darker overlay for hero */
    --card-shadow: rgba(0,0,0,0.4); /* Darker shadows */
    --border-color: #4A5568; /* Darker border for dots etc. */
}

/* Specific Dark Mode Overrides (if needed beyond variables) */

/* Example: Adjusting specific element backgrounds if they don't inherit vars correctly */
.news-item {
    background-color: var(--bg-secondary); /* Ensure distinct from bg-primary */
}
.testimonial {
    background-color: var(--bg-secondary);
}
.events-list {
    background-color: var(--bg-secondary);
}
.events-list li {
    border-bottom: 1px solid var(--bg-tertiary); /* Darker separator */
}
.quick-links-list li a {
    background-color: var(--bg-tertiary);
}
.faq-item {
    background-color: var(--bg-secondary);
}
.faq-question {
    background-color: var(--bg-tertiary);
}
.faq-answer {
    background-color: var(--bg-secondary);
}

/* Adjust button hover for dark mode for better contrast */
.primary-button:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--heading-color); /* Lighter text for dark mode */
}
#admissions-cta .button {
    background-color: var(--accent-color);
    border-color: var(--accent-color);
    color: var(--heading-color);
}
#admissions-cta .button:hover {
    background-color: var(--heading-color); /* White background for hover */
    border-color: var(--heading-color);
    color: var(--primary-color);
}

.mode-toggle-button {
    background-color: var(--bg-secondary);
    border-color: var(--text-color);
    color: var(--text-color);
}
.mode-toggle-button:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--heading-color);
}

/* Slider buttons for dark mode */
.slider-button {
    background-color: rgba(255, 255, 255, 0.2); /* Lighter opacity */
    color: var(--heading-color);
}
.slider-button:hover {
    background-color: rgba(255, 255, 255, 0.4);
}
.dot {
    background-color: var(--bg-tertiary);
}
.dot.active {
    background-color: var(--primary-color);
}