@import 'theming';

$breadcrumb-chevron-spacer: 2px;

.adf-breadcrumb {
    display: flex;

    &-container {
        margin: 0;
        padding: 0;
        list-style-type: none;
        cursor: default;
        display: flex;
        overflow: hidden;
        height: 25px;
    }

    &-item {
        padding-right: $breadcrumb-chevron-spacer;
        color: $alfresco-secondary-text-color;
        overflow: hidden;
        display: flex;
        line-height: 24px;

        &-anchor {
            color: inherit;
            text-decoration: none;
            display: block;
            width: 100%;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        &-anchor:hover, &.active {
            color: $alfresco-primary-text-color;
        }

        &.active {
            display: block;
        }
    }
}