/* =====================================================================
   出海行 CRM · 手机端适配层 (mobile.css)
   仅在窄屏生效；桌面端模板 / 布局 / 逻辑零改动。
   断点：≤768px 手机布局；≤480px 紧凑。
   ===================================================================== */

/* ============ ≤768px：手机布局 ============ */
@media (max-width: 768px) {

  /* ---- 顶部域栏：紧凑，域标签横向滑动 ---- */
  .navapp .domainbar{ height:54px; flex-basis:54px; gap:8px; padding:0 9px; }
  .navapp .db-tabs{ gap:2px; }
  .navapp .db-tab{ padding:7px 9px !important; font-size:13px; }
  .navapp .db-tab .lbl{ display:none; }          /* 仅显图标，靠滑动切换域 */
  .navapp .db-tab.on .lbl{ display:inline; }      /* 当前域显示文字 */
  .navapp .db-right{ gap:7px; }
  .navapp .db-user{ padding:0 8px !important; }
  .navapp .domainbar .search-box{ display:none; } /* 全局搜索收进各列表内 */

  /* ---- 主体：内容全宽，侧栏为抽屉（沿用外壳960规则，这里细化） ---- */
  .navapp .page-content{ padding:12px 11px 74px; }
  .navapp .subbar{ padding:10px 12px; }
  .navapp .subbar .page-title{ font-size:16px; max-width:none !important; overflow:visible !important; text-overflow:clip !important; white-space:nowrap; flex:1 1 auto; }

  /* ---- 底部 Tab 栏 ---- */
  .bottom-tabbar{
    display:flex !important;
    position:fixed; left:0; right:0; bottom:0; z-index:120;
    height:calc(58px + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
    background:#ffffff; border-top:1px solid #e8eaee;
    box-shadow:0 -3px 14px rgba(17,24,39,.07);
  }
  .bottom-tabbar a{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:3px; font-size:10.5px; font-weight:600; color:#9aa1ad; text-decoration:none; min-height:48px;
  }
  .bottom-tabbar a svg{ width:21px; height:21px; }
  .bottom-tabbar a.active{ color:#ef6a1f; }
  .bottom-tabbar a.active svg{ stroke:#ef6a1f; }

  /* ---- 栅格：统计卡 2 列，其余单列 ---- */
  .navapp .wb-stats{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important; }
  .navapp .wb-panels,
  .navapp .wb-panels-3,
  .navapp .wb-panels-wide{ grid-template-columns:1fr !important; column-count:1 !important; gap:11px !important; }
  .navapp .grid-2, .navapp .grid-3{ grid-template-columns:1fr !important; }
  .navapp .form-row, .navapp .form-row-3{ grid-template-columns:1fr !important; gap:11px !important; }
  .navapp .content-row{ flex-direction:column !important; }

  /* ---- 卡片紧凑 ---- */
  .navapp .card{ padding:12px; border-radius:13px; }
  .navapp .stat-card, .navapp .wb-stat{ padding:13px !important; border-radius:13px; }

  /* ---- 表格：横向滑动 + 首列吸附，字段一个不少 ---- */
  .navapp .table-container,
  .navapp .table-responsive,
  .navapp .table-wrap,
  .navapp .m-scroll{
    overflow-x:auto !important; -webkit-overflow-scrolling:touch;
    border:1px solid #e8eaee; border-radius:12px; max-width:100%;
  }
  .navapp table{ width:auto !important; min-width:max-content; }
  .navapp .table-container table th:first-child,
  .navapp .table-responsive table th:first-child,
  .navapp .table-wrap table th:first-child,
  .navapp .m-scroll table th:first-child,
  .navapp .table-container table td:first-child,
  .navapp .table-responsive table td:first-child,
  .navapp .table-wrap table td:first-child,
  .navapp .m-scroll table td:first-child{
    position:sticky; left:0; z-index:2; background:#ffffff;
    box-shadow:2px 0 5px rgba(17,24,39,.07);
  }
  .navapp table thead th:first-child{ z-index:4 !important; background:#f6f7f9; }
  .navapp table{ font-size:12px; }
  .navapp table th, .navapp table td{ padding:7px 9px !important; white-space:nowrap; }

  /* ---- 工具栏 / 筛选：换行，按钮整行可点 ---- */
  .navapp .table-toolbar{ flex-direction:column !important; align-items:stretch !important; gap:9px; }
  .navapp .table-toolbar-left,
  .navapp .table-toolbar-right{ width:100% !important; flex-wrap:wrap !important; }
  .navapp .table-toolbar .btn,
  .navapp .table-toolbar select,
  .navapp .table-toolbar input{ flex:1 1 auto; min-height:40px; }

  /* ---- 弹窗：底部弹出（bottom sheet） ---- */
  #modalOverlay.modal-overlay,
  .modal-overlay{ align-items:flex-end !important; justify-content:center !important; padding:0 !important; }
  #modalOverlay .modal,
  .modal-overlay .modal{
    width:100% !important; max-width:100% !important; margin:0 !important;
    max-height:93vh; border-radius:20px 20px 0 0;
    animation:mSheetUp .24s ease;
  }
  @keyframes mSheetUp{ from{transform:translateY(40px);opacity:.6;} to{transform:none;opacity:1;} }
  #modalOverlay .modal-body,
  .modal-overlay .modal-body{ padding:14px; overflow-y:auto; }
  #modalOverlay .modal-footer,
  .modal-overlay .modal-footer{
    padding:11px 14px calc(12px + env(safe-area-inset-bottom)); flex-wrap:nowrap; gap:9px; position:sticky; bottom:0; background:#fff;
  }
  #modalOverlay .modal-footer .btn,
  .modal-overlay .modal-footer .btn{ flex:1; min-height:44px; }

  /* ---- 表单：输入全宽、16px 防 iOS 自动放大 ---- */
  .navapp #pageContent input:not([type=checkbox]):not([type=radio]),
  .navapp #pageContent select,
  .navapp #pageContent textarea{
    width:100%; max-width:100%; font-size:16px; min-height:42px;
  }
  .navapp .form-group{ margin-bottom:12px; }

  /* ---- 按钮触控区 ---- */
  .navapp .btn{ min-height:40px; }
  .navapp .nav-item{ min-height:44px; }

  /* ---- 管道：横向滑动看板（保留所有阶段列） ---- */
  .navapp .pipeline-board{
    flex-direction:row !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch;
    align-items:flex-start; gap:11px;
  }
  .navapp .pipeline-column{ min-width:260px !important; flex:0 0 260px !important; }

  /* ---- 轻提示：右下角，上移避让底部栏 ---- */
  #toastContainer.toast-container,
  .toast-container{
    right:12px !important; left:auto !important;
    bottom:74px !important; top:auto !important;
    max-width:min(300px,calc(100vw - 24px)) !important;
  }

  /* ---- 分页栏：固定在卡片下方、不浮于内容之上 ---- */
  .navapp .pagination{ flex-wrap:wrap; justify-content:center; gap:6px; position:static !important; }
}

/* ============ ≤480px：紧凑 ============ */
@media (max-width: 480px) {
  .navapp .page-content{ padding:10px 9px 72px; }
  .navapp .wb-stats{ grid-template-columns:repeat(2,1fr) !important; gap:9px !important; }
  .navapp .stat-card .k-val,
  .navapp .wb-stat .stat-value{ font-size:20px; }
  .navapp .db-tab.on .lbl{ display:none; }   /* 极窄仅图标，当前域用高亮区分 */
  .navapp .pipeline-column{ min-width:238px !important; flex-basis:238px !important; }
  .bottom-tabbar a{ font-size:10px; }
}