import styled, { css } from "styled-components";
import { BoxSizingStyle } from "../BoxSizingStyle";
import { FontStyle } from "../FontStyle";
export const StyledChoose = styled.button.withConfig({
  displayName: "Styles__StyledChoose",
  componentId: "sc-1j2qv02-0"
})(["", " ", " ", " ", " height:32px;padding:0 16px;transition:all 0.3s ease;border:1px solid var(--border-primary);font-size:13px;transition-duration:0.3s;&:hover{", " box-shadow:inset 0 0 5px 3px var(--color-primary-300);}", ""], {
  "margin": "0px",
  "display": "inline-block",
  "verticalAlign": "middle",
  "fontWeight": "500",
  "lineHeight": "1",
  "textDecorationLine": "none",
  "WebkitFontSmoothing": "antialiased",
  "MozOsxFontSmoothing": "grayscale"
}, {
  "cursor": "pointer",
  "userSelect": "none",
  "borderRadius": "0.5rem",
  "textAlign": "center",
  "color": "var(--color-theme-700)"
}, FontStyle, BoxSizingStyle, {
  "borderColor": "var(--color-primary)"
}, props => props.active && css(["", " background-color:var(--color-primary-300);"], {
  "zIndex": "0",
  "borderColor": "var(--color-primary)"
}));
StyledChoose.displayName = "StyledChoose";
//# sourceMappingURL=Styles.js.map