// Get the theme toggle switch element
const themeToggle = document.querySelector('.switch input[type="checkbox"]');

// Function to set the theme
function setTheme(isDark) {
    document.body.classList.toggle('dark-theme', isDark);
    // Store the user's preference
    localStorage.setItem('dark-theme', isDark);
    // Update the checkbox state
    themeToggle.checked = isDark;
}

// Check for saved user preference
const savedTheme = localStorage.getItem('dark-theme');

// Apply the saved theme or default to light mode
if (savedTheme !== null) {
    setTheme(savedTheme === 'true');
} else {
    // Check if user prefers dark mode at system level
    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
        setTheme(true);
    }
}

// Listen for toggle changes
themeToggle.addEventListener('change', (e) => {
    setTheme(e.target.checked);
});
