import { type HTMLAttributes, forwardRef } from "react";
import { cn } from "@/lib/utils";

interface CardProps extends HTMLAttributes<HTMLDivElement> {
  hover?: boolean;
  variant?: "low" | "default";
}

const Card = forwardRef<HTMLDivElement, CardProps>(
  ({ hover, variant = "low", className, children, ...rest }, ref) => (
    <div
      ref={ref}
      className={cn(
        "rounded-xl p-6",
        variant === "low" ? "bg-surface-container-low" : "bg-surface-container",
        hover && "hover:bg-surface-container-high transition-colors",
        className
      )}
      {...rest}
    >
      {children}
    </div>
  )
);

Card.displayName = "Card";
export { Card, type CardProps };