"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PaginationWrapper = exports.RangeWrapper = exports.Range = void 0;
const FormControl_1 = require("@mui/material/FormControl");
const styled_1 = require("../styled");
const Typography_1 = require("../Typography");
const constants_1 = require("./constants");
exports.Range = (0, styled_1.styled)(Typography_1.Typography) `
  color: ${({ theme }) => theme.palette.grey['700']};
`;
exports.RangeWrapper = styled_1.styled.div `
  display: flex;
  gap: ${({ theme }) => theme.spacing(3)};
  align-items: center;

  .${FormControl_1.formControlClasses.root} {
    flex-direction: unset;
  }

  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: none;
  }
`;
exports.PaginationWrapper = styled_1.styled.div `
  display: flex;
  justify-content: flex-end;

  margin: 0 ${({ theme }) => theme.spacing(2)};
  padding-top: ${({ theme }) => theme.spacing(4)};

  &.${constants_1.paginationClassnames.leadingContent} {
    justify-content: space-between;
  }

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

  ${({ theme }) => theme.breakpoints.down('sm')} {
    justify-content: center;

    margin: 0;
    padding: ${({ theme }) => theme.spacing(3, 0, 0)};

    &.${constants_1.paginationClassnames.leadingContent} {
      justify-content: center;
    }
  }
`;
