/* Visible path of a project page (views/real-estate/partials/project-breadcrumbs.blade.php).
   A slim bar under the site header; after a standalone template it closes the page instead.
   Self-contained so it also renders in the standalone shell, which loads no theme styles. */
.hz-project-breadcrumbs {
    border-bottom: 1px solid #e4e4e4;
    background: #fff;
    color: #5c6368;
}

.hz-project-breadcrumbs--end {
    border-top: 1px solid #e4e4e4;
    border-bottom: 0;
}

.hz-project-breadcrumbs__nav {
    width: min(1320px, 100% - 32px);
    margin-inline: auto;
    padding: 10px 0;
}

.hz-project-breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 0;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
    line-height: 18px;
}

.hz-project-breadcrumbs__item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.hz-project-breadcrumbs__item + .hz-project-breadcrumbs__item::before {
    content: "/";
    margin-inline: 8px;
    color: #a3a9ad;
}

.hz-project-breadcrumbs__item a {
    color: inherit;
    text-decoration: none;
    transition: color 160ms ease;
}

.hz-project-breadcrumbs__item a:hover,
.hz-project-breadcrumbs__item a:focus-visible {
    color: var(--primary-color, #db1d23);
}

.hz-project-breadcrumbs__item [aria-current="page"] {
    color: #161e2d;
    font-weight: 600;
}

@media (max-width: 767px) {
    .hz-project-breadcrumbs__nav {
        padding: 8px 0;
    }

    /* One line on phones, whatever font is painted: a long path used to wrap once the web font replaced
       the fallback and push the whole page down. The current page (already the page heading) is
       shortened with an ellipsis instead. */
    .hz-project-breadcrumbs__list {
        flex-wrap: nowrap;
        overflow: hidden;
        font-size: 12px;
        line-height: 16px;
    }

    .hz-project-breadcrumbs__item {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .hz-project-breadcrumbs__item:last-child {
        flex: 0 1 auto;
    }

    .hz-project-breadcrumbs__item [aria-current="page"] {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
