@charset "UTF-8";

.ele-segmented {
    --ele-segmented-padding       : 3px;
    --ele-segmented-bg            : var(--el-fill-color-light);
    --ele-segmented-radius        : 2px;
    --ele-segmented-height        : 28px;
    --ele-segmented-font-size     : 14px;
    --ele-segmented-item-padding  : 12px;
    --ele-segmented-color         : var(--el-text-color-secondary);
    --ele-segmented-hover-color   : var(--el-text-color-primary);
    --ele-segmented-hover-bg      : rgba(0, 0, 0, .04);
    --ele-segmented-active-color  : var(--el-text-color-primary);
    --ele-segmented-active-bg     : var(--el-bg-color-overlay);
    --ele-segmented-active-shadow : 0 1px 3px 0 rgba(0, 0, 0, .08);
    --ele-segmented-disabled-color: var(--el-text-color-placeholder)
}

.ele-segmented.is-large {
    --ele-segmented-large-padding     : 4px;
    --ele-segmented-large-radius      : 4px;
    --ele-segmented-large-height      : 36px;
    --ele-segmented-large-font-size   : 16px;
    --ele-segmented-large-item-padding: 16px
}

.ele-segmented.is-small {
    --ele-segmented-small-padding     : 2px;
    --ele-segmented-small-radius      : 2px;
    --ele-segmented-small-height      : 20px;
    --ele-segmented-small-font-size   : 13px;
    --ele-segmented-small-item-padding: 7px
}

.ele-segmented.el-tabs .el-tabs__nav-wrap,
.ele-segmented.el-tabs .el-tabs__nav-scroll {
    margin  : 0;
    overflow: visible
}

.ele-segmented.el-tabs .el-tabs__nav {
    float: none
}

.ele-segmented.el-tabs .el-tabs__nav-wrap:after,
.ele-segmented.el-tabs .el-tabs__content {
    display: none
}

.ele-segmented.el-tabs .el-tabs__header {
    margin       : 0;
    box-sizing   : border-box;
    background   : var(--ele-segmented-bg);
    border-radius: var(--ele-segmented-radius);
    padding      : var(--ele-segmented-padding)
}

.ele-segmented.el-tabs .el-tabs__item {
    color        : var(--ele-segmented-color);
    height       : var(--ele-segmented-height);
    line-height  : var(--ele-segmented-height);
    font-size    : var(--ele-segmented-font-size);
    border-radius: var(--ele-segmented-radius);
    transition   : color .2s, background-color .2s;
    background   : none;
    z-index      : 2
}

.ele-segmented.el-tabs .el-tabs__item:not(.is-disabled):hover {
    color     : var(--ele-segmented-hover-color);
    background: var(--ele-segmented-hover-bg)
}

.ele-segmented.el-tabs .el-tabs__item:not(.is-disabled).is-active {
    color     : var(--ele-segmented-active-color);
    background: none
}

.ele-segmented.el-tabs .el-tabs__item.is-disabled {
    color: var(--ele-segmented-disabled-color)
}

.ele-segmented.el-tabs .el-tabs__item .ele-segmented-item-icon+.ele-segmented-item-label {
    margin-left: 6px
}

.ele-segmented.el-tabs .el-tabs__header .el-tabs__nav .el-tabs__item {
    padding: 0 var(--ele-segmented-item-padding)
}

.ele-segmented.el-tabs .el-tabs__active-bar {
    padding      : 0 var(--ele-segmented-item-padding);
    margin-left  : calc(0px - var(--ele-segmented-item-padding));
    background   : var(--ele-segmented-active-bg);
    border-radius: var(--ele-segmented-radius);
    box-shadow   : var(--ele-segmented-active-shadow);
    transform    : translate(var(--ele-segmented-item-padding));
    box-sizing   : content-box;
    height       : auto;
    bottom       : 0;
    top          : 0
}

.ele-segmented.el-tabs:not(.is-block) .el-tabs__header {
    display: inline-block
}

.ele-segmented.el-tabs.is-large .el-tabs__header {
    border-radius: var(--ele-segmented-large-radius);
    padding      : var(--ele-segmented-large-padding)
}

.ele-segmented.el-tabs.is-large .el-tabs__item {
    height       : var(--ele-segmented-large-height);
    line-height  : var(--ele-segmented-large-height);
    font-size    : var(--ele-segmented-large-font-size);
    border-radius: var(--ele-segmented-large-radius)
}

.ele-segmented.el-tabs.is-large .el-tabs__header .el-tabs__nav .el-tabs__item {
    padding: 0 var(--ele-segmented-large-item-padding)
}

.ele-segmented.el-tabs.is-large .el-tabs__active-bar {
    padding      : 0 var(--ele-segmented-large-item-padding);
    margin-left  : calc(0px - var(--ele-segmented-large-item-padding));
    border-radius: var(--ele-segmented-large-radius);
    transform    : translate(var(--ele-segmented-large-item-padding))
}

.ele-segmented.el-tabs.is-small .el-tabs__header {
    border-radius: var(--ele-segmented-small-radius);
    padding      : var(--ele-segmented-small-padding)
}

.ele-segmented.el-tabs.is-small .el-tabs__item {
    height       : var(--ele-segmented-small-height);
    line-height  : var(--ele-segmented-small-height);
    font-size    : var(--ele-segmented-small-font-size);
    border-radius: var(--ele-segmented-small-radius)
}

.ele-segmented.el-tabs.is-small .el-tabs__header .el-tabs__nav .el-tabs__item {
    padding: 0 var(--ele-segmented-small-item-padding)
}

.ele-segmented.el-tabs.is-small .el-tabs__active-bar {
    padding      : 0 var(--ele-segmented-small-item-padding);
    margin-left  : calc(0px - var(--ele-segmented-small-item-padding));
    border-radius: var(--ele-segmented-small-radius);
    transform    : translate(var(--ele-segmented-small-item-padding))
}