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

type DotFieldProps = {
  className?: string;
  variant?: "hero" | "light";
};

export function DotField({ className, variant = "hero" }: DotFieldProps) {
  return (
    <div
      className={cn(
        "pointer-events-none absolute inset-0",
        variant === "hero" ? "marketing-dot-field marketing-scanline" : "opacity-30",
        variant === "light" &&
          "bg-[radial-gradient(circle_at_center,hsl(var(--foreground)/0.07)_1px,transparent_1px)] [background-size:24px_24px]",
        className,
      )}
      aria-hidden
    />
  );
}