import styled from "styled-components";
import { CollapseExpandSingleIcon } from "../Icons";
import { Body2 } from "../Typography";
export const StyledChildrenWrapper = styled.div.withConfig({
  displayName: "Styles__StyledChildrenWrapper",
  componentId: "sc-13n85xv-0"
})(["", ""], {
  "flexShrink": "0"
});
StyledChildrenWrapper.displayName = "StyledChildrenWrapper";
export const StyledWrapper = styled.div.withConfig({
  displayName: "Styles__StyledWrapper",
  componentId: "sc-13n85xv-1"
})(["", " justify-content:", ";"], {
  "marginBottom": "1rem",
  "display": "flex",
  "alignItems": "center",
  "gap": "1rem"
}, _ref => {
  let {
    $expanded
  } = _ref;
  return $expanded ? "space-between" : "flex-start";
});
StyledWrapper.displayName = "StyledWrapper";
export const StyledTitle = styled(Body2).withConfig({
  displayName: "Styles__StyledTitle",
  componentId: "sc-13n85xv-2"
})(["", " cursor:", ";"], {
  "overflow": "hidden",
  "textOverflow": "ellipsis",
  "whiteSpace": "nowrap"
}, _ref2 => {
  let {
    $readOnly
  } = _ref2;
  return $readOnly ? "default" : "pointer";
});
StyledTitle.displayName = "StyledTitle";
export const StyledDividerLine = styled.div.withConfig({
  displayName: "Styles__StyledDividerLine",
  componentId: "sc-13n85xv-3"
})(["", " border-top:1px solid var(--border-primary);"], {
  "flex": "1 1 0%"
});
StyledDividerLine.displayName = "StyledDividerLine";
export const StyledCollapseExpandSingleIcon = styled(CollapseExpandSingleIcon).withConfig({
  displayName: "Styles__StyledCollapseExpandSingleIcon",
  componentId: "sc-13n85xv-4"
})(["", " transform:", ";transition:all 0.2s ease;"], {
  "marginRight": "0.25rem",
  "cursor": "pointer"
}, _ref3 => {
  let {
    $expanded
  } = _ref3;
  return $expanded ? "rotate(0deg)" : "rotate(180deg)";
});
StyledCollapseExpandSingleIcon.displayName = "StyledCollapseExpandSingleIcon";
//# sourceMappingURL=Styles.js.map