/**
 * Truthforge CENTRALIZED NAVIGATION SYSTEM
 * Single Source of Truth for Breadcrumbs & Global Wayfinding.
 */

.tf-breadcrumb-system {
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom: 24px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: #6B7280; /* Muted slate base */
}

.tf-breadcrumb-inner {
    display: flex;
    align-items: center;
    flex-wrap: nowrap; /* Forced single line by default */
    gap: 8px;
}

.tf-breadcrumb-link {
    color: #6B7280;
    text-decoration: none;
    transition: color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.tf-breadcrumb-link:hover {
    color: #fff;
}

.tf-breadcrumb-separator {
    color: #27272a; /* Darker zinc separator */
    font-size: 10px;
    font-weight: 400;
}

.tf-breadcrumb-current {
    color: #7c3aed !important; /* VIBRANT PURPLE ACTIVE STATE */
    white-space: nowrap;
}

/* MOBILE RESPONSIVE HARDENING */
@media (max-width: 768px) {
    .tf-breadcrumb-system {
        justify-content: center; /* Centered for Archive Hero */
        margin-bottom: 32px;
    }

    /* Single Product Override: If breadcrumb is inside the breakout, keep left?
       Actually, the user wants "Eliminate variation".
       I'll center it for archives and keep it naturally aligned for PDP which is centered anyway on mobile.
    */
    
    .tf-product-breadcrumb-top-breakout .tf-breadcrumb-system {
        justify-content: flex-start !important; /* Keep left alignment for PDP consistency */
    }

    /* INTELLIGENT TRUNCATION: Hide middle items if trail is too long */
    /* Home > Shop > Category > Product (4 items) */
    
    .tf-breadcrumb-inner {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 100%;
    }

    /* If we have more than 3 items, hide the 'SHOP' link on mobile to save space */
    .tf-breadcrumb-inner:has(.tf-breadcrumb-separator:nth-child(5)) .tf-breadcrumb-link:nth-child(3),
    .tf-breadcrumb-inner:has(.tf-breadcrumb-separator:nth-child(5)) .tf-breadcrumb-separator:nth-child(4) {
        display: none !important;
    }
}

/* SEARCH CONTEXT: High contrast search labels suppressed to respect purple active state */