import { cva } from "class-variance-authority";
export const tabsVariants = cva("w-full");
// Custom scrollbar styles to match original component
const scrollbarStyles = [
    // Firefox scrollbar
    "scrollbar-width-thin",
    // Webkit scrollbars
    "[&::-webkit-scrollbar-thumb]:rounded-[5px]",
    "[&::-webkit-scrollbar]:w-[0.2rem]",
    "md:[&::-webkit-scrollbar]:w-[0rem]",
    "[&::-webkit-scrollbar]:h-[0rem]",
    "md:[&::-webkit-scrollbar]:h-[0.3em]",
    "[&::-webkit-scrollbar]:translate-y-2"
].join(" ");
export const tabsListVariants = cva([
    "w-full list-none overflow-x-auto overflow-y-hidden whitespace-nowrap",
    "grid grid-flow-col justify-start z-10",
    scrollbarStyles
].join(" "), {
    variants: {
        variant: {
            text: "mb-[-2px]",
            filled: ""
        },
        color: {
            primary: "",
            secondary: ""
        }
    },
    compoundVariants: [
        {
            variant: "filled",
            color: "primary",
            className: "border-primary-500"
        },
        {
            variant: "filled",
            color: "secondary",
            className: "divide-gray-200 divide-x dark:divide-secondary-500"
        }
    ],
    defaultVariants: {
        variant: "text",
        color: "secondary"
    }
});
export const tabsListItemVariants = cva("cursor-pointer rounded-none focus:outline-none disabled:cursor-not-allowed", {
    variants: {
        size: {
            xs: "p-2",
            sm: "p-2.5",
            md: "p-2.5",
            lg: "p-3.5",
            xl: "p-[18px]"
        },
        variant: {
            text: [
                "px-4",
                "border-0",
                "hover:text-primary-500",
                "dark:hover:text-primary-400",
                "dark:disabled:hover:text-secondary-400",
                "disabled:text-secondary-300",
                "disabled:hover:bg-transparent"
            ].join(" "),
            filled: "first:rounded-l last:rounded-r"
        },
        color: {
            primary: "",
            secondary: ""
        },
        active: {
            true: ""
        }
    },
    compoundVariants: [
        // Non-active filled variant styles (matching UI Button defaults)
        {
            variant: "filled",
            color: "primary",
            active: false,
            className: [
                "text-white",
                "bg-primary-500",
                "hover:bg-primary-700",
                "focus-visible:bg-primary-400",
                "active:bg-primary-500",
                "disabled:bg-primary-200",
                "disabled:text-white",
                "focus-visible:ring",
                "focus-visible:ring-[#99CBFA]",
                "focus-visible:active:bg-primary-500"
            ].join(" ")
        },
        {
            variant: "filled",
            color: "secondary",
            active: false,
            className: [
                "bg-gray-100",
                "hover:bg-gray-300",
                "focus-visible:bg-gray-200",
                "active:bg-gray-100",
                "disabled:bg-gray-100",
                "disabled:text-secondary-300",
                "focus-visible:ring",
                "focus-visible:ring-gray-100",
                "focus-visible:active:bg-gray-100"
            ].join(" ")
        },
        // Active and text variant styles
        {
            variant: "text",
            active: true,
            className: "border-b-2 font-regular border-primary-500 text-primary-500 dark:text-primary-400"
        },
        {
            variant: "filled",
            color: "primary",
            active: true,
            className: "border-primary-200 dark:text-white font-regular !bg-primary-700 text-white"
        },
        {
            variant: "filled",
            color: "secondary",
            active: true,
            className: "border-gray-200 font-regular !bg-primary-500 text-secondary-50"
        }
    ],
    defaultVariants: {
        size: "md",
        variant: "text",
        color: "secondary",
        active: false
    }
});
export const tabsContentVariants = cva("dark:text-white");
//# sourceMappingURL=tabsVariants.js.map