(() => {
    const root = document.documentElement;
    const storageKey = "nouri-theme";
    const toggles = () => Array.from(document.querySelectorAll("[data-theme-toggle]"));

    const applyTheme = (theme) => {
        const resolved = theme || localStorage.getItem(storageKey) || "auto";
        const finalTheme =
            resolved === "auto"
                ? (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light")
                : resolved;
        root.dataset.theme = finalTheme;

        toggles().forEach((button) => {
            button.textContent = finalTheme === "dark" ? "Hell" : "Dunkel";
        });
    };

    document.addEventListener("DOMContentLoaded", () => {
        applyTheme();
        toggles().forEach((button) => {
            button.addEventListener("click", () => {
                const current = root.dataset.theme === "dark" ? "dark" : "light";
                const next = current === "dark" ? "light" : "dark";
                localStorage.setItem(storageKey, next);
                applyTheme(next);
            });
        });
    });
})();