export declare const buttonStyles: import('@vanilla-extract/recipes').RuntimeFn<{
    type: {
        inline: {
            borderRadius: string;
            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            lineHeight: "20px";
            padding: "7px 12px 6px 12px";
            whiteSpace: "normal";
            wordBreak: "break-word";
            textAlign: "left";
            height: "fit-content";
            ':hover': {
                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            };
            ':active': {
                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            };
        };
        primary: {
            paddingTop: number;
            color: string;
            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            borderRadius: string;
            height: string;
            fontWeight: number;
            display: "block";
            width: "100%";
            ':hover': {
                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            };
            ':active': {
                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
            };
        };
        secondary: {
            paddingTop: number;
            color: string;
            backgroundColor: string;
            borderRadius: string;
            height: string;
            fontWeight: number;
            display: "block";
            width: "100%";
            ':hover': {
                color: string;
                backgroundColor: string;
            };
            ':active': {
                color: string;
                backgroundColor: string;
            };
            selectors: {
                [x: string]: {
                    display: "block";
                    width: "100%";
                };
            };
        };
    };
    large: {
        true: {
            borderRadius: string;
            padding: "11px 16px 9px 16px";
            height: "auto";
            display: "flex";
            alignItems: "center";
            lineHeight: "20px";
            justifyContent: "center";
        };
    };
    round: {
        true: {
            borderRadius: number;
        };
    };
}>;
//# sourceMappingURL=styles.css.d.ts.map