import { forwardRef } from 'react';
import { cn } from '@/lib/utils';

type CardVariant = 'default' | 'surface-low';

interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
  variant?: CardVariant;
  hover?: boolean;
  className?: string;
  children: React.ReactNode;
}

const variantClasses: Record<CardVariant, string> = {
  default: 'bg-surface-high shadow-card',
  'surface-low': 'bg-surface-low shadow-none',
};

const Card = forwardRef<HTMLDivElement, CardProps>(
  (
    {
      variant = 'default',
      hover = true,
      className,
      children,
      ...props
    },
    ref,
  ) => {
    return (
      <div
        ref={ref}
        className={cn(
          'rounded-xl',
          variantClasses[variant],
          hover && [
            'transition-all duration-300 ease-out',
            'hover:-translate-y-1.5',
            'hover:shadow-[0_20px_40px_rgba(25,28,29,0.06)]',
          ],
          className,
        )}
        {...props}
      >
        {children}
      </div>
    );
  },
);

Card.displayName = 'Card';

export default Card;
export type { CardProps, CardVariant };
