/** Shared Recharts styling from surveystronghold.html tokens. */
export const CHART_COLORS = {
  primary: "#1E5BB0",
  accent: "#00A3E0",
  primaryLight: "#93C5FD",
  border: "#E2E8F0",
  grid: "#EEF2F7",
  success: "#16A34A",
  danger: "#DC2626",
  muted: "#64748B",
  pie: [
    "#1E5BB0",
    "#00A3E0",
    "#16A34A",
    "#F59E0B",
    "#8B5CF6",
    "#EC4899",
    "#93C5FD",
    "#64748B",
  ],
};

export const chartTheme = {
  cartesianGrid: { stroke: CHART_COLORS.grid, vertical: false },
  xAxis: {
    tick: { fill: CHART_COLORS.muted, fontSize: 11 },
    axisLine: false,
    tickLine: false,
  },
  yAxis: {
    tick: { fill: CHART_COLORS.muted, fontSize: 11 },
    axisLine: false,
    tickLine: false,
  },
  tooltip: {
    contentStyle: {
      borderRadius: 8,
      border: `1px solid ${CHART_COLORS.border}`,
      fontSize: 12,
    },
  },
};

/** NPS bar color by score bucket. */
export function npsBarColor(score: number): string {
  if (score >= 9) return CHART_COLORS.success;
  if (score >= 7) return CHART_COLORS.accent;
  return CHART_COLORS.danger;
}