/* 顶部导航修复：须在 app.css 之后加载，避免被覆盖 */

/* 顶部比原 container(1140) 略收一点到 1135 */
@media (min-width: 1200px) {
    .site-header > .container {
        max-width: 1135px !important;
    }
}

@media (min-width: 768px) {
    .site-header .header-wrap {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 0.5rem;
    }

    .site-header .header-nav-col.col-auto,
    .site-header .header-nav-col {
        display: flex !important;
        align-items: center !important;
        flex: 1 1 auto !important;
        max-width: none !important;
        width: auto !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .site-header .header-nav-col .app-nav-toggle {
        flex: 0 0 auto;
    }

    /* 可滚动区域：覆盖 app.css 的 overflow:hidden */
    .site-header .header-nav-col .navbar {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
        mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 18px), transparent 100%);
        -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 18px), transparent 100%);
    }

    .site-header .header-nav-col .navbar-collapse {
        display: flex !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
    }

    .site-header .header-nav-col .navbar::-webkit-scrollbar,
    .site-header .header-nav-col .navbar-collapse::-webkit-scrollbar {
        height: 4px;
    }

    .site-header .header-nav-col .navbar::-webkit-scrollbar-thumb,
    .site-header .header-nav-col .navbar-collapse::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.4);
        border-radius: 2px;
    }

    .site-header .navbar-expand-lg .navbar-nav {
        flex-wrap: nowrap !important;
        flex-direction: row !important;
        align-items: center !important;
        width: max-content !important;
        flex-shrink: 0 !important;
    }

    .site-header .navbar .nav-item > a {
        padding: 0 0.45rem !important;
        white-space: nowrap !important;
        font-size: 13px !important;
    }

    /* 右侧固定，不遮挡左侧可滚动菜单 */
    .site-header .header-wrap > .header-right {
        flex: 0 0 auto !important;
        z-index: 3;
        position: relative;
        background: #0a0d17;
        padding-left: 0.5rem;
        margin-left: 0 !important;
    }

    #search-input-box {
        max-width: 12rem !important;
        flex: 0 1 12rem !important;
        min-width: 8rem;
    }

    #search-input-box .search-input {
        font-size: 1rem !important;
        min-width: 0 !important;
    }
}

@media (min-width: 1400px) {
    .site-header .navbar .nav-item > a {
        padding: 0 0.65rem !important;
        font-size: 14px !important;
    }

    #search-input-box {
        max-width: 16rem !important;
        flex: 0 1 16rem !important;
    }

    .site-header .header-nav-col .navbar {
        mask-image: none;
        -webkit-mask-image: none;
    }
}