const stageLabels: Record<number, { label: string; color: string }> = {
  0: { label: "Beginner", color: "text-muted bg-stone" },
  1: { label: "Foundation", color: "text-amber bg-amber/10" },
  2: { label: "Growing", color: "text-sage bg-sage/10" },
  3: { label: "Established", color: "text-info bg-info/10" },
  4: { label: "Advanced", color: "text-ink bg-amber/15" },
};

export default function StageBadge({ stage }: { stage: number }) {
  const info = stageLabels[stage] ?? stageLabels[0];

  return (
    <span
      className={`inline-flex items-center gap-1 px-2.5 py-0.5 rounded-full text-xs font-medium ${info.color}`}
    >
      <span className="w-1.5 h-1.5 rounded-full bg-current opacity-60" />
      {info.label}
    </span>
  );
}