import { cn } from "@/lib/utils";

export type BadgeTone = "neutral" | "green" | "yellow" | "orange" | "red" | "blue";

const tones: Record<BadgeTone, string> = {
  neutral: "border-[#ded8e8] bg-[#f3eff8] text-[#272445]",
  green: "border-[#b7e3dc] bg-[#e9f8f5] text-[#11766c]",
  yellow: "border-[#f0d797] bg-[#fff5d9] text-[#7a5209]",
  orange: "border-[#f0c0a4] bg-[#fff0e7] text-[#9a4c22]",
  red: "border-[#f3abc0] bg-[#ffe8ef] text-[#b30b3a]",
  blue: "border-[#cbc4df] bg-[#eee9f6] text-[#272445]"
};

export function Badge({
  className,
  tone = "neutral",
  children
}: {
  className?: string;
  tone?: BadgeTone;
  children: React.ReactNode;
}) {
  return (
    <span
      className={cn(
        "inline-flex h-6 items-center rounded-sm border px-2 text-xs font-semibold",
        tones[tone],
        className
      )}
    >
      {children}
    </span>
  );
}