/** ============================================================
    COMPONENT: Global Breadcrumbs
    ============================================================ */

/* Section wrapper */
.breadcrumb-section {
    background: var(--surface-subtle, #f8f9fa);
    padding: 12px 0;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--border-default, #e9ecef);
}

/* Core list */
.breadcrumb-section .breadcrumb,
.breadcrumb {
    margin-bottom: 0;
    background: none;
    padding: 0;
    display: flex;
    align-items: center;
    list-style: none;
    flex-wrap: wrap;
}

/* Individual item */
.breadcrumb-section .breadcrumb-item,
.breadcrumb-item {
    display: flex;
    align-items: center;
    font-size: 14px;
}

/* Separator */
.breadcrumb-section .breadcrumb-item + .breadcrumb-item::before,
.breadcrumb-item + .breadcrumb-item::before {
    content: ">";
    font-size: 11px;
    color: var(--ink-400, #adb5bd);
    padding: 0 10px;
    line-height: 1;
}

/* Links */
.breadcrumb-section .breadcrumb-item a,
.breadcrumb-item a {
    color: var(--ink-700, #495057);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease-out;
}

.breadcrumb-section .breadcrumb-item a:hover,
.breadcrumb-item a:hover {
    color: var(--clr-primary, #0d6efd);
}

/* Active / current page */
.breadcrumb-section .breadcrumb-item.active,
.breadcrumb-item.active {
    color: var(--clr-primary, #0d6efd) !important;
    font-weight: 600;
}

/* Home icon spacing */
.breadcrumb-section .breadcrumb-item a i,
.breadcrumb-item a i {
    margin-right: 4px;
}
