import type { ChatConfig } from '@/types'
import { resolveValue, type GlobalValues } from '@/utils/resolveAppearance'

type CartSettingsShape = Record<string, any>

export interface ResolvedCartAppearance {
  badge: {
    background: string
    color: string
    iconColor: string
    borderRadius: string
    minWidth: string
    height: string
  }
  drawer: {
    background: string
    borderColor: string
    borderRadius: string
    shadow: string
  }
  header: {
    background: string
    color: string
    countBackground: string
    countColor: string
  }
  item: {
    background: string
    borderColor: string
    borderRadius: string
    titleColor: string
    metaColor: string
    priceColor: string
    quantityBackground: string
    quantityColor: string
    removeColor: string
  }
  summary: {
    background: string
    borderColor: string
    borderRadius: string
    labelColor: string
    valueColor: string
  }
  actions: {
    primaryBackground: string
    primaryColor: string
    primaryHoverBackground: string
    secondaryBackground: string
    secondaryColor: string
    secondaryBorderColor: string
    secondaryHoverBackground: string
    borderRadius: string
  }
  empty: {
    iconColor: string
    titleColor: string
    descriptionColor: string
  }
}

const defaults: ResolvedCartAppearance = {
  badge: {
    background: '#EEF2FF',
    color: '#1F2937',
    iconColor: '#4F46E5',
    borderRadius: '9999px',
    minWidth: '36px',
    height: '36px',
  },
  drawer: {
    background: '#FFFFFF',
    borderColor: '#E5E7EB',
    borderRadius: '16px',
    shadow: '0 18px 40px rgba(15, 23, 42, 0.14)',
  },
  header: {
    background: '#F8FAFC',
    color: '#0F172A',
    countBackground: '#4F46E5',
    countColor: '#FFFFFF',
  },
  item: {
    background: '#FFFFFF',
    borderColor: '#E5E7EB',
    borderRadius: '12px',
    titleColor: '#111827',
    metaColor: '#6B7280',
    priceColor: '#4F46E5',
    quantityBackground: '#F3F4F6',
    quantityColor: '#111827',
    removeColor: '#DC2626',
  },
  summary: {
    background: '#F8FAFC',
    borderColor: '#E5E7EB',
    borderRadius: '12px',
    labelColor: '#6B7280',
    valueColor: '#111827',
  },
  actions: {
    primaryBackground: '#4F46E5',
    primaryColor: '#FFFFFF',
    primaryHoverBackground: '#4338CA',
    secondaryBackground: '#FFFFFF',
    secondaryColor: '#111827',
    secondaryBorderColor: '#D1D5DB',
    secondaryHoverBackground: '#F9FAFB',
    borderRadius: '12px',
  },
  empty: {
    iconColor: '#CBD5E1',
    titleColor: '#475569',
    descriptionColor: '#94A3B8',
  },
}

export function getResolvedCartAppearance(config: ChatConfig): ResolvedCartAppearance {
  const globalValues = (config.appearance_preset?.global_values || {}) as GlobalValues
  const settings = (config.appearance_preset?.widget_settings?.cart || {}) as CartSettingsShape
  const rv = (field: unknown, fallback: string) => resolveValue(field as any, globalValues, fallback)

  return {
    badge: {
      background: rv(settings.badge?.background, defaults.badge.background),
      color: rv(settings.badge?.color, defaults.badge.color),
      iconColor: rv(settings.badge?.iconColor, defaults.badge.iconColor),
      borderRadius: rv(settings.badge?.borderRadius, defaults.badge.borderRadius),
      minWidth: rv(settings.badge?.minWidth, defaults.badge.minWidth),
      height: rv(settings.badge?.height, defaults.badge.height),
    },
    drawer: {
      background: rv(settings.drawer?.background, defaults.drawer.background),
      borderColor: rv(settings.drawer?.borderColor, defaults.drawer.borderColor),
      borderRadius: rv(settings.drawer?.borderRadius, defaults.drawer.borderRadius),
      shadow: rv(settings.drawer?.shadow, defaults.drawer.shadow),
    },
    header: {
      background: rv(settings.header?.background, defaults.header.background),
      color: rv(settings.header?.color, defaults.header.color),
      countBackground: rv(settings.header?.countBackground, defaults.header.countBackground),
      countColor: rv(settings.header?.countColor, defaults.header.countColor),
    },
    item: {
      background: rv(settings.item?.background, defaults.item.background),
      borderColor: rv(settings.item?.borderColor, defaults.item.borderColor),
      borderRadius: rv(settings.item?.borderRadius, defaults.item.borderRadius),
      titleColor: rv(settings.item?.titleColor, defaults.item.titleColor),
      metaColor: rv(settings.item?.metaColor, defaults.item.metaColor),
      priceColor: rv(settings.item?.priceColor, defaults.item.priceColor),
      quantityBackground: rv(settings.item?.quantityBackground, defaults.item.quantityBackground),
      quantityColor: rv(settings.item?.quantityColor, defaults.item.quantityColor),
      removeColor: rv(settings.item?.removeColor, defaults.item.removeColor),
    },
    summary: {
      background: rv(settings.summary?.background, defaults.summary.background),
      borderColor: rv(settings.summary?.borderColor, defaults.summary.borderColor),
      borderRadius: rv(settings.summary?.borderRadius, defaults.summary.borderRadius),
      labelColor: rv(settings.summary?.labelColor, defaults.summary.labelColor),
      valueColor: rv(settings.summary?.valueColor, defaults.summary.valueColor),
    },
    actions: {
      primaryBackground: rv(settings.actions?.primaryBackground, defaults.actions.primaryBackground),
      primaryColor: rv(settings.actions?.primaryColor, defaults.actions.primaryColor),
      primaryHoverBackground: rv(settings.actions?.primaryHoverBackground, defaults.actions.primaryHoverBackground),
      secondaryBackground: rv(settings.actions?.secondaryBackground, defaults.actions.secondaryBackground),
      secondaryColor: rv(settings.actions?.secondaryColor, defaults.actions.secondaryColor),
      secondaryBorderColor: rv(settings.actions?.secondaryBorderColor, defaults.actions.secondaryBorderColor),
      secondaryHoverBackground: rv(settings.actions?.secondaryHoverBackground, defaults.actions.secondaryHoverBackground),
      borderRadius: rv(settings.actions?.borderRadius, defaults.actions.borderRadius),
    },
    empty: {
      iconColor: rv(settings.empty?.iconColor, defaults.empty.iconColor),
      titleColor: rv(settings.empty?.titleColor, defaults.empty.titleColor),
      descriptionColor: rv(settings.empty?.descriptionColor, defaults.empty.descriptionColor),
    },
  }
}
