// Wrapper
// List
//Item

.gds-breadcrumb {
    width: 100%;

    &__list {
        display: flex;
        flex-flow: row wrap;
        font-size: 0.8rem;
        line-height: 1.2;
        padding: 0.5rem 0.5rem 0.5rem 0;
    }
    &__item {
        display: inline-block;
        width: fit-content;
        margin-right: 1rem;
        position: relative;
        color: $grayLight5Color;
        // background: pink;
    }

    &__item::after {
        position: absolute;
        content: '/';
        top: -2px;
        right: -0.6rem;
    }
    &__item:last-child::after {
        content: none;
    }
    &__link {
        display: inline-block;
        font-size: 0.8rem;
        line-height: 1.2;
        color: $grayLight5Color;
        width: 100%;
        max-width: 6rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        outline: none;
        text-transform: capitalize;
    }
    &__link:hover,
    &__link:focus {
        color: $primaryDark2Color;
    }
    &__link:active {
        color: $primaryDark5Color;
    }
}