"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MobileActionWrapper = exports.DesktopActionWrapper = exports.ActionWrapper = exports.StyledMobileButton = exports.StyledButton = void 0;
const Button_1 = require("../../../../components/Button");
const styled_1 = require("../../../../components/styled");
exports.StyledButton = (0, styled_1.styled)(Button_1.Button) `
  flex-grow: 1;
`;
exports.StyledMobileButton = (0, styled_1.styled)(Button_1.Button) `
  display: none;

  width: 100%;

  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: flex;

    height: 50px;
  }
`;
exports.ActionWrapper = (0, styled_1.styled)('div', {
    shouldForwardProp: (prop) => !['$isDisablePadding'].includes(prop),
}) `
  display: flex;
  flex-wrap: wrap;
  gap: ${({ theme }) => theme.spacing(2)};

  padding-top: ${({ theme, $isDisablePadding }) => $isDisablePadding ? 0 : theme.spacing(2)};
`;
exports.DesktopActionWrapper = styled_1.styled.div `
  display: flex;
  gap: ${({ theme }) => theme.spacing(4)}; 

  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: none;
  }
`;
exports.MobileActionWrapper = styled_1.styled.div `
  display: none;

  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: block;
    order: 2;
  }
`;
