/* Mobile Menu Fix CSS */
.hamburger-icon {
    width: 25px;
    height: 20px;
    position: relative;
    margin: 0;
    background-color: transparent !important;
}

.hamburger-icon span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: white;
    border-radius: 3px;
    opacity: 1;
    left: 0;
}

.hamburger-icon span:nth-child(1) {
    top: 0;
}

.hamburger-icon span:nth-child(2) {
    top: 8px;
}

.hamburger-icon span:nth-child(3) {
    top: 16px;
}

/* Mobile menu styles */
.mobile-menu {
    display: block !important;
    visibility: visible !important;
    background-color: #0056b3 !important;
}

.mobile-nav-logo {
    height: 50px;
    width: auto;
    display: inline-block !important;
    visibility: visible !important;
    filter: brightness(0) invert(1);
    margin-left: 10px;
}

.mobile-menu-header-logo {
    height: 60px;
    display: inline-block !important;
    visibility: visible !important;
    filter: brightness(0) invert(1);
}

.mobile-logo {
    height: 80px;
    display: block !important;
    visibility: visible !important;
    margin: 0 auto;
    filter: brightness(0) invert(1);
}

/* Hide menu toggle button by default */
.navbar-toggler, #mobileMenuToggle {
    display: none !important;
}

.mobile-menu-header {
    background-color: #0056b3 !important;
}

/* Desktop and mobile specific styles */
@media (min-width: 992px) {
    /* Hide mobile elements in desktop view */
    .d-lg-none {
        display: none !important;
    }
    
    /* Show desktop menu */
    .collapse.navbar-collapse {
        display: flex !important;
    }
    
    /* Restore original navbar background */
    .navbar.bg-dark {
        background-color: #ffffff !important;
    }
}

/* Adjust navbar layout for mobile */
@media (max-width: 991px) {
    /* Show menu toggle button only on mobile */
    .navbar-toggler, #mobileMenuToggle {
        display: block !important;
        margin-left: auto;
        margin-right: 8px;
        padding: 10px;
        z-index: 1050;
    }
    
    /* Hide desktop menu in mobile view */
    .collapse.navbar-collapse {
        display: none !important;
    }
    
    .navbar {
        background-color: #0056b3 !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    
    .d-flex.align-items-center.d-lg-none {
        flex: 1;
        justify-content: flex-start !important;
        display: flex !important;
        visibility: visible !important;
    }
    
    /* Force logo to display */
    .mobile-nav-logo {
        opacity: 1 !important;
    }
    
    /* Container background */
    .container-fluid.bg-dark {
        background-color: #0056b3 !important;
    }
}