/* Fix for header responsiveness when wrapping to multiple lines */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: auto; /* Allow height to adjust based on content */
    min-height: var(--header-height);
    z-index: 1000;
}

/* Improve wrapping behavior of navigation items */
.country-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.nav-section {
    display: flex;
    align-items: center;
    margin: 0.25rem;
}

/* Allow countries section to break naturally */
.nav-section.countries {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: auto;
}

/* Ensure flags stay on the same row when wrapped */
.nav-section.countries a.nav-item {
    flex: 0 0 auto;
    display: inline-flex;
}

/* Fix for icons in small screens */
@media (max-width: 768px) {
    .nav-section.whatisibd .nav-item i,
    .nav-section.global .nav-item i,
    .nav-section.submission .nav-item i {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .nav-item[data-country] .fi {
        display: inline-block !important;
    }
    
    /* Ensure flags stay inline on mobile */
    .nav-section.countries {
        flex-direction: row;
        justify-content: center;
    }
}

/* Adjust body padding dynamically with JavaScript */
body {
    transition: padding-top 0.3s ease;
}