import { css } from "@emotion/react";
import styled from "@emotion/styled";
import { classes, tokens } from "../../Combobox.tokens";
import { addFocus, applyEllipsis } from "../../../../../mixins";
export var StyledContentLeft = /*#__PURE__*/ styled("div", {
    target: "eelrjz10",
    label: "StyledContentLeft"
})("display:inline-flex;min-width:var(", tokens.itemContentLeftWidth, ");color:var(", tokens.itemContentLeftColor, ");");
export var StyledContentRight = /*#__PURE__*/ styled("div", {
    target: "eelrjz11",
    label: "StyledContentRight"
})("margin-left:auto;display:inline-flex;min-width:var(", tokens.itemContentRightWidth, ");color:var(", tokens.itemContentRightColor, ");");
export var StyledText = /*#__PURE__*/ styled("div", {
    target: "eelrjz12",
    label: "StyledText"
})(applyEllipsis(), ";");
// INFO: Для возможности переиспользования стилей в других компонентах
export var baseContent = "\n    box-sizing: content-box;\n    display: flex;\n    align-items: center;\n    user-select: none;\n\n    :focus {\n        outline: none;\n    }\n\n    ".concat(addFocus({
    outlineSize: '0.0625rem',
    outlineOffset: '0',
    outlineColor: "var(".concat(tokens.focusColor, ")"),
    outlineRadius: "var(".concat(tokens.itemBorderRadius, ")"),
    hasTransition: false
}), ";\n\n    width: 100%;\n\n    font-family: var(").concat(tokens.itemFontFamily, ");\n    font-size: var(").concat(tokens.itemFontSize, ");\n    font-style: var(").concat(tokens.itemFontStyle, ");\n    font-weight: var(").concat(tokens.itemFontWeightBold, ");\n    letter-spacing: var(").concat(tokens.itemFontLetterSpacing, ");\n    line-height: var(").concat(tokens.itemFontLineHeight, ");\n\n    background: var(").concat(tokens.itemBackground, ");\n    color: var(").concat(tokens.itemColor, ");\n    border-radius: var(").concat(tokens.itemBorderRadius, ");\n\n    width: var(").concat(tokens.itemWidth, ");\n    height: var(").concat(tokens.itemHeight, ");\n\n    padding: var(").concat(tokens.itemPaddingTop, ") var(").concat(tokens.itemPaddingRight, ") var(").concat(tokens.itemPaddingBottom, ")\n        var(").concat(tokens.itemPaddingLeft, ");\n\n    margin: var(").concat(tokens.itemMarginTop, ") var(").concat(tokens.itemMarginRight, ") var(").concat(tokens.itemMarginBottom, ")\n        var(").concat(tokens.itemMarginLeft, ");\n\n    &:hover:not(.").concat(classes.comboboxItemIsDisabled, ") {\n        cursor: pointer;\n        background: var(").concat(tokens.itemBackgroundHover, ");\n    }\n\n    &.").concat(String(classes.comboboxItemIsSelected), " {\n        color: var(").concat(tokens.itemColorSelected, ");\n        background: var(").concat(tokens.itemBackgroundSelected, ");\n\n        &:hover:not(.").concat(classes.comboboxItemIsDisabled, ") {\n            background: var(").concat(tokens.itemBackgroundSelectedHover, ");\n        }\n    }\n\n    &.").concat(classes.comboboxItemIsDisabled, " {\n        opacity: var(").concat(tokens.disabledOpacity, ");\n        cursor: not-allowed;\n    }\n");
export var base = /*#__PURE__*/ css(baseContent, ";", "base");
