import styled, { css } from "styled-components";
import { BoxSizingStyle } from "../../BoxSizingStyle";
import { ButtonGroup } from "../../ButtonGroup";
import { FontStyle } from "../../FontStyle";
import { IconButton } from "../../IconButton";
import { Menu } from "../../Menu";
export const StyledButton = styled.button.withConfig({
  displayName: "Styles__StyledButton",
  componentId: "sc-1v8h7mt-0"
})(["", " ", " ", " color:var(--color-theme-700);margin:0;padding:0;background:none;width:100%;height:auto;border:none;height:30px;line-height:1;transition:all 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}&:disabled{cursor:default;opacity:50%;pointer-events:none;}"], FontStyle, BoxSizingStyle, {
  "position": "relative",
  "margin": "0px",
  "display": "inline-block",
  "cursor": "pointer",
  "userSelect": "none",
  "textAlign": "center",
  "verticalAlign": "middle",
  "fontSize": "0.875rem",
  "lineHeight": "1",
  "fontWeight": "500",
  "textDecorationLine": "none",
  "WebkitFontSmoothing": "antialiased",
  "MozOsxFontSmoothing": "grayscale"
});
export const StyledMenu = styled(Menu).withConfig({
  displayName: "Styles__StyledMenu",
  componentId: "sc-1v8h7mt-1"
})(["", ""], {
  "height": "auto",
  "width": "auto",
  "paddingLeft": "0.5rem",
  "paddingRight": "0.5rem",
  "paddingTop": "1rem",
  "paddingBottom": "1rem"
});
export const StyledButtonGroup = styled(ButtonGroup).withConfig({
  displayName: "Styles__StyledButtonGroup",
  componentId: "sc-1v8h7mt-2"
})(["", " ", " button:hover{position:relative;z-index:1;}"], FontStyle, BoxSizingStyle);
export const StyledSpan = styled.span.withConfig({
  displayName: "Styles__StyledSpan",
  componentId: "sc-1v8h7mt-3"
})(["line-height:30px;color:var(--color-theme-700);"]);
export const StyledDiv = styled.div.withConfig({
  displayName: "Styles__StyledDiv",
  componentId: "sc-1v8h7mt-4"
})(["", " ", " ", " ", " height:32px;transition:all 0.3s ease;background-color:transparent;", " color:var(--color-theme-700);margin-right:-1px;display:block;", " svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:disabled{cursor:default;opacity:50%;pointer-events:none;}&:hover{", " color:var(--color-primary);text-decoration:none;}&:active{", " color:var(--color-primary);}"], props => props.$isTargetable && css(["", ""], {
  "pointerEvents": "none"
}), props => props.$isRounded && css(["border-radius:var(--ac-br-rounded);"]), props => props.$mode !== "flat" ? {
  "borderWidth": "1px",
  "borderStyle": "solid"
} : {
  "borderWidth": "0px"
}, {
  "position": "relative",
  "margin": "0px",
  "display": "inline-block",
  "cursor": "pointer",
  "userSelect": "none",
  "padding": "0px",
  "textAlign": "center",
  "verticalAlign": "middle",
  "fontSize": "0.875rem",
  "lineHeight": "1",
  "fontWeight": "500",
  "textDecorationLine": "none",
  "WebkitFontSmoothing": "antialiased",
  "MozOsxFontSmoothing": "grayscale"
}, props => props.$mode !== "flat" && css(["border:1px solid var(--color-theme-700);"]), props => !props.$alwaysShowDate && css(["@media (max-width:768px){display:none;}"]), props => props.$mode !== "flat" && css(["border-color:var(--color-primary);"]), props => props.$mode !== "flat" && css(["border-color:var(--color-primary);background-color:var(--color-primary-200);"]));
export const StyledControl = styled(IconButton).withConfig({
  displayName: "Styles__StyledControl",
  componentId: "sc-1v8h7mt-5"
})(["border-radius:var(--ac-br-8);"]);
StyledButtonGroup.displayName = "StyledButtonGroup";
StyledSpan.displayName = "StyledSpan";
StyledDiv.displayName = "StyledDiv";
StyledMenu.displayName = "StyledMenu";
StyledButton.displayName = "StyledButton";
StyledControl.displayName = "StyledControl";
//# sourceMappingURL=Styles.js.map