/* ==========================================================================
   NACS Show 2026 - Breadcrumb
   ========================================================================== */

.ns-breadcrumb-wrapper {
    width: 100%;
    background-color: var(--nacs-color-white);
    border-bottom: 1px solid rgba(0, 32, 91, 0.08);
}

.ns-breadcrumb-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 14px 24px;
    box-sizing: border-box;
}

.ns-breadcrumb-nav {
    width: 100%;
}

.ns-breadcrumb-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 4px;
    column-gap: 0;
    font-family: var(--nacs-font-work-sans), 'Work Sans', sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: var(--nacs-color-grey-mid);
}

.ns-breadcrumb-item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    max-width: 100%;
}

.ns-breadcrumb-link {
    color: var(--nacs-color-grey-dark);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.15s ease-in-out;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 260px;
    vertical-align: middle;
}

.ns-breadcrumb-link:hover,
.ns-breadcrumb-link:focus {
    color: var(--nacs-color-blue);
    text-decoration: underline;
    outline: none;
}

.ns-breadcrumb-current {
    color: var(--nacs-color-navy);
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 360px;
    display: inline-block;
    vertical-align: middle;
}

.ns-breadcrumb-separator {
    display: inline-flex;
    align-items: center;
    margin: 0 10px;
    color: var(--nacs-color-grey);
    font-size: 12px;
    user-select: none;
}

.ns-breadcrumb-separator svg {
    display: block;
    width: 6px;
    height: 10px;
}

/* Tablet */
@media (max-width: 991.98px) {
    .ns-breadcrumb-container {
        padding: 12px 20px;
    }

    .ns-breadcrumb-list {
        font-size: 13px;
    }

    .ns-breadcrumb-link {
        max-width: 200px;
    }

    .ns-breadcrumb-current {
        max-width: 280px;
    }
}

/* Mobile */
@media (max-width: 767.98px) {
    .ns-breadcrumb-container {
        padding: 10px 16px;
    }

    .ns-breadcrumb-list {
        font-size: 12.5px;
        line-height: 1.3;
        row-gap: 4px;
    }

    .ns-breadcrumb-separator {
        margin: 0 6px;
    }

    .ns-breadcrumb-link {
        max-width: 55vw;
    }

    /* Current page wraps to keep the user oriented */
    .ns-breadcrumb-current {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        max-width: 100%;
        word-break: break-word;
    }
}

/* Extra-small screens */
@media (max-width: 374.98px) {
    .ns-breadcrumb-container {
        padding: 8px 12px;
    }

    .ns-breadcrumb-list {
        font-size: 12px;
    }

    .ns-breadcrumb-link {
        max-width: 50vw;
    }
}