import MuiPopper from '@mui/material/Popper';
import { styled } from '../../styled';
import { fadeDropDownTransition } from '../../styled/mixins';
import { datePickerClassnames } from '../constants';
export const StyledPopper = styled(MuiPopper) `
  z-index: ${({ theme }) => theme.zIndex.tooltip};
  
  border-radius: ${({ theme }) => theme.shape.medium};

  .${datePickerClassnames.popoverContainer} {
    display: flex;
    gap: ${({ theme }) => theme.spacing(1)};

    padding: 0;
  }
`;
export const AnimatedWrapper = styled.div `
  ${({ $isOpen }) => fadeDropDownTransition($isOpen)}
`;
export const InnerContainer = styled.div `
  display: flex;

  padding: ${({ theme }) => theme.spacing(4)};

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

    padding: unset;
  }
`;
