import { defineStore } from 'pinia'

export const useThemeStore = defineStore('theme', {
  state: () => ({
    currentTheme: 'luxury_showroom', // 'luxury_showroom' or 'rusty_workshop'
  }),
  getters: {
    isLuxury: (state) => state.currentTheme === 'luxury_showroom',
    isWorkshop: (state) => state.currentTheme === 'rusty_workshop',
    themeClasses: (state) => {
      if (state.currentTheme === 'luxury_showroom') {
        return {
          background: 'bg-gradient-to-br from-slate-900 via-slate-800 to-gray-900',
          text: 'text-amber-100',
          accent: 'text-amber-400',
          border: 'border-amber-700',
          card: 'bg-slate-800/70 backdrop-blur-lg border border-amber-700/30',
          button: 'bg-amber-700 hover:bg-amber-600 text-white',
        }
      } else {
        return {
          background: 'bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900',
          text: 'text-orange-100',
          accent: 'text-orange-400',
          border: 'border-orange-800',
          card: 'bg-gray-800/90 border border-dashed border-orange-700/50',
          button: 'bg-orange-800 hover:bg-orange-700 text-white',
        }
      }
    },
  },
  actions: {
    toggleTheme() {
      this.currentTheme = this.currentTheme === 'luxury_showroom' ? 'rusty_workshop' : 'luxury_showroom'
    },
    setTheme(theme) {
      if (['luxury_showroom', 'rusty_workshop'].includes(theme)) {
        this.currentTheme = theme
      }
    },
  },
  persist: true, // optional: if using pinia-plugin-persistedstate
})