/**
 * Default theme for the Segmented component
 */
const segmentedTheme = {
    // Base styles for the segmented container
    baseStyle: "relative flex rounded-[var(--segmented-radius)] bg-[var(--color-background)] border border-[var(--color-border)] p-0",
    // Size variants using CSS variables
    sizes: {
        sm: "min-h-[var(--segmented-min-h-sm)]",
        md: "min-h-[var(--segmented-min-h-md)]",
        lg: "min-h-[var(--segmented-min-h-lg)]",
    },
    // Block style
    blockStyle: "w-full",
    // Disabled style
    disabledStyle: "opacity-50 cursor-not-allowed pointer-events-none",
    // Sliding background style with CSS variables
    slidingBackgroundStyle: "absolute top-[0px] left-[0px] rounded-[calc(var(--segmented-radius)-0.5px)] transition-transform duration-200 ease-out pointer-events-none z-0 bg-[var(--color-background-secondary)] shadow-real-md glass-effect",
};
/**
 * Default theme for the SegmentedItem component
 */
const segmentedItemTheme = {
    // Base styles for the segmented item
    baseStyle: "relative flex min-h-full min-w-fit flex-1 items-center justify-center transition-all duration-200 rounded-[calc(var(--segmented-radius)-1.5px)] font-medium cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary-500)] focus-visible:ring-offset-1",
    // Size variants using CSS variables
    sizes: {
        sm: "text-base px-[var(--segmented-px-sm)]",
        md: "text-base px-[var(--segmented-px-md)]",
        lg: "text-base px-[var(--segmented-px-lg)]",
    },
    // Selected state
    selectedStyle: "text-[var(--color-text-primary)] z-10",
    // Unselected state
    unselectedStyle: "text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] ",
    // Disabled state
    disabledStyle: "opacity-50 cursor-not-allowed pointer-events-none",
};

export { segmentedItemTheme, segmentedTheme };
