// assets/js/main.js
document.addEventListener('DOMContentLoaded', () => {
    const themeToggle = document.getElementById('theme-toggle');
    const featherSun = document.getElementById('feather-sun');
    const featherMoon = document.getElementById('feather-moon');

    // Function to apply theme based on saved preference or system setting
    const applyTheme = (theme) => {
        if (theme === 'dark') {
            document.body.classList.add('dark-mode');
            if (featherSun) featherSun.style.display = 'block';
            if (featherMoon) featherMoon.style.display = 'none';
        } else {
            document.body.classList.remove('dark-mode');
            if (featherSun) featherSun.style.display = 'none';
            if (featherMoon) featherMoon.style.display = 'block';
        }
    };

    // Check for saved theme in localStorage
    const savedTheme = localStorage.getItem('theme');
    // Check for user's system preference
    const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;

    // Apply theme on initial load
    if (savedTheme) {
        applyTheme(savedTheme);
    } else if (prefersDark) {
        applyTheme('dark');
    } else {
        applyTheme('light');
    }


    if (themeToggle) {
        themeToggle.addEventListener('click', () => {
            const isDarkMode = document.body.classList.toggle('dark-mode');
            const newTheme = isDarkMode ? 'dark' : 'light';
            localStorage.setItem('theme', newTheme);
            applyTheme(newTheme);
        });
    }

    // Feather icons replacement
    if (typeof feather !== 'undefined') {
        feather.replace();
    }
});