/* =====================================================================
   xn-responsive.css — 三端响应式补强（在原生 app.min.css 之上）
   断点：PC ≥992 / 平板 768–991 / 手机 ≤767
   ===================================================================== */

/* ============ 手机 & 平板竖屏（≤991px）：侧边栏改为抽屉 ============ */
@media (max-width:991.98px){
    /* 侧栏：默认藏到左侧，全屏高度抽屉 */
    .vertical-menu{
        display:block !important;
        position:fixed !important; top:0 !important; bottom:auto !important;
        left:-280px !important; width:260px !important; height:100vh !important;
        z-index:10001 !important; transition:left .25s ease;
        overflow-y:auto !important; -webkit-overflow-scrolling:touch;
        background:#fff !important; box-shadow:2px 0 12px rgba(0,0,0,.18) !important;
    }
    .vertical-menu .h-100{ height:auto !important; }
    /* 打开抽屉 */
    body.sidebar-open .vertical-menu{ left:0 !important; }
    /* 遮罩层：使用.xn-sidebar-overlay div（带onclick关闭事件），与首页一致 */
    .xn-sidebar-overlay{
        display:none !important; position:fixed; top:0; left:0; right:0; bottom:0;
        background:rgba(0,0,0,.45); z-index:10000;
    }
    body.sidebar-open .xn-sidebar-overlay{ display:block !important; }
    body.sidebar-open{ overflow:hidden; }

    /* 主内容占满宽度 */
    .main-content{ margin-left:0 !important; }
    .main-content .content{ margin-top:60px !important; padding:0 12px 12px !important; }
    .container-fluid{ padding-left:12px; padding-right:12px; }

    /* 顶栏紧凑 */
    #page-topbar{ height:60px !important; }
    .navbar-header{ height:60px !important; min-height:60px !important; }
    body{ padding-top:60px !important; }
    /* 手机端隐藏 logo 区，菜单按钮可见 */
    .navbar-brand-box{ display:none !important; }
    #vertical-menu-btn{ display:inline-flex !important; }

    /* 侧栏菜单在抽屉里从顶部开始 */
    

    /* 宽表格横向滚动，避免撑破布局 */
    .page-content .card-body, .page-content .table-responsive{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
    .page-content .table{ min-width:560px; }

    /* 模态/弹窗尽量满屏，避免溢出 */
    .modal-dialog{ max-width:94vw !important; margin:10px auto; }
    .modal-body{ max-height:70vh; overflow-y:auto; -webkit-overflow-scrolling:touch; }
}

/* ============ 手机（≤767px）：细节堆叠 ============ */
@media (max-width:767.98px){
    /* 顶栏文字按钮收为图标，避免拥挤 */
    #page-topbar .header-item{ padding:6px 8px; }
    #page-topbar .header-item ~ *{ font-size:12px; }
    .d-none.d-xl-inline-block.ml-1{ display:none !important; }   /* 顶栏长文字菜单（侧栏里都有）*/
    #page-header-user-dropdown .d-none.d-xl-inline-block{ display:none !important; }

    /* 卡片/区块间距紧凑 */
    .card{ margin-bottom:14px; }
    .card-body{ padding:14px !important; }

    /* bootstrap 行堆叠兜底（模板里写死 col-md 的情况）*/
    .main-content .row > [class*="col-md-"]{ flex:0 0 100%; max-width:100%; }
    .main-content .row > [class*="col-lg-"]{ flex:0 0 100%; max-width:100%; }

    /* 按钮在窄屏更易点 */
    .btn{ min-height:38px; }
    .form-control,.custom-select{ min-height:40px; font-size:15px; } /* ≥16px 防 iOS 自动缩放 */

    /* 页脚链接换行 */
    .xn-footer-links{ gap:10px 16px; }

    /* 面包屑/页头 */
    .page-title-box .page-title{ font-size:18px; }
}

/* ============ 小屏手机（≤380px） ============ */
@media (max-width:380px){
    .funds-item-other{ grid-template-columns:1fr !important; }
    .vertical-menu{ width:260px !important; left:-280px !important; }
}

/* ============ 平板横屏 / 小PC（768–1199） ============ */
@media (min-width:992px) and (max-width:1199.98px){
    .main-content .content{ padding:0 16px 14px; }
}

/* ============ PC（≥992）：固定布局微调，沿用原生 250 侧栏 ============ */
@media (min-width:992px){
    /* 保证侧栏底部用户区可随菜单滚动 */
    .vertical-menu .simplebar-content-wrapper{ overflow:visible; }
    
}

/* ============ 打印 ============ */
@media print{
    .vertical-menu,#page-topbar,.xn-footer,.xn-menu-user-footer{ display:none !important; }
    .main-content{ margin-left:0 !important; }
}
