"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SkeletonWrapper = void 0;
const Skeleton_1 = require("@mui/material/Skeleton");
const styled_1 = require("../../../components/styled");
exports.SkeletonWrapper = styled_1.styled.div `
  display: grid;
  grid-template-columns: 240px 1fr 1fr 1fr;
  gap: ${({ theme }) => theme.spacing(2)};

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

  ${({ theme }) => theme.breakpoints.between('sm', 'laptop')} {
    grid-template-columns: 72px 0 0 0;
    gap: 0;

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

  .${Skeleton_1.skeletonClasses.root} {
    height: 32px;
  }

  ${({ theme }) => theme.breakpoints.down('sm')} {
    grid-template-columns: 1fr 40px 0 0;

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

    .${Skeleton_1.skeletonClasses.root} {
      height: 40px;
    }
  }
`;
