/*
 * Critical Breadcrumb Override CSS
 * This file ensures breadcrumb displays correctly regardless of other CSS
 */

/* Reset all positioning for breadcrumb container - Highest Priority */
.breadcrumb-nav1 {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: none !important;
    min-width: auto !important;
    
    /* Layout properties */
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    
    /* Spacing */
    margin: 0 !important;
    padding: 12px 0 !important;
    
    /* Background and borders */
    background-color: #f8f9fa !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid #e9ecef !important;
    
    /* Typography */
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: #6c757d !important;
    
    /* Box model */
    box-sizing: border-box !important;
    
    /* Flexbox reset */
    flex: none !important;
    align-self: auto !important;
    order: 0 !important;
    
    /* Grid reset */
    grid-area: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
    
    /* Animation reset */
    animation: none !important;
    transition: none !important;
    
    /* Z-index control */
    z-index: 1 !important;
}

/* Reset container inside breadcrumb */
.breadcrumb-nav1 .container {
    position: relative !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Reset breadcrumb list */
.breadcrumb-nav1 .breadcrumb {
    position: static !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    list-style: none !important;
    
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    
    font-size: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
    
    box-sizing: border-box !important;
}

/* Reset breadcrumb items */
.breadcrumb-nav1 .breadcrumb-item {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    
    margin: 0 !important;
    padding: 0 !important;
    
    font-size: inherit !important;
    line-height: inherit !important;
    color: #6c757d !important;
    
    list-style: none !important;
    
    box-sizing: border-box !important;
}

/* Reset breadcrumb separators */
.breadcrumb-nav1 .breadcrumb-item + .breadcrumb-item::before {
    content: "›" !important;
    display: inline-block !important;
    margin: 0 8px !important;
    padding: 0 !important;
    color: #BBA680 !important;
    font-size: 16px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    text-decoration: none !important;
}

/* Reset breadcrumb links */
.breadcrumb-nav1 .breadcrumb-item a {
    color: #6c757d !important;
    text-decoration: none !important;
    padding: 2px 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    transition: color 0.3s ease !important;
    
    /* Link states */
    cursor: pointer !important;
    outline: none !important;
    
    box-sizing: border-box !important;
}

.breadcrumb-nav1 .breadcrumb-item a:hover,
.breadcrumb-nav1 .breadcrumb-item a:focus {
    color: #BBA680 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    outline: 2px solid transparent !important;
    outline-offset: 2px !important;
}

/* Reset active breadcrumb item */
.breadcrumb-nav1 .breadcrumb-item.active {
    color: #BBA680 !important;
    font-weight: 500 !important;
    background: transparent !important;
    border: none !important;
    text-decoration: none !important;
}

/* Reset all child elements to prevent inheritance issues */
.breadcrumb-nav1 * {
    position: static !important;
    float: none !important;
    clear: none !important;
    transform: none !important;
    
    /* Remove any absolute/fixed positioning */
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    
    /* Reset animations */
    animation: none !important;
    transition-delay: 0s !important;
    
    box-sizing: border-box !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .breadcrumb-nav1 {
        padding: 10px 0 !important;
        font-size: 13px !important;
    }
    
    .breadcrumb-nav1 .breadcrumb-item + .breadcrumb-item::before {
        margin: 0 6px !important;
        font-size: 14px !important;
    }
}

@media (max-width: 480px) {
    .breadcrumb-nav1 {
        padding: 8px 0 !important;
        font-size: 12px !important;
    }
    
    .breadcrumb-nav1 .breadcrumb-item + .breadcrumb-item::before {
        margin: 0 4px !important;
        font-size: 12px !important;
    }
    
    .breadcrumb-nav1 .container {
        padding: 0 10px !important;
    }
}

/* Accessibility improvements */
.breadcrumb-nav1[aria-label] {
    outline: none !important;
}

.breadcrumb-nav1 .breadcrumb-item a:focus {
    outline: 2px solid #BBA680 !important;
    outline-offset: 2px !important;
}

/* Print styles */
@media print {
    .breadcrumb-nav1 {
        display: none !important;
    }
}
