import { css } from "@emotion/react";
import styled from "@emotion/styled";
import { addFocus } from "../../../../../mixins";
import { classes, tokens } from "../../../tokens";
export var base = /*#__PURE__*/ css("display:flex;gap:0.125rem;align-items:center;position:relative;", "base");
export var StyledContent = /*#__PURE__*/ styled("div", {
    target: "ezpnuqu0",
    label: "StyledContent"
})("display:inline-flex;flex-direction:row;align-items:center;");
export var StyledContentWrapper = /*#__PURE__*/ styled("div", {
    target: "ezpnuqu1",
    label: "StyledContentWrapper"
})("box-sizing:content-box;position:relative;height:100%;width:100%;display:flex;align-items:center;z-index:1;&.", classes.tabsClipScroll, "{overflow:scroll;scrollbar-width:none;::-webkit-scrollbar{display:none;}}&.", classes.tabsClipShowAll, "{overflow:visible;}");
export var StyledArrow = /*#__PURE__*/ styled("button", {
    target: "ezpnuqu2",
    label: "StyledArrow"
})("display:flex;cursor:pointer;border:none;background-color:transparent;padding:0;outline:none;", addFocus({
    outlineSize: '0.063rem',
    outlineOffset: '-0.125rem',
    outlineColor: "var(".concat(tokens.outlineFocusColor, ")"),
    outlineRadius: 'calc(var(--plasma_private-outline-radius) - 0.063rem)'
}), ";&[disabled]{cursor:not-allowed;}--plasma_private-outer-padding:", function(param) {
    var isFilled = param.isFilled;
    return isFilled ? "var(".concat(tokens.arrowOuterPadding, ")") : '';
}, ";padding-right:", function(param) {
    var isLeftArrow = param.isLeftArrow;
    return isLeftArrow ? "var(".concat(tokens.arrowInnerPadding, ")") : 'var(--plasma_private-outer-padding)';
}, ";padding-left:", function(param) {
    var isLeftArrow = param.isLeftArrow;
    return isLeftArrow ? 'var(--plasma_private-outer-padding)' : "var(".concat(tokens.arrowInnerPadding, ")");
}, ";color:var(", tokens.arrowColor, ");&:hover{color:var(", tokens.arrowColorHover, ");}&:active{color:var(", tokens.arrowColorActive, ");}");
