"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CancelButton = exports.FormFooter = exports.Description = exports.Wrapper = void 0;
const Button_1 = require("../../../components/Button");
const styled_1 = require("../../../components/styled");
const Typography_1 = require("../../../components/Typography");
exports.Wrapper = styled_1.styled.div `
  width: 400px;
  padding: ${({ theme }) => theme.spacing(4)};

  ${({ theme }) => theme.breakpoints.down('sm')} {
    width: auto;
  }
`;
exports.Description = (0, styled_1.styled)(Typography_1.Typography) `
  margin-bottom: ${({ theme }) => theme.spacing(3)};

  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: none;
  }
`;
exports.FormFooter = styled_1.styled.footer `
  display: flex;
  gap: ${({ theme }) => theme.spacing(3)};
  justify-content: end;

  ${({ theme }) => theme.breakpoints.down('sm')} {
    padding-top: ${({ theme }) => theme.spacing(4)};

    & .${Button_1.buttonClasses.root} {
      width: 100%;
      height: 48px;
    }
  }
`;
exports.CancelButton = (0, styled_1.styled)(Button_1.Button) `
  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: none;
  }
`;
