/* ===== 左侧菜单栏统一优化（全站共用） ===== */
/* 作用于 nav.navbar-default.navbar-static-side，与卡片主色 #1b2a4e / 主题蓝 #0d8eff 一套视觉 */

/* ---- 侧栏容器：深色渐变；桌面端固定在视口内，滚动页面时始终铺满左侧，不再露出灰底 ---- */
.navbar-default.navbar-static-side {
    min-height: 100vh;
    background: linear-gradient(180deg, #16243c 0%, #1b2a4e 60%, #22375f 100%);
}
@media (min-width: 768px) {
    .navbar-default.navbar-static-side {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100vh;
        overflow-y: auto;
        z-index: 100;
    }
    /* 固定后菜单过长时侧栏内部滚动，隐藏外层滚动条避免双滚动条 */
    .navbar-default.navbar-static-side::-webkit-scrollbar { width: 0; }
}
.navbar-default.navbar-static-side .sidebar-collapse { padding: 0; }
#side-menu { padding: 0 0 24px; }

/* ---- Logo 区 ---- */
.nav-header {
    padding: 0 !important;
    background: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.nav-header .profile-element {
    padding: 18px 16px 14px;
    margin: 0;
}
.nav-header .profile-element > a {
    display: block;
    padding: 0;
    background: transparent;
}
.nav-header .profile-element img {
    display: block;
    width: 100%;
    border-radius: 0 0 12px 12px;
}

/* ---- 一级菜单 ---- */
.navbar-default .nav > li > a {
    margin: 3px 10px;
    padding: 12px 14px !important;
    border-radius: 10px;
    color: #b6c4d8 !important;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .2px;
    transition: background .25s ease, color .25s ease, box-shadow .25s ease;
}
.navbar-default .nav > li > a:hover,
.navbar-default .nav > li > a:focus {
    background: rgba(255, 255, 255, .08) !important;
    color: #fff !important;
}
.navbar-default .nav > li.active,
.navbar-default .nav > li.active > a {
    border-left: 0 !important;
}
.navbar-default .nav > li.active > a {
    background: rgba(13, 142, 255, .18) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 #0d8eff;
}
/* 图标 */
.navbar-default .nav > li > a > i.fa:not(.arrow) {
    width: 22px;
    margin-right: 8px;
    text-align: center;
    color: #7f96b7;
    transition: color .25s ease;
}
.navbar-default .nav > li > a:hover > i.fa:not(.arrow),
.navbar-default .nav > li.active > a > i.fa:not(.arrow) { color: #4fc3ff; }
/* NEW 徽章 */
.navbar-default .nav > li > a .label {
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 8px;
    background: #0d8eff;
    box-shadow: 0 2px 6px rgba(13, 142, 255, .35);
}

/* ---- 二级菜单（媒体推荐 / 机场列表） ---- */
.navbar-default .nav .nav-second-level {
    background: transparent;
    padding: 2px 0 8px;
}
.navbar-default .nav .nav-second-level > li > a {
    margin: 1px 10px;
    padding: 9px 12px 9px 46px !important;
    border-radius: 8px;
    color: #93a4bd !important;
    font-size: 13px;
    transition: background .2s ease, color .2s ease;
}
.navbar-default .nav .nav-second-level > li > a:hover,
.navbar-default .nav .nav-second-level > li > a:focus {
    background: rgba(255, 255, 255, .07) !important;
    color: #fff !important;
}
/* 当前所在机场 */
.navbar-default .nav .nav-second-level > li > a.is-current {
    background: rgba(13, 142, 255, .22) !important;
    color: #fff !important;
    font-weight: 700;
    box-shadow: inset 3px 0 0 #0d8eff;
}
.navbar-default .nav .nav-second-level > li > a.is-current::before {
    content: "";
    position: absolute;
    left: 26px;
    margin-top: 5px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0d8eff;
}
.navbar-default .nav .nav-second-level > li > a { position: relative; }

/* ---- 机场列表：独立滚动，避免机场多时撑爆侧栏 ---- */
.airport-list {
    max-height: calc(100vh - 260px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.airport-list::-webkit-scrollbar { width: 6px; }
.airport-list::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .2);
    border-radius: 6px;
}
.airport-list::-webkit-scrollbar-track { background: transparent; }

/* ---- 收起态（mini-navbar） ---- */
body.mini-navbar .nav-header { background: transparent !important; }
body.mini-navbar .logo-element {
    padding: 18px 0;
    background: transparent !important;
    text-align: center;
}
body.mini-navbar .logo-element a {
    color: #fff !important;
    font-size: 13px;
}
/* 窄栏浮层子菜单：深色卡片 + 足够宽度（选择器与 inspinia 原生同级并后置，确保生效） */
body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav li:hover > .nav-second-level,
.mini-navbar .nav li:focus > .nav-second-level {
    min-width: 176px;
    background: #1b2a4e;
    border-radius: 0 12px 12px 0;
    box-shadow: 0 12px 26px rgba(0, 0, 0, .3);
    padding: 8px 0;
}

/* ---- 移动端：侧栏改为抽屉（点汉堡 .navbar-minimalize 滑出），内容全宽 ---- */
@media (max-width: 768px) {
    #page-wrapper { margin-left: 0 !important; }
    .navbar-default.navbar-static-side {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        /* 窄图标栏（与基准站一致的 70px 形态）：只放图标，子菜单走浮层 */
        width: 70px;
        height: 100vh;
        padding-top: 0;
        /* 高于顶部栏，子菜单浮层才不会被顶栏切掉 */
        z-index: 1032;
        transform: translateX(-100%);
        transition: transform .28s ease;
        box-shadow: 16px 0 40px rgba(0, 0, 0, .28);
    }
    /* 抽屉打开态（inspinia 的 minimalize 点击给 body 切换 .mini-navbar） */
    body.mini-navbar .navbar-default.navbar-static-side { transform: translateX(0); }
    /* 遮罩：点击汉堡再次收起（汉堡在顶部栏之上，始终可点） */
    body.mini-navbar::after {
        content: "";
        position: fixed;
        inset: 0;
        background: rgba(8, 16, 30, .45);
        z-index: 1029;
    }
    .navbar-static-top { position: relative; z-index: 1031; }
    .navbar-minimalize { display: inline-block !important; }
    /* 抽屉态：顶栏内容右让 70px（用 padding 而非 margin，保持栏宽不变、右侧电话不被挤出屏幕）。
       否则菜单开关（x≈15）正好压在侧栏品牌「首页」底下，点它落到品牌链接上→点了没反应、也关不掉抽屉 */
    body.mini-navbar .navbar-static-top { padding-left: 70px; }
    .navbar-default .nav > li > a {
        padding: 12px 14px !important;
        font-size: 14px;
    }
    .navbar-default .nav .nav-second-level > li > a {
        padding: 9px 12px 9px 46px !important;
        font-size: 13px;
    }
    .airport-list { max-height: 60vh; }

    /* ---- 打开态：70px 窄图标栏（沿用 inspinia 的收起态语义） ---- */
    body.mini-navbar #page-wrapper { margin-left: 0; }
    /* 一级菜单只留图标、居中 */
    body.mini-navbar .navbar-default .nav > li > a {
        margin: 4px 8px !important;
        padding: 12px 0 !important;
        text-align: center;
    }
    body.mini-navbar .navbar-default .nav > li > a > i.fa:not(.arrow) {
        width: auto;
        margin-right: 0;
        font-size: 17px;
    }
    /* NEW 徽章在窄栏里会挤出去 */
    body.mini-navbar .navbar-default .nav > li > a .label { display: none !important; }

    /* ---- 二级菜单：浮层出现在图标栏右侧（点击图标展开） ---- */
    .mini-navbar .nav-second-level,
    body.mini-navbar .nav-second-level {
        left: 70px;
        min-width: 168px;
        max-width: 70vw;
        /* 始终绝对定位并取消折叠动画的高度变化：metisMenu 展开时 Bootstrap 的 .collapsing
           会临时给子菜单 position:relative + height:0，导致浮层先「在项下方流内展开」(图1)、
           等动画结束才跳回项顶(图2)；这里强行钉死为贴项浮层，消除跳动 */
        position: absolute !important;
        top: 0 !important;
        height: auto !important;
    }
    /* 当前项(active)的浮层在 inspinia 里会单独左移 5px（left:65），与其它项不一致会产生小位移，统一为 70 */
    .mini-navbar li.active .nav-second-level,
    body.mini-navbar li.active .nav-second-level {
        left: 70px;
    }
    /* 抽屉态：把一级项设为浮层的定位基准，二级浮层紧贴「所点的那个一级项」。
       否则父 li 是 static，浮层以整条侧栏为基准（top:0）→ 会先出现在项旁、再瞬移到侧栏顶部 */
    #side-menu > li { position: relative; }
    /* 长二级菜单（资源分布：机场链接 li 未带 .airport-list 类）浮层限高并内部滚动，
       避免浮层高达数千像素、溢出屏幕底部 */
    .mini-navbar .nav-second-level,
    body.mini-navbar .nav-second-level {
        max-height: 70vh;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .mini-navbar .nav-second-level::-webkit-scrollbar { width: 6px; }
    .mini-navbar .nav-second-level::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, .22);
        border-radius: 6px;
    }
    .mini-navbar .nav li:hover > .nav-second-level,
    .mini-navbar .nav li:focus > .nav-second-level,
    .mini-navbar li.open > .nav-second-level {
        display: block;
    }
    /* 浮层内二级项：左侧留白收敛，适配窄浮层 */
    .mini-navbar .nav-second-level > li > a,
    body.mini-navbar .nav .nav-second-level > li > a {
        margin: 1px 8px !important;
        padding: 10px 12px !important;
        font-size: 13px !important;
        border-radius: 8px;
    }
    /* 资源分布列表做成浮层时限制高度并内部滚动 */
    .mini-navbar .airport-list {
        max-height: 62vh;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .mini-navbar .airport-list::-webkit-scrollbar { width: 5px; }
    .mini-navbar .airport-list::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, .22);
        border-radius: 5px;
    }

    /* ==========================================================
       手机端外壳统一优化（2026-09-24）
       顶栏 / 页面标题区 / 内容卡片节奏，与页面内卡片同一套视觉
       ========================================================== */

    /* ---- 顶部栏：紧凑 52px、毛玻璃、有信息 ---- */
    .navbar-static-top {
        display: flex;
        align-items: center;
        min-height: 52px;
        padding: 0 12px;
        background: rgba(255, 255, 255, .96) !important;
        backdrop-filter: saturate(180%) blur(10px);
        -webkit-backdrop-filter: saturate(180%) blur(10px);
        box-shadow: 0 2px 14px rgba(16, 32, 64, .07);
        border-bottom: 1px solid #eef2f8;
    }
    .navbar-static-top .navbar-header {
        float: none;
        display: flex;
        align-items: center;
        flex: 1 1 auto;
        min-width: 0;
    }
    /* 汉堡：浅蓝圆角图标按钮，替换原蓝色方块 */
    .navbar-minimalize {
        flex: 0 0 auto;
        width: 38px;
        height: 38px;
        margin: 0;
        padding: 0 !important;
        line-height: 38px;
        text-align: center;
        border: 0 !important;
        border-radius: 11px;
        background: #eaf3ff !important;
        color: #1a5fd0 !important;
        box-shadow: none !important;
        transition: background .2s ease;
    }
    .navbar-minimalize:hover,
    .navbar-minimalize:focus { background: #dbebff !important; }
    .navbar-minimalize i { font-size: 16px; }
    .navbar-form-custom { display: none !important; }
    .navbar-top-links { display: none !important; }

    /* 顶栏当前页标题 / 咨询电话（由 js/side-nav.js 注入） */
    .nav-page-title {
        margin-left: 10px;
        min-width: 0;
        font-size: 15px;
        font-weight: 700;
        color: #1b2a4e;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .nav-phone {
        flex: 0 0 auto;
        margin-left: 8px;
        padding: 7px 12px;
        font-size: 12px;
        font-weight: 700;
        color: #1a5fd0 !important;
        background: #f2f7ff;
        border-radius: 99px;
        text-decoration: none !important;
        white-space: nowrap;
    }
    .nav-phone i { margin-right: 4px; }

    /* ---- 页面标题区：卡片化（原来是无圆角白条） ---- */
    .wrapper.border-bottom.white-bg.page-heading {
        margin: 12px 0 0;
        padding: 14px 16px;
        background: #fff;
        border: 0 !important;
        border-radius: 14px;
        box-shadow: 0 8px 24px rgba(18, 38, 63, .08);
    }
    .page-heading .col-lg-10 {
        float: none;
        width: 100%;
        padding: 0;
    }
    .page-heading h2 {
        margin: 0 0 6px;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.4;
        color: #1b2a4e;
    }
    .page-heading .breadcrumb {
        margin: 0;
        padding: 0;
        background: none;
        font-size: 12px;
    }
    .page-heading .breadcrumb a { color: #0d8eff; }

    /* ---- 内容区与卡片节奏 ---- */
    .wrapper-content { padding: 12px !important; }
    .wrapper-content > .row { margin-left: 0; margin-right: 0; }
    .ibox {
        margin-bottom: 12px !important;
        border-radius: 14px !important;
        box-shadow: 0 8px 24px rgba(18, 38, 63, .08);
    }
    .ibox-title { padding: 12px 14px !important; }
    .ibox-content { padding: 14px !important; }

    /* ---- 表格：手机上横向滚动 + 紧凑 ---- */
    .table-responsive { border: 0; }
    .table > thead > tr > th,
    .table > tbody > tr > td { padding: 10px 8px !important; font-size: 12.5px; }

    /* ---- footer ---- */
    /* .footer 原是 position:absolute + bottom:0 的贴底浮层：手机上既不给上方内容留空间（显得贴太近），
       又会盖住内容（如排名页最后一行）。改为常规流并留出上间距；左右内边距与页面其他元素对齐 */
    .footer {
        position: static !important;
        margin-top: 16px !important;
        padding: 16px 14px !important;
        font-size: 12px;
    }
    /* 备案号原来是右浮动，窄屏放不下会和版权文字挤在一行混排（“广告京ICP备…”），改为各占一行 */
    .footer .pull-right { float: none !important; }
}