@use 'mixins/mixins.scss' as *;
@use 'common/var.scss' as *;

@include b(tabs) {
    .el-tabs__header {
        height: 32px;
        line-height: 32px;

        .el-tabs__nav {
            border: 0;
        }
    }

    .el-tabs__nav-wrap {
        margin-bottom: -2px;
    }

    .el-tabs__item {
        line-height: 32px;
        height: 32px;
        font-weight: 500;
        color: #999;
        border-radius: 2px 2px 0 0;
        margin-right: 4px;
        border: 1px solid transparent !important;
        margin-top: 0 !important;


        &:not(.is-active) {
            background: #f2f2f2;
        }

        &.is-active {
            color: #367ef5;
            border-color: #e4e7ed !important;
            border-bottom-color: #fff !important;
            margin-bottom: 1px;
            ;

            // margin-top: 0;
            &:before {
                content: "";
                background: #367ef5;
                display: inline-block;
                border-radius: 0 4px 4px 0;
                width: 4px;
                height: 14px;
                margin-right: 10px;
                vertical-align: middle;
                line-height: normal;
                text-align: left;
            }
        }
    }

}