/* ============================================================
   移动端增强样式（外链注入，零侵入）
   在已有 H5 抽屉侧栏基础上：
   1) 补全各页面移动适配（表单堆叠 / 网格塌缩 / 触控区域 / 全屏弹窗）
   2) 简约化：扁平卡片、去重阴影、降-noise、隐藏侧栏冗余信息
   3) 智能化：底部快捷导航栏（样式部分，行为见 mobile-smart.js）
   仅对 ≤820px 生效，桌面端完全不受影响。
   ============================================================ */

@media (max-width: 820px) {
  /* —— 简约化：扁平卡片、去除重阴影，降低视觉噪音 —— */
  .card,
  .stat-card,
  .chart-card,
  .kpi-card,
  .team-card,
  .cn-card,
  .coop-box,
  .tc-member,
  .perm-banner {
    box-shadow: none !important;
    border: 1px solid var(--border);
  }

  /* —— 主内容区底部留白，避免被底部导航遮挡 —— */
  .main { padding-bottom: 74px; }

  /* —— 触控友好：扩大按钮/输入命中区域 —— */
  .btn,
  .tab-btn,
  .nt-radio,
  .radio-item,
  .filter-bar select,
  .filter-bar input,
  .pagination button { min-height: 40px; }
  .sidebar .nav-item { min-height: 46px; }

  /* —— 简约化：隐藏侧栏冗余信息 —— */
  .sidebar .footer { display: none; }
  .sidebar .logo p { display: none; }

  /* —— 两栏表单在手机上纵向堆叠 —— */
  .form-row { flex-direction: column; gap: 0; }
  .form-row .form-group { margin-bottom: 14px; }

  /* —— 筛选条：输入框占满一行 —— */
  .filter-bar input { flex: 1 1 100%; }
  .filter-bar select { flex: 1 1 auto; }

  /* —— 分页自动换行 —— */
  .pagination { flex-wrap: wrap; }

  /* —— 协作网格塌缩为单列 —— */
  .coop-grid { grid-template-columns: 1fr; }

  /* —— 团队客户行：窄屏进一步压缩指标列 —— */
  .tc-meters { flex-basis: 130px; }
  .tc-importance { width: 56px; }

  /* —— 底部快捷导航（智能化）显示开关 —— */
  #mbTabBar.show { display: flex; }
  /* 侧栏抽屉打开时隐藏底部栏，避免遮挡 */
  body.mb-sb-open #mbTabBar { display: none !important; }
}

@media (max-width: 480px) {
  /* 表格首列吸顶，便于横向滚动时对照 */
  .table-wrap table th:first-child,
  .table-wrap table td:first-child {
    position: sticky;
    left: 0;
    background: #fff;
    z-index: 2;
    box-shadow: 1px 0 0 var(--border);
  }
  .table-wrap table th:first-child { font-weight: 600; }

  /* 弹窗在手机上改为近似全屏，体验更接近 App */
  .modal-overlay { padding: 0 !important; align-items: stretch; }
  .modal { max-width: 100% !important; width: 100% !important; height: 100%; border-radius: 0; }
  .modal-body { max-height: none; }
}

/* ============================================================
   底部快捷导航栏（默认隐藏，仅 ≤820 且已登录时显示）
   ============================================================ */
#mbTabBar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 1800;
  display: none;
  background: #fff;
  border-top: 1px solid #eceef2;
  box-shadow: 0 -2px 14px rgba(0, 0, 0, .07);
  padding: 6px 2px calc(6px + env(safe-area-inset-bottom));
  justify-content: space-around;
  align-items: stretch;
}
#mbTabBar .mb-tab {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 4px 2px;
  font-size: 11px;
  line-height: 1.1;
  color: #8a8f99;
  background: none;
  border: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#mbTabBar .mb-tab .ic { font-size: 21px; line-height: 1; }
#mbTabBar .mb-tab.active { color: var(--primary); }
#mbTabBar .mb-tab.menu { color: #667eea; }