@use 'common-mixins';

.breadcrumbs-container {
    display: flex;
    align-items: center;

    > *:not(:last-child) {
        margin-right: 6px;
    }

    mat-icon {
        width: 16px;
        min-width: 16px;
    }
}

.breadcrumb {
    text-decoration: none;
    color: var(--iqser-accent);
    font-weight: 600;
    width: fit-content;
    white-space: nowrap;

    &.back {
        display: flex !important;
        justify-content: center;
        align-items: center;

        mat-icon {
            margin-right: 8px;
        }
    }

    &:last-child {
        @include common-mixins.line-clamp(1);
    }

    &.active {
        color: var(--iqser-primary);
    }
}