import styled from "styled-components";
import { List } from "../list";
import TextBase from "../../../text";
import { currentTheme } from "../../../../theme";
export const Heading = styled(TextBase.F1) `
  display: flex;
  align-items: center;
  cursor: pointer;
  min-height: 22px;
`;
export const Indicator = styled.div `
  transition: 0.2s ease 0s;
  margin: 0 0 0 5px;
`;
export const Wrapper = styled.div.attrs((props) => ({
    as: props.as,
})) `
  position: relative;
  margin: 0px 16px 0px 0px;

  :last-of-type {
    margin: 0;
  }

  :hover {
    & > ${List} {
      visibility: visible;
      border-top: 2px solid ${currentTheme.colors.primary};
      max-height: 500px;
    }
    ${Indicator} {
      transform: rotate(180deg);
    }
  }
`;
//# sourceMappingURL=styled.js.map