import type { ThemeDefinition } from 'vuetify'

export const staticPrimaryColor = '#6366F1'
export const staticPrimaryDarkenColor = '#4F46E5'

export const themes: Record<string, ThemeDefinition> = {
  light: {
    dark: false,
    colors: {
      // Primary brand colors - Modern indigo
      'primary': staticPrimaryColor,
      'on-primary': '#FFFFFF',
      'primary-darken-1': staticPrimaryDarkenColor,
      'primary-lighten-1': '#818CF8',

      // Secondary - Purple accent
      'secondary': '#8B5CF6',
      'secondary-darken-1': '#7C3AED',
      'secondary-lighten-1': '#A78BFA',
      'on-secondary': '#FFFFFF',

      // Semantic colors
      'success': '#10B981',
      'on-success': '#FFFFFF',
      'info': '#3B82F6',
      'on-info': '#FFFFFF',
      'warning': '#F59E0B',
      'on-warning': '#FFFFFF',
      'error': '#EF4444',
      'on-error': '#FFFFFF',

      // Surface & backgrounds
      'background': '#F8FAFC',
      'on-background': '#0F172A',
      'surface': '#FFFFFF',
      'on-surface': '#0F172A',
      'surface-bright': '#FFFFFF',
      'surface-variant': '#F1F5F9',
      'on-surface-variant': '#64748B',

      // Grey scale
      'grey': '#64748B',
      'grey-darken-1': '#475569',
      'grey-lighten-1': '#94A3B8',
      'grey-lighten-2': '#CBD5E1',
      'grey-lighten-3': '#E2E8F0',
      'grey-lighten-4': '#F1F5F9',
      'grey-lighten-5': '#F8FAFC',

      // Component specific
      'perfect-scrollbar-thumb': '#CBD5E1',
      'track-bg': '#F1F5F9',
    },

    variables: {
      'border-color': '#E2E8F0',
      'border-opacity': 0.12,
      'high-emphasis-opacity': 0.87,
      'medium-emphasis-opacity': 0.60,
      'disabled-opacity': 0.38,
      'idle-opacity': 0.04,
      'hover-opacity': 0.04,
      'focus-opacity': 0.12,
      'selected-opacity': 0.08,
      'activated-opacity': 0.12,
      'pressed-opacity': 0.12,
      'dragged-opacity': 0.08,
      'theme-kbd': '#212529',
      'theme-on-kbd': '#FFFFFF',
      'theme-code': '#F5F5F5',
      'theme-on-code': '#000000',
    },
  },

  dark: {
    dark: true,
    colors: {
      // Primary brand colors - Lighter shades for dark mode
      'primary': '#818CF8',
      'on-primary': '#FFFFFF',
      'primary-darken-1': '#6366F1',
      'primary-lighten-1': '#A5B4FC',

      // Secondary - Purple accent
      'secondary': '#A78BFA',
      'secondary-darken-1': '#8B5CF6',
      'secondary-lighten-1': '#C4B5FD',
      'on-secondary': '#FFFFFF',

      // Semantic colors - Adjusted for dark mode
      'success': '#34D399',
      'on-success': '#FFFFFF',
      'info': '#60A5FA',
      'on-info': '#FFFFFF',
      'warning': '#FBBF24',
      'on-warning': '#FFFFFF',
      'error': '#F87171',
      'on-error': '#FFFFFF',

      // Surface & backgrounds - Dark slate palette
      'background': '#0F172A',
      'on-background': '#F1F5F9',
      'surface': '#1E293B',
      'on-surface': '#F1F5F9',
      'surface-bright': '#334155',
      'surface-variant': '#1E293B',
      'on-surface-variant': '#94A3B8',

      // Grey scale
      'grey': '#94A3B8',
      'grey-darken-1': '#CBD5E1',
      'grey-lighten-1': '#64748B',
      'grey-lighten-2': '#475569',
      'grey-lighten-3': '#334155',
      'grey-lighten-4': '#1E293B',
      'grey-lighten-5': '#0F172A',

      // Component specific
      'perfect-scrollbar-thumb': '#475569',
      'track-bg': '#334155',
    },

    variables: {
      'border-color': '#334155',
      'border-opacity': 0.12,
      'high-emphasis-opacity': 0.87,
      'medium-emphasis-opacity': 0.60,
      'disabled-opacity': 0.38,
      'idle-opacity': 0.10,
      'hover-opacity': 0.08,
      'focus-opacity': 0.12,
      'selected-opacity': 0.12,
      'activated-opacity': 0.16,
      'pressed-opacity': 0.14,
      'dragged-opacity': 0.10,
      'theme-kbd': '#212529',
      'theme-on-kbd': '#FFFFFF',
      'theme-code': '#343434',
      'theme-on-code': '#CCCCCC',
    },
  },
}

export default themes