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

interface PrimaryButtonProps {
  children: React.ReactNode;
  href?: string;
  className?: string;
  onClick?: () => void;
}

export default function PrimaryButton({ children, href = '#', className = '', onClick }: PrimaryButtonProps) {
  const baseClasses = 'inline-flex items-center justify-center gap-2 rounded-pill bg-white dark:bg-slate-800 dark:hover:bg-slate-700 px-6 py-3 md:px-7 md:py-3.5 text-base font-semibold text-slate-900 dark:text-white shadow-elev transition-all duration-200 hover:bg-white/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white dark:focus-visible:ring-slate-400 focus-visible:ring-offset-2 focus-visible:ring-offset-brand-bg dark:focus-visible:ring-offset-slate-900';

  if (onClick) {
    return (
      <button
        onClick={onClick}
        className={cn(baseClasses, className)}
      >
        {children}
      </button>
    );
  }

  return (
    <a
      href={href}
      className={cn(baseClasses, className)}
    >
      {children}
    </a>
  );
}