/* ===== HEADER RESPONSIVE FIXES - LOGO & HAMBURGER MENU ===== */

/* Small devices (phones, 576px and down) */
@media (max-width: 576px) {
    .header .nav-brand-group a img,
    #header .nav-brand-group a img {
        max-height: 36px !important;
        max-width: 160px !important;
    }
    
    .header .nav-brand-group,
    #header .nav-brand-group {
        max-width: calc(100% - 100px) !important;
        overflow: visible !important;
    }
    
    .header .nav-brand-group > a,
    #header .nav-brand-group > a {
        max-width: 160px !important;
        overflow: visible !important;
    }
    
    .header .toggle-menu,
    #header .toggle-menu {
        min-width: 40px !important;
        width: 40px !important;
        height: 40px !important;
        font-size: 1.5rem !important;
    }
}

/* Extra small devices (phones, 480px and down) - S8, Z Fold etc */
@media (max-width: 480px) {
    .header .nav-brand-group a img,
    #header .nav-brand-group a img {
        max-height: 32px !important;
        max-width: 150px !important;
    }
    
    .header .nav-brand-group,
    #header .nav-brand-group {
        max-width: calc(100% - 90px) !important;
        gap: 0.5rem !important;
        overflow: visible !important;
    }
    
    .header .nav-brand-group > a,
    #header .nav-brand-group > a {
        max-width: 150px !important;
        overflow: visible !important;
    }
    
    .header .toggle-menu,
    #header .toggle-menu {
        min-width: 36px !important;
        width: 36px !important;
        height: 36px !important;
        font-size: 1.25rem !important;
        padding: 0 !important;
    }
    
    .header .nav-actions,
    #header .nav-actions {
        gap: 0.25rem !important;
    }
}

/* Very small devices (phones, 360px and down) */
@media (max-width: 360px) {
    .header .nav-brand-group a img,
    #header .nav-brand-group a img {
        max-height: 28px !important;
        max-width: 130px !important;
    }
    
    .header .nav-brand-group,
    #header .nav-brand-group {
        max-width: calc(100% - 80px) !important;
        overflow: visible !important;
    }
    
    .header .nav-brand-group > a,
    #header .nav-brand-group > a {
        max-width: 130px !important;
        overflow: visible !important;
    }
    
    .header .toggle-menu,
    #header .toggle-menu {
        min-width: 32px !important;
        width: 32px !important;
        height: 32px !important;
        font-size: 1.1rem !important;
    }
}

/* Landscape orientation on small devices */
@media (max-width: 768px) and (orientation: landscape) {
    .header .nav-brand-group a img,
    #header .nav-brand-group a img {
        max-height: 36px !important;
        max-width: 140px !important;
    }
    
    .header .nav-brand-group,
    #header .nav-brand-group {
        max-width: calc(100% - 110px) !important;
    }
}

/* Ensure navbar doesn't wrap on mobile */
@media (max-width: 991px) {
    #navbar-menu {
        flex-wrap: nowrap !important;
        overflow: visible !important; /* Changed from hidden to visible for dropdown menus */
    }
    
    #navbar-menu > .nav-brand-group {
        flex: 0 1 auto !important;
        overflow: visible !important;
    }
    
    #navbar-menu > .nav-actions {
        flex: 0 0 auto !important;
        overflow: visible !important;
        position: relative !important;
    }
    
    /* Language switcher overflow visible */
    #navbar-menu .language-switcher,
    .header .language-switcher,
    #header .language-switcher {
        overflow: visible !important;
        position: relative !important;
    }
}