/**
 * Semantic Color Palette
 * Bold, distinctive colors that embody the Percolate design language
 * Modern, impactful, and memorable semantic colors for contemporary interfaces
 */

export type SemanticColorName = "success" | "warning" | "error" | "info" | "neutral"

export interface SemanticColor {
  name: SemanticColorName
  light: {
    background: string
    foreground: string
    border: string
    text: string
  }
  dark: {
    background: string
    foreground: string
    border: string
    text: string
  }
}

/**
 * Contemporary semantic color palette with personality and impact
 * Inspired by modern design systems and optimized for the Percolate aesthetic
 */
export const semanticColors: Record<SemanticColorName, SemanticColor> = {
  success: {
    name: "success",
    light: {
      background: "#bbf7d0", // More saturated green background
      foreground: "#16a34a", // Vibrant forest green
      border: "#c2f8d5", // Ultra subtle green border (very close to background)
      text: "#15803d", // Deep emerald text
    },
    dark: {
      background: "#14532d", // Rich forest background
      foreground: "#22d3ee", // Bright cyan accent
      border: "#13502b", // Ultra subtle border (very close to background, slightly darker)
      text: "#86efac", // Mint green text
    },
  },
  warning: {
    name: "warning",
    light: {
      background: "#fed7aa", // More saturated orange background
      foreground: "#ea580c", // Bold orange accent
      border: "#feddb4", // Ultra subtle orange border (very close to background)
      text: "#c2410c", // Deep orange text
    },
    dark: {
      background: "#431407", // Deep orange background
      foreground: "#fb7185", // Bright coral accent
      border: "#401306", // Ultra subtle border (very close to background, slightly darker)
      text: "#fed7aa", // Peach text
    },
  },
  error: {
    name: "error",
    light: {
      background: "#fecaca", // More saturated red background
      foreground: "#dc2626", // Bold crimson
      border: "#fed0d0", // Ultra subtle red border (very close to background)
      text: "#b91c1c", // Deep red text
    },
    dark: {
      background: "#450a0a", // Deep crimson background
      foreground: "#fb7185", // Bright pink accent
      border: "#420909", // Ultra subtle border (very close to background, slightly darker)
      text: "#fca5a5", // Rose text
    },
  },
  info: {
    name: "info",
    light: {
      background: "#bfdbfe", // More saturated blue background
      foreground: "#2563eb", // Royal blue
      border: "#c7e0fe", // Ultra subtle blue border (very close to background)
      text: "#1d4ed8", // Deep blue text
    },
    dark: {
      background: "#1e3a8a", // Navy background
      foreground: "#a78bfa", // Purple accent
      border: "#1d3782", // Ultra subtle border (very close to background, slightly darker)
      text: "#93c5fd", // Light blue text
    },
  },
  neutral: {
    name: "neutral",
    light: {
      background: "#e2e8f0", // More visible gray background
      foreground: "#6366f1", // Indigo accent
      border: "#e7ecf3", // Ultra subtle gray border (very close to background)
      text: "#475569", // Charcoal text
    },
    dark: {
      background: "#1e293b", // Dark slate background
      foreground: "#a855f7", // Purple accent
      border: "#1c2635", // Ultra subtle border (very close to background, slightly darker)
      text: "#e2e8f0", // Light gray text
    },
  },
}

/**
 * Get semantic color values for the current theme
 */
export function getSemanticColor(colorName: SemanticColorName, theme: "light" | "dark" = "light") {
  return semanticColors[colorName][theme]
}

/**
 * Get all semantic colors for the current theme
 */
export function getAllSemanticColors(theme: "light" | "dark" = "light") {
  return Object.entries(semanticColors).reduce(
    (acc, [key, color]) => {
      acc[key as SemanticColorName] = color[theme]
      return acc
    },
    {} as Record<SemanticColorName, SemanticColor[typeof theme]>,
  )
}

/**
 * CSS custom properties for semantic colors
 * These will be injected into the document root
 */
export function getSemanticColorCSSProperties(theme: "light" | "dark" = "light") {
  const colors = getAllSemanticColors(theme)
  const properties: Record<string, string> = {}

  Object.entries(colors).forEach(([name, color]) => {
    properties[`--semantic-${name}-bg`] = color.background
    properties[`--semantic-${name}-fg`] = color.foreground
    properties[`--semantic-${name}-border`] = color.border
    properties[`--semantic-${name}-text`] = color.text
  })

  return properties
}

/**
 * Utility function to check if a semantic color is "warm" (red/orange/yellow)
 * Used for dynamic adjustments based on primary color temperature
 */
export function isWarmSemanticColor(colorName: SemanticColorName): boolean {
  return ["warning", "error"].includes(colorName)
}

/**
 * Utility function to check if a semantic color is "cool" (blue/green)
 * Used for dynamic adjustments based on primary color temperature
 */
export function isCoolSemanticColor(colorName: SemanticColorName): boolean {
  return ["success", "info"].includes(colorName)
}