// @design-system: primitives/Pagination

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

/**
 * Page button CVA variants.
 * Token-only classes - no hardcoded colors.
 */
export const pageButtonVariants = cva(
  [
    'inline-flex items-center justify-center',
    'rounded-md',
    'text-sm font-medium',
    'transition-colors',
    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-1',
    'focus-visible:ring-brand-primary-500',
    'disabled:pointer-events-none disabled:opacity-40',
    'h-8 w-8',
  ],
  {
    variants: {
      active: {
        true: ['bg-brand-primary-600 text-white'],
        false: [
          'bg-transparent text-text-secondary',
          'hover:bg-neutral-100',
          'border border-neutral-200',
        ],
      },
    },
    defaultVariants: { active: false },
  },
);

/** Nav button (prev/next) variant - slightly wider to fit chevron + spacing */
export const navButtonVariants = cva([
  'inline-flex items-center justify-center',
  'rounded-md',
  'text-sm font-medium',
  'transition-colors',
  'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-1',
  'focus-visible:ring-brand-primary-500',
  'disabled:pointer-events-none disabled:opacity-40',
  'h-8 px-2',
  'bg-transparent text-text-secondary',
  'hover:bg-neutral-100',
  'border border-neutral-200',
]);