@import "mixins/mixins";
@import "mixins/utils";
@import "common/var";
@include b(breadcrumb) {
    font-size: $--font-size-body-3;
    line-height: 22px;
    @include utils-clearfix;
    @include e(separator) {
        margin: 0 4px;
        color: $--color-text-placeholder;
        line-height: 22px;
        font-size: $--font-size-title-1;
        &[class*=icon] {
            margin: 0 4px;
            font-weight: $--font-weight-400;
            
        }
    }
    @include e(item) {
        float: left;
        display: flex;
        @include e(inner) {
            color: $--color-text-regular;
            &.is-link,&.el-breadcrumb__inner,
            & a {
                text-decoration: none;
                transition: $--color-transition-base;
                color: $--color-text-3;
                &:hover {
                    color: $--color-text-1 !important;
                    cursor: pointer;
                }
            }
            i{
                font-size: $--font-size-title-1;
                padding-right: 4px;
            }
            
        }
        // .el-breadcrumb__icon {
        //     padding-right: 5px;
        // }
        .el-breadcrumb__inner {
            display: inline-block;
            max-width: 150px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            font-size: $--font-size-body-3;
            font-weight: $--font-weight-400;
        }
        &:last-child {
            .el-breadcrumb__inner,
            .el-breadcrumb__inner a {
                &,
                &:hover {
                    font-weight: $--font-weight-500;
                    color: $--color-text-1;
                    // cursor: pointer;
                }
            }
            .el-breadcrumb__separator {
                display: none;
            }
        }
    }
}