/* 移动端增强样式 - 解决苹果手机二级菜单显示问题 */

/* 强制移动端菜单样式 - 最高优先级 */
@media (max-width: 991px) {
    /* 移动端二级菜单样式修复 - 强制应用 */
    #mer {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 10px 5px !important;
        background: rgba(248, 248, 248, 0.9) !important;
        border-radius: 0 0 10px 10px !important;
        border-top: 1px solid #eee !important;
        max-width: 100vw !important;
        margin: 0 !important;
        position: static !important;
        width: 100% !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        flex-direction: row !important;
        
        /* 强制不换行 */
        -webkit-box-orient: horizontal !important;
        -webkit-box-direction: normal !important;
        -webkit-flex-direction: row !important;
    }
    
    /* 苹果Safari特殊兼容 - 增强版 */
    @supports (-webkit-touch-callout: none) {
        #mer {
            display: -webkit-box !important;
            -webkit-box-orient: horizontal !important;
            -webkit-box-direction: normal !important;
            -webkit-box-lines: single !important;
            -webkit-box-pack: start !important;
            -webkit-box-align: center !important;
            
            /* 强制横向排列 - 苹果专用 */
            -webkit-flex-flow: row nowrap !important;
            -webkit-justify-content: flex-start !important;
        }
        
        #mer li {
            display: -webkit-inline-box !important;
            -webkit-box-flex: 0 !important;
            -webkit-box-ordinal-group: 1 !important;
            
            /* 防止任何换行行为 */
            -webkit-hyphens: none !important;
            -moz-hyphens: none !important;
            -ms-hyphens: none !important;
            hyphens: none !important;
        }
        
        /* 针对iOS Safari的强制横向排列 */
        #mer ol, #mer ul {
            display: -webkit-box !important;
            -webkit-box-orient: horizontal !important;
            -webkit-box-lines: single !important;
            -webkit-flex-wrap: nowrap !important;
        }
        
        /* 苹果设备下强制所有元素不换行 */
        #mer * {
            white-space: nowrap !important;
            word-wrap: normal !important;
            word-break: keep-all !important;
        }
    }
    
    /* 额外针对苹果设备的样式重置 */
    @media (max-width: 991px) and (-webkit-min-device-pixel-ratio: 2) {
        #mer {
            -webkit-font-smoothing: antialiased !important;
            -moz-osx-font-smoothing: grayscale !important;
            
            /* 强制横向布局 */
            display: -webkit-flex !important;
            -webkit-flex-direction: row !important;
            -webkit-flex-wrap: nowrap !important;
        }
        
        #mer li {
            -webkit-flex: 0 0 auto !important;
            min-width: auto !important;
            max-width: none !important;
        }
    }
    
    /* 专门针对iPhone的额外优化 */
    @media (max-width: 991px) and (orientation: portrait) {
        #mer {
            /* 纵向模式下确保横向滚动 */
            overflow-x: scroll !important;
            -webkit-overflow-scrolling: touch !important;
        }
    }
    
    #mer li {
        display: inline-block !important;
        float: left !important;
        margin: 0 5px 5px 0 !important;
        flex-shrink: 0 !important;
        -webkit-flex-shrink: 0 !important;
        min-width: auto !important;
        
        /* 强制横向排列 */
        white-space: nowrap !important;
        word-wrap: normal !important;
        word-break: keep-all !important;
    }
    
    #mer li a {
        display: inline-block !important;
        padding: 8px 15px !important;
        background: rgba(255,255,255,0.95) !important;
        border: 1px solid #ddd !important;
        border-radius: 20px !important;
        color: #666 !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        text-decoration: none !important;
        flex-shrink: 0 !important;
        -webkit-flex-shrink: 0 !important;
        
        /* 移除默认链接样式 */
        -webkit-tap-highlight-color: transparent !important;
        -webkit-appearance: none !important;
        
        /* 防止换行 */
        word-wrap: normal !important;
        word-break: keep-all !important;
    }
    
    /* 隐藏PC端菜单 */
    #pcer {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
    }
    
    /* 确保菜单容器有足够的空间 */
    nav.navbar.bootsnav .navbar-collapse {
        overflow: visible !important;
    }
    
    /* 强制菜单项不换行 */
    #mer ol, #mer ul {
        display: flex !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
        padding: 0 !important;
        margin: 0 !important;
        width: auto !important;
        min-width: auto !important;
    }
    
    /* 针对iOS Safari的滚动条优化 */
    #mer::-webkit-scrollbar {
        display: none;
    }
    
    /* 强制重置所有可能影响布局的样式 */
    #mer * {
        box-sizing: border-box !important;
    }
}

/* 针对小屏幕设备的额外优化 */
@media (max-width: 480px) {
    #mer {
        padding: 8px 3px !important;
    }
    
    #mer li {
        margin: 0 3px 3px 0 !important;
    }
    
    #mer li a {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }
}

/* 确保在移动设备上菜单项正确显示 */
@media (max-width: 991px) {
    .dropdown-menu {
        position: static !important;
        float: none !important;
        width: auto !important;
        margin-top: 0 !important;
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }
}