.breadcrumb {
    .breadcrumb-item {
        &:not(.active) {
            @extend .gradient-text;
        }

        &:first-child {
            @extend .gradient-text;
        }

        &:not(:first-child) {
            &::before {
                font-family: 'bootstrap-icons';
                content: '\F285';
            }
        }

        &.active {
            @extend .text-secondary;
            @extend .opacity-75;
        }

        a {
            @extend .text-decoration-none;
        }
    }
}