import * as React from "react";
import type { LucideIcon } from "lucide-react";

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

/** Rounded icon tile used across landing sections (accent bg, brand-blue icon). */
export function IconBadge({
  icon: Icon,
  size = "default",
  className,
}: {
  icon: LucideIcon;
  size?: "default" | "lg";
  className?: string;
}) {
  return (
    <span
      className={cn(
        "inline-flex shrink-0 items-center justify-center rounded-2xl bg-accent text-primary-blue",
        size === "lg" ? "size-14" : "size-12",
        className,
      )}
    >
      <Icon className={size === "lg" ? "size-7" : "size-6"} />
    </span>
  );
}