/* CSS Breadcrumbs - Versione Finale */

#breadcrumb-nav {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 10 !important;
    position: absolute !important;
    width: auto !important;
    background: transparent !important;
    backdrop-filter: none !important;
    top: 80px !important;
    left: 20px !important;
    border: none !important;
    box-shadow: none !important;
}

/* Force override all Bootstrap breadcrumb styles */
#breadcrumb-nav .breadcrumb,
#breadcrumb-nav .breadcrumb-item,
#breadcrumb-nav ol,
#breadcrumb-nav li {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* Override py-5 padding */
.py-5 {
    /* padding-top: 3rem !important; */
    padding-bottom: 3rem !important;
}

.breadcrumb-container {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 !important;
    z-index: 10 !important;
    position: relative !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Nuclear option - override any possible Bootstrap class */
nav[aria-label="breadcrumb"],
.breadcrumb,
.breadcrumb-item,
ol.breadcrumb,
li.breadcrumb-item {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    list-style: none !important;
}

/* Specific override for any container elements */
#breadcrumb-nav *,
#breadcrumb-nav *::before,
#breadcrumb-nav *::after {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Force white color for all breadcrumb links - override Bootstrap */
#breadcrumb-nav a,
#breadcrumb-nav a:link,
#breadcrumb-nav a:visited,
#breadcrumb-nav a:hover,
#breadcrumb-nav a:active,
#breadcrumb-nav a:focus {
    color: #ffffff !important;
    text-decoration: none !important;
}

.breadcrumb-list {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 2px !important;
}

.breadcrumb-item {
    display: flex !important;
    align-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 !important;
}

.breadcrumb-link {
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    padding: 2px 4px !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    border-radius: 2px !important;
    transition: all 0.2s ease !important;
    text-shadow: none !important;
    background: none !important;
}

/* Force white color for all link states */
.breadcrumb-link:link,
.breadcrumb-link:visited,
.breadcrumb-link:active,
.breadcrumb-link:focus {
    color: #ffffff !important;
}

.breadcrumb-link:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
    text-shadow: none !important;
}

.breadcrumb-current {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 2px 4px !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-shadow: none !important;
    background: none !important;
    border-radius: 2px !important;
}

.breadcrumb-separator {
    display: flex !important;
    align-items: center !important;
    margin: 0 2px !important;
    visibility: visible !important;
    opacity: 0.8 !important;
    color: #ffffff !important;
    text-shadow: none !important;
}

.breadcrumb-separator-icon {
    width: 12px !important;
    height: 12px !important;
    color: #ffffff !important;
    display: block !important;
    visibility: visible !important;
    opacity: 0.8 !important;
    filter: none !important;
}

.breadcrumb-home-icon {
    width: 14px !important;
    height: 14px !important;
    color: #ffffff !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-right: 2px !important;
    filter: none !important;
}

/* Main background and headings - Site-wide */
main,
.main {
    background-color: rgb(var(--bs-dark-rgb)) !important;
    background: rgb(var(--bs-dark-rgb)) !important;
}

main h1,
.main h1,
h1 {
    color: #ffffff !important;
}

/* Responsive */
@media (max-width: 768px) {
    #breadcrumb-nav {
        top: 70px !important;
        left: 15px !important;
    }
    
    .breadcrumb-link,
    .breadcrumb-current {
        font-size: 12px !important;
        padding: 1px 3px !important;
    }
    
    .breadcrumb-separator {
        margin: 0 1px !important;
    }
    
    .breadcrumb-separator-icon,
    .breadcrumb-home-icon {
        width: 10px !important;
        height: 10px !important;
    }
}
