import { Button } from '../../../components/Button';
import { styled } from '../../../components/styled';
import { ArrowLOutlineMd } from '../../../icons/ArrowLOutlineMd';
import { ArrowROutlineMd } from '../../../icons/ArrowROutlineMd';
export const PrevButton = styled(Button) `
  margin-right: auto;

  ${({ theme }) => theme.breakpoints.down('sm')} {
    order: 1;

    height: 50px;
    margin-right: unset;
  }
`;
export const StyledPreviousIcon = styled(ArrowLOutlineMd) `
  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: none;
  }
`;
export const StyledNextIcon = styled(ArrowROutlineMd) `
  ${({ theme }) => theme.breakpoints.down('sm')} {
    display: none;
  }
`;
