/**
 * Chart Color Configuration
 * Provides vibrant, accessible colors for data visualization
 * Converts design system colors to recharts-compatible formats
 */

export const CHART_COLORS = {
  // Primary blue palette - vibrant and professional
  primary: '#3b82f6', // Blue 500
  primaryLight: '#60a5fa', // Blue 400
  primaryDark: '#2563eb', // Blue 600

  // Secondary accent colors - complementary palette
  accent1: '#8b5cf6', // Violet 500
  accent2: '#ec4899', // Pink 500
  accent3: '#f59e0b', // Amber 500
  accent4: '#10b981', // Emerald 500
  accent5: '#06b6d4', // Cyan 500

  // Status colors
  success: '#10b981', // Emerald 500
  warning: '#f59e0b', // Amber 500
  error: '#ef4444', // Red 500
  info: '#3b82f6', // Blue 500

  // Neutral colors for supporting elements
  muted: '#94a3b8', // Slate 400
  mutedDark: '#64748b', // Slate 500
};

// Chart-specific color palettes for different chart types
export const CHART_PALETTES = {
  // Line chart palette - 2 contrasting colors
  line: [CHART_COLORS.primary, CHART_COLORS.accent1],

  // Bar chart palette - 2 complementary colors
  bar: [CHART_COLORS.primary, CHART_COLORS.accent2],

  // Area chart palette - 2 harmonious colors with gradients
  area: [CHART_COLORS.primary, CHART_COLORS.accent5],

  // Pie chart palette - 4-5 distinct colors
  pie: [CHART_COLORS.primary, CHART_COLORS.accent1, CHART_COLORS.accent3, CHART_COLORS.accent4],

  // Multi-series palette - for charts with many data series
  multi: [
    CHART_COLORS.primary,
    CHART_COLORS.accent1,
    CHART_COLORS.accent2,
    CHART_COLORS.accent3,
    CHART_COLORS.accent4,
    CHART_COLORS.accent5,
  ],
};

// Gradient definitions for area charts
export const CHART_GRADIENTS = {
  primary: {
    start: CHART_COLORS.primary,
    end: `${CHART_COLORS.primary}20`, // 20% opacity
  },
  accent: {
    start: CHART_COLORS.accent1,
    end: `${CHART_COLORS.accent1}20`, // 20% opacity
  },
};

// Helper function to get color with opacity
export function withOpacity(color: string, opacity: number): string {
  // Convert opacity (0-1) to hex (00-FF)
  const hex = Math.round(opacity * 255)
    .toString(16)
    .padStart(2, '0');
  return `${color}${hex}`;
}
