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

interface BadgeProps {
  children: React.ReactNode;
  color?: string;
  className?: string;
  variant?: "solid" | "outline" | "subtle";
}

export default function Badge({ children, color = "#3B82F6", className, variant = "subtle" }: BadgeProps) {
  const style = variant === "solid"
    ? { backgroundColor: color, color: "#fff" }
    : variant === "outline"
    ? { border: `1px solid ${color}`, color, backgroundColor: "transparent" }
    : { backgroundColor: `${color}22`, color };

  return (
    <span
      className={cn("inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-semibold", className)}
      style={style}
    >
      {children}
    </span>
  );
}