"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.StyledButton = exports.Container = void 0;
const theme_1 = require("../../../theme");
const useRipple_styled_1 = require("../../../utils/useRipple.styled");
const Modal_styled_1 = require("./Modal.styled");
const Container = (0, theme_1.styled)("div", {
    display: "flex",
    marginTop: (0, theme_1.dimensionsPxToRem)(100),
    mx: Modal_styled_1.NEGATIVE_PADDING,
    marginBottom: Modal_styled_1.NEGATIVE_PADDING,
});
exports.Container = Container;
const StyledButton = (0, theme_1.styled)("button", useRipple_styled_1.rippleHostStyles, {
    "border": "none",
    "borderTop": "1px solid $modalButtonBorder",
    "background": "$modalButtonBg",
    "flex": 1,
    "height": (0, theme_1.dimensionsPxToRem)(156),
    "fontWeight": 500,
    "display": "flex",
    "alignItems": "center",
    "justifyContent": "center",
    "&:not(:first-child)": {
        borderLeft: "1px solid $modalButtonBorder",
    },
    "&:first-child": {
        borderBottomLeftRadius: (0, theme_1.dimensionsPxToRem)(12),
    },
    "&:last-child": {
        borderBottomRightRadius: (0, theme_1.dimensionsPxToRem)(12),
    },
    "variants": {
        variant: {
            main: {
                color: "$mainColor",
            },
        },
    },
});
exports.StyledButton = StyledButton;
//# sourceMappingURL=ModalButtons.styled.js.map