/**
 * Product Addons Configuration
 * 
 * Types and configuration for the Product Addons feature
 */

// Addon field types
export type AddonFieldType = 
  | 'checkbox'
  | 'radio'
  | 'select'
  | 'text'
  | 'textarea'
  | 'heading'

// Pricing types
export type AddonPricingType = 
  | 'flat_fee'
  | 'quantity_based'
  | 'percentage'

// Option interface for radio/checkbox/select fields
export interface AddonOption {
  id: string
  label: string
  price: number
  pricingType: AddonPricingType
  image?: string
  isDefault?: boolean
}

// Single addon field interface
export interface AddonField {
  id: string
  title: string
  description?: string
  type: AddonFieldType
  required: boolean
  options?: AddonOption[]
  placeholder?: string
  price?: number
  pricingType?: AddonPricingType
  position: number
}

// Product Addons settings
export interface ProductAddonsSettings {
  enabled: boolean
  // Display settings
  addonPosition: 'before_add_to_cart' | 'after_add_to_cart'
  showPricesInLabels: boolean
  showPricesIncludingTax: boolean
  priceDisplayFormat: 'absolute' | 'relative' // +$5.00 vs $5.00
  // Behavior settings
  updatePriceDynamically: boolean
  // Cart/Checkout display
  showAddonsInCart: boolean
}

// Customization settings for non-Elementor users
export interface AddonCustomizationSettings {
  // Template/Layout
  template: 'stacked' | 'grid' | 'inline'
  optionColumns: number
  optionCardStyle: 'bordered' | 'filled'
  showDescriptions: boolean
  // Typography
  fontFamily: string
  // Container styles
  containerBackground: string
  containerBorderColor: string
  containerBorderRadius: number
  containerPadding: number
  // Title styles
  titleFontSize: number
  titleFontWeight: string
  titleColor: string
  // Description styles
  descriptionFontSize: number
  descriptionColor: string
  // Label styles
  labelFontSize: number
  labelColor: string
  // Price styles
  priceColor: string
  priceFontSize: number
  priceFontWeight: string
  // Input styles
  inputBorderColor: string
  inputBorderRadius: number
  inputBackgroundColor: string
  inputFocusBorderColor: string
  // Image option styles
  imageOptionSize: number
  imageOptionBorderRadius: number
  imageOptionSelectedBorderColor: string
  imageOptionSelectedBorderWidth: number
  // Required indicator
  requiredIndicatorColor: string
  // Total price styles
  totalPriceBackground: string
  totalPriceFontSize: number
  totalPriceFontWeight: string
  totalPriceColor: string
}

// Default settings
export const defaultSettings: ProductAddonsSettings = {
  enabled: false,
  addonPosition: 'before_add_to_cart',
  showPricesInLabels: true,
  showPricesIncludingTax: false,
  priceDisplayFormat: 'relative',
  updatePriceDynamically: true,
  showAddonsInCart: true,
}

export const defaultCustomization: AddonCustomizationSettings = {
  template: 'stacked',
  optionColumns: 2,
  optionCardStyle: 'bordered',
  showDescriptions: true,
  fontFamily: '',
  containerBackground: '#ffffff',
  containerBorderColor: '#e5e7eb',
  containerBorderRadius: 8,
  containerPadding: 20,
  titleFontSize: 16,
  titleFontWeight: '600',
  titleColor: '#111827',
  descriptionFontSize: 14,
  descriptionColor: '#6b7280',
  labelFontSize: 14,
  labelColor: '#374151',
  priceColor: '#00226b',
  priceFontSize: 14,
  priceFontWeight: '500',
  inputBorderColor: '#d1d5db',
  inputBorderRadius: 6,
  inputBackgroundColor: '#ffffff',
  inputFocusBorderColor: '#00226b',
  imageOptionSize: 80,
  imageOptionBorderRadius: 8,
  imageOptionSelectedBorderColor: '#00226b',
  imageOptionSelectedBorderWidth: 3,
  requiredIndicatorColor: '#ef4444',
  totalPriceBackground: '#f3f4f6',
  totalPriceFontSize: 18,
  totalPriceFontWeight: '700',
  totalPriceColor: '#111827',
}

// Field type configuration
export const fieldTypeConfig: Record<AddonFieldType, {
  label: string
  description: string
  icon: string
  hasOptions: boolean
  hasPricing: boolean
  supportsImages: boolean
}> = {
  checkbox: {
    label: 'Checkbox',
    description: 'Allow multiple selections',
    icon: 'check-square',
    hasOptions: true,
    hasPricing: true,
    supportsImages: true,
  },
  radio: {
    label: 'Radio Buttons',
    description: 'Single selection from options',
    icon: 'circle-dot',
    hasOptions: true,
    hasPricing: true,
    supportsImages: true,
  },
  select: {
    label: 'Dropdown',
    description: 'Select from a dropdown list',
    icon: 'list',
    hasOptions: true,
    hasPricing: true,
    supportsImages: false,
  },
  text: {
    label: 'Short Text',
    description: 'Single line text input',
    icon: 'type',
    hasOptions: false,
    hasPricing: true,
    supportsImages: false,
  },
  textarea: {
    label: 'Long Text',
    description: 'Multi-line text area',
    icon: 'align-left',
    hasOptions: false,
    hasPricing: true,
    supportsImages: false,
  },
  heading: {
    label: 'Heading',
    description: 'Section heading (no input)',
    icon: 'heading',
    hasOptions: false,
    hasPricing: false,
    supportsImages: false,
  },
}

// Pricing type configuration
export const pricingTypeConfig: Record<AddonPricingType, {
  label: string
  description: string
}> = {
  flat_fee: {
    label: 'Flat Fee',
    description: 'Fixed price regardless of quantity',
  },
  quantity_based: {
    label: 'Quantity Based',
    description: 'Price multiplied by product quantity',
  },
  percentage: {
    label: 'Percentage',
    description: 'Percentage of product price',
  },
}

// Position options
export const positionOptions = [
  { value: 'before_add_to_cart', label: 'Before Add to Cart Button' },
  { value: 'after_add_to_cart', label: 'After Add to Cart Button' },
] as const

// Quick start color presets
export interface QuickStartPreset {
  id: string
  label: string
  color: string
  customization: Partial<AddonCustomizationSettings>
}

export const quickStartPresets: QuickStartPreset[] = [
  {
    id: 'brand',
    label: 'Brand',
    color: '#00226b',
    customization: {
      priceColor: '#00226b',
      inputFocusBorderColor: '#00226b',
      imageOptionSelectedBorderColor: '#00226b',
      totalPriceColor: '#00226b',
      totalPriceBackground: '#f0f5f8',
    },
  },
  {
    id: 'dark',
    label: 'Dark',
    color: '#18181b',
    customization: {
      priceColor: '#18181b',
      inputFocusBorderColor: '#18181b',
      imageOptionSelectedBorderColor: '#18181b',
      totalPriceColor: '#18181b',
      totalPriceBackground: '#f4f4f5',
    },
  },
  {
    id: 'bold',
    label: 'Bold',
    color: '#dc2626',
    customization: {
      priceColor: '#dc2626',
      inputFocusBorderColor: '#dc2626',
      imageOptionSelectedBorderColor: '#dc2626',
      totalPriceColor: '#dc2626',
      totalPriceBackground: '#fef2f2',
    },
  },
]