/**
 * Header Layout Fix
 */

/* Prevent horizontal overflow */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

.site {
    overflow-x: hidden;
}

.site-header {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
}

/* Mobile - ensure button is visible */
@media (max-width: 968px) {
    .header-container {
        width: 100% !important;
        max-width: 100vw !important;
    }
    
    .menu-toggle {
        position: relative !important;
        transform: none !important;
    }
}

/* Desktop Header - Force Proper Display */
@media (min-width: 969px) {
    .site-header {
        overflow: visible;
    }
    
    .header-container {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        flex-wrap: nowrap !important;
    }
    
    .site-branding {
        flex: 0 0 280px !important;
        width: 280px !important;
    }
    
    .main-navigation {
        flex: 1 !important;
        position: static !important;
        width: auto !important;
        height: auto !important;
        right: auto !important;
        top: auto !important;
        padding: 0 40px !important;
        background-color: var(--color-secondary) !important;
        transform: none !important;
        box-shadow: none !important;
        overflow: visible !important;
    }
    
    .main-navigation ul {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 0 !important;
        opacity: 1 !important;
        transform: none !important;
    }
    
    .main-navigation li {
        opacity: 1 !important;
        transform: none !important;
        border: none !important;
    }
    
    .main-navigation a {
        padding: 28px 24px !important;
    }
    
    .menu-toggle {
        display: none !important;
    }
    
    .mobile-menu-overlay {
        display: none !important;
    }
}