export type ThemeMode = 'light' | 'dark' | 'system'

export const THEME_MODES: ThemeMode[] = ['light', 'dark', 'system']
export const THEME_STORAGE_KEY = 'theme-mode'

export const THEME_ICONS: Record<ThemeMode, string> = {
  light: 'mdi-white-balance-sunny',
  dark: 'mdi-weather-night',
  system: 'mdi-theme-light-dark',
}

export function isThemeMode(value: unknown): value is ThemeMode {
  return THEME_MODES.includes(value as ThemeMode)
}

/** Read the persisted theme mode synchronously, before Vuetify is created, to avoid a flash of the wrong theme. */
export function readStoredThemeMode(): ThemeMode {
  if (typeof localStorage === 'undefined') return 'system'
  const stored = localStorage.getItem(THEME_STORAGE_KEY)
  return isThemeMode(stored) ? stored : 'system'
}