import styled, { css } from "styled-components";
import { CollapseExpandSingleIcon } from "../Icons";
import { Trigger } from "../Trigger";
export const StyledSelectTrigger = styled(Trigger).withConfig({
  displayName: "Styles__StyledSelectTrigger",
  componentId: "sc-9799p2-0"
})(["display:flex;align-items:center;justify-content:space-between;padding:0 4px 0 8px;width:300px;transition:border-color 0.3s ease;background-color:transparent;border:none;", " ", " ", " ", " ", " ", " ", ";", ";"], _ref => {
  let {
    $mode
  } = _ref;
  return $mode === "outlined" && css(["border:1px solid var(--color-theme-500);background-color:var(--input-background-color);"]);
}, _ref2 => {
  let {
    disabled
  } = _ref2;
  return disabled && css(["opacity:50%;cursor:default;"]);
}, _ref3 => {
  let {
    $invalid,
    disabled,
    $mode
  } = _ref3;
  return !$invalid && !disabled && $mode === "outlined" && css(["&:hover,&:focus{border-color:var(--color-primary-700);}"]);
}, _ref4 => {
  let {
    $invalid,
    $mode
  } = _ref4;
  return $invalid && $mode === "outlined" && css(["", " &:hover{", "}"], {
    "borderColor": "var(--red-alert)"
  }, {
    "borderColor": "var(--red-alert)"
  });
}, _ref5 => {
  let {
    $size
  } = _ref5;
  return $size === "small" && css(["height:24px;border-radius:var(--ac-br-6);"]);
}, _ref6 => {
  let {
    $size
  } = _ref6;
  return $size === "regular" && css(["height:32px;border-radius:var(--ac-br-8);"]);
}, _ref7 => {
  let {
    $size
  } = _ref7;
  return $size === "big" && css(["height:40px;border-radius:var(--ac-br-8);"]);
}, _ref8 => {
  let {
    $size
  } = _ref8;
  return $size === "biggest" && css(["height:48px;border-radius:var(--ac-br-8);"]);
});
StyledSelectTrigger.displayName = "StyledSelectTrigger";
export const StyledCaretIcon = styled(CollapseExpandSingleIcon).withConfig({
  displayName: "Styles__StyledCaretIcon",
  componentId: "sc-9799p2-1"
})(["margin-left:8px;flex-shrink:0;transition:transform 200ms ease;", ""], _ref9 => {
  let {
    $open
  } = _ref9;
  return !$open && css(["transform:rotate(180deg);"]);
});
StyledCaretIcon.displayName = "StyledCaretIcon";
//# sourceMappingURL=Styles.js.map