import { buttonClasses } from '@mui/material/Button';
import { styled } from '../../../styled';
import { tooltipClassnames } from '../../../Tooltip';
export const Wrapper = styled.div `
  display: flex;
  gap: ${({ theme, $spacing }) => theme.spacing($spacing)};

  ${({ theme }) => theme.breakpoints.down('sm')} {
    flex-wrap: wrap;
    gap: ${({ theme }) => theme.spacing(2)};
    order: -1;

    padding-bottom: ${({ theme }) => theme.spacing(2)};

    & > .${tooltipClassnames.contentWrapper}, & > .${buttonClasses.root} {
      flex: 1 1 calc(50% - ${({ theme }) => theme.spacing(1)});
    }
  }
`;
