import { cva } from 'class-variance-authority';

export const buttonVariants = cva(
  [
    'group relative inline-flex items-center justify-center',
    'overflow-hidden',
    'font-medium tracking-wide',
    'transition-all duration-300 ease-out',
    'focus-visible:outline-none',
    'cursor-pointer disabled:pointer-events-none',
    'border-2',
    'px-6 py-3',
  ],
  {
    variants: {
      variant: {
        primary: [
          'bg-black text-white border-black',
          'disabled:bg-transparent',
          'disabled:text-black',
          'disabled:border-black',
        ],

        secondary: [
          'bg-transparent text-white border-white/60',
          'hover:border-white',
          'disabled:opacity-50',
        ],

        terciary: [
          'bg-transparent text-text-primary border-text-primary/60',
          'hover:border-text-primary hover:shadow-md',
          'disabled:opacity-50',
        ],
      },
    },

    defaultVariants: {
      variant: 'primary',
    },
  },
);