/**
 * Recipe configuration for the Steps component.
 * Defines the styling variants and base styles using Chakra UI's recipe system.
 *
 * Slots:
 * - root: Container for the entire steps component
 * - list: Flex container for step items and separators
 * - item: Individual step container
 * - trigger: Clickable button within each step for direct navigation
 * - indicator: Circular step number or icon within trigger
 * - number: Step number display within indicator
 * - title: Step title text within trigger
 * - description: Optional hint text within trigger
 * - separator: Connecting line between steps
 * - content: Auto-visibility content container for step content
 * - completedContent: Content displayed when all steps are complete
 * - prevTrigger: Navigation button to go to previous step
 * - nextTrigger: Navigation button to go to next step
 */
export declare const stepsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"number" | "root" | "trigger" | "content" | "title" | "list" | "separator" | "description" | "item" | "indicator" | "completedContent" | "prevTrigger" | "nextTrigger", {
    size: {
        xs: {
            root: {
                "--indicator-size": "sizes.600";
            };
            item: {
                gap: "200";
            };
            trigger: {
                gap: "200";
            };
            indicator: {
                width: "var(--indicator-size)";
                height: "var(--indicator-size)";
                fontSize: "300";
                lineHeight: "350";
            };
            number: {
                fontSize: "300";
                lineHeight: "350";
            };
            title: {
                fontSize: "350";
                lineHeight: "550";
                fontWeight: "bold";
            };
            description: {
                fontSize: "300";
                lineHeight: "450";
            };
        };
        sm: {
            root: {
                "--indicator-size": "sizes.800";
            };
            item: {
                gap: "300";
            };
            trigger: {
                gap: "300";
            };
            indicator: {
                width: "var(--indicator-size)";
                height: "var(--indicator-size)";
                fontSize: "350";
                lineHeight: "400";
            };
            number: {
                fontSize: "350";
                lineHeight: "400";
            };
            title: {
                fontSize: "400";
                lineHeight: "500";
                fontWeight: "semibold";
            };
            description: {
                fontSize: "350";
                lineHeight: "500";
            };
        };
        md: {
            root: {
                "--indicator-size": "sizes.1000";
            };
            item: {
                gap: "400";
            };
            trigger: {
                gap: "400";
            };
            indicator: {
                width: "var(--indicator-size)";
                height: "var(--indicator-size)";
                fontSize: "400";
                lineHeight: "500";
            };
            number: {
                fontSize: "400";
                lineHeight: "500";
            };
            title: {
                fontSize: "450";
                lineHeight: "600";
                fontWeight: "semibold";
            };
            description: {
                fontSize: "350";
                lineHeight: "500";
            };
        };
    };
    orientation: {
        horizontal: {
            list: {
                flexDirection: "row";
                gap: "300";
            };
            item: {
                flex: "1";
            };
            separator: {
                height: "var(--separator-width)";
                flex: "1";
                minWidth: "1000";
            };
        };
        vertical: {
            list: {
                flexDirection: "column";
                alignItems: "flex-start";
                gap: "0";
            };
            item: {
                flexDirection: "column";
                alignItems: "flex-start";
                gap: "0";
            };
            separator: {
                width: "var(--separator-width)";
                minHeight: "1000";
                marginLeft: "calc(var(--indicator-size) / 2 - var(--separator-width) / 2)";
                marginTop: "100";
                marginBottom: "100";
            };
        };
    };
}>;