import { Button } from '../Button';
import { styled } from '../styled';
import { Typography } from '../Typography';
export const TogglerButton = styled(Button) `
  justify-content: flex-start;

  width: 100%;
  height: 100%;
  padding-left: ${({ theme }) => theme.spacing(6)};

  border-radius: unset;

  :hover {
    color: ${({ theme }) => theme.palette.primary.main};

    background-color: unset;
  }

  :active {
    background-color: unset;
  }

  &:focus-visible {
    border-radius: ${({ theme }) => theme.shape.medium};
  }
`;
export const Content = styled(Typography) `
  margin-left: ${({ theme }) => theme.spacing(1)};

  white-space: nowrap;
`;
