export const useTheme = () => {
  const isDark = useState<boolean>("is-dark-theme", () => false);

  const applyTheme = (dark: boolean) => {
    if (typeof document === "undefined") return;
    document.documentElement.classList.toggle("dark", dark);
  };

  const setTheme = (dark: boolean) => {
    isDark.value = dark;
    applyTheme(dark);
    if (typeof localStorage !== "undefined") {
      localStorage.setItem("theme", dark ? "dark" : "light");
    }
  };

  const toggleTheme = () => {
    setTheme(!isDark.value);
  };

  const initTheme = () => {
    if (typeof window === "undefined") return;
    const saved = localStorage.getItem("theme");
    if (saved === "dark" || saved === "light") {
      setTheme(saved === "dark");
      return;
    }
    // Product requirement: default mode is light.
    setTheme(false);
  };

  const setThemeMode = (mode: "light" | "dark") => {
    setTheme(mode === "dark");
  };

  return {
    isDark,
    toggleTheme,
    initTheme,
    setTheme,
    setThemeMode
  };
};