import t from "styled-components";
import { getColorAlias as n, getFontSize as o } from "../../../utils/index.js";
import { Prefix as i, Sufix as r, TextFieldInput as l } from "../textField/styles.js";
const s = t(i)`
  margin-left: 16px;
  padding: 0;
  svg {
    fill: ${n("contentSubdued")};
  }
`, f = t(r)`
  display: flex;
  justify-content: flex-end;
  margin-right: 16px;
  padding: 0;
  align-self: center;
  bottom: 20px;
  right: 0;
  width: 15%;

  svg {
    fill: ${n("contentSubdued")};
    &:hover {
      cursor: ${(e) => e.disabled ? "not-allowed" : "pointer"};
    }
  }
`, c = t(l)`
  width: calc(100% - 16px);
  padding-right: 0;
  border: unset;
`, g = t.div`
  width: 100%;
`, u = t.span``, m = t.span`
  display: flex;
  align-items: center;
  padding: 12px 16px;
  color: ${n("contentDefault")};
  font-weight: ${(e) => e.theme.font.weightRegular};
  font-family: ${(e) => e.theme.font.familyPrimary};
  ${o("size16")};
  background: ${n("containerDefault")};
`;
export {
  f as CloseWrapper,
  s as IconWrapper,
  c as Input,
  g as InputWrapper,
  u as ItemValue,
  m as NoResultsText
};
