/**
 * Centralized button style configurations using tailwind-variants
 * Maintains consistent button styling across the app with automatic class merging
 */

import { tv, type VariantProps } from "tailwind-variants";

export const buttonStyles = tv({
  base: "group transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed",
  variants: {
    intent: {
      // Theme button - 页面主题色按钮 (bg-foreground text-background)
      theme: "rounded-xl h-11 w-full px-6 text-body-small font-bold bg-foreground text-background",
      // Max button - 绿色 Max 按钮
      max: "rounded-full px-3 h-[24px] min-w-0 text-[12px] font-bold bg-[#a7f3d0] text-[#065f46] dark:bg-green-900/30 dark:text-green-300",
    },
    fullWidth: {
      true: "w-full",
    },
  },
  defaultVariants: {
    intent: "theme",
  },
});

// Type export for use in components
export type ButtonIntent = VariantProps<typeof buttonStyles>["intent"];

/**
 * Disabled button state classes
 * Apply these when button is disabled
 */
export const disabledButtonClasses = "cursor-not-allowed opacity-50";