/* Force mobile menu to work - OVERRIDE template defaults */

@media (max-width: 991px) {
    /* Hide desktop menu by default on mobile */
    .header-navbar {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        background: #0a0e1a !important;
        padding: 20px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        display: none !important;
        z-index: 1000 !important;
        max-height: 80vh !important;
        overflow-y: auto !important;
    }
    /* Show menu when open class is added */
    .header-navbar.menu-open {
        display: block !important;
    }
    /* Style the menu container */
    .header-menu {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    /* Style the main menu */
    .menu-s2 {
        flex-direction: column !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .menu-s2 .menu-item {
        width: 100% !important;
        margin: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
    .menu-btns {
        flex-direction: column !important;
        width: 100% !important;
        margin: 20px 0 0 0 !important;
        padding: 0 !important;
    }
    .menu-btns li {
        width: 100% !important;
        margin: 5px 0 !important;
    }
    .menu-btns .btn {
        width: 100% !important;
        display: block !important;
        text-align: center !important;
    }
    /* Hamburger menu button */
    .navbar-toggle {
        display: flex !important;
        flex-direction: column !important;
        width: 30px !important;
        height: 30px !important;
        position: relative !important;
        cursor: pointer !important;
        z-index: 1001 !important;
    }
    .header-main {
        position: relative !important;
    }
    .header-wrap {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    /* Ensure logo stays visible */
    .header-logo {
        flex: 1 !important;
    }
}