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