import { tokens } from './tokens/index.css';
export declare const layoutBase: {
    flexRow: string;
    flexColumn: string;
    flexCenter: string;
    flexBetween: string;
    grid: string;
    fullWidth: string;
    fullHeight: string;
};
export declare const container: import('@vanilla-extract/recipes').RuntimeFn<{
    size: {
        sm: {
            maxWidth: "640px";
        };
        md: {
            maxWidth: "768px";
        };
        lg: {
            maxWidth: "1024px";
        };
        xl: {
            maxWidth: "1280px";
        };
        full: {
            maxWidth: "none";
        };
    };
    padding: {
        none: {
            paddingLeft: number;
            paddingRight: number;
        };
        sm: {
            paddingLeft: `var(--${string})`;
            paddingRight: `var(--${string})`;
        };
        md: {
            paddingLeft: `var(--${string})`;
            paddingRight: `var(--${string})`;
        };
        lg: {
            paddingLeft: `var(--${string})`;
            paddingRight: `var(--${string})`;
        };
    };
}>;
export declare const spacing: {
    marginTop: (size: keyof typeof tokens.semantic.spacing) => string;
    marginBottom: (size: keyof typeof tokens.semantic.spacing) => string;
    marginLeft: (size: keyof typeof tokens.semantic.spacing) => string;
    marginRight: (size: keyof typeof tokens.semantic.spacing) => string;
    paddingTop: (size: keyof typeof tokens.semantic.spacing) => string;
    paddingBottom: (size: keyof typeof tokens.semantic.spacing) => string;
    paddingLeft: (size: keyof typeof tokens.semantic.spacing) => string;
    paddingRight: (size: keyof typeof tokens.semantic.spacing) => string;
};
export declare const gap: import('@vanilla-extract/recipes').RuntimeFn<{
    size: {
        xs: {
            gap: `var(--${string})`;
        };
        sm: {
            gap: `var(--${string})`;
        };
        md: {
            gap: `var(--${string})`;
        };
        lg: {
            gap: `var(--${string})`;
        };
        xl: {
            gap: `var(--${string})`;
        };
    };
    direction: {
        both: {};
        row: {
            columnGap: "var(--gap-size)";
        };
        column: {
            rowGap: "var(--gap-size)";
        };
    };
}>;
//# sourceMappingURL=layout.css.d.ts.map