/* ==========================================================
   mobile.css — 手机端适配（2026-10-15）
   仅 @media (max-width: 768px) 生效，桌面端零影响。
   布局：侧栏 → 底部导航（横向滚动）；表格随 .view 横向滑动；
   吸顶逻辑（--bar-h 由 JS 实时写入）原样沿用。
   ========================================================== */

@media (max-width: 768px) {
  html { -webkit-text-size-adjust: 100%; }

  /* ---- 整体骨架：侧栏变底部导航栏 ---- */
  .app { flex-direction: column-reverse; height: 100vh; height: 100dvh; }
  .sidebar {
    width: 100%; flex-direction: row; align-items: center;
    padding: 4px 6px; padding-bottom: max(4px, env(safe-area-inset-bottom));
    gap: 4px; border-top: 1px solid #1b2a47;
  }
  .sidebar .logo, .sidebar .nav-label { display: none; }
  .sidebar nav { flex-direction: row; overflow-x: auto; gap: 2px; flex: 1; -webkit-overflow-scrolling: touch; }
  .sidebar nav .nav-group { display: flex; flex-direction: row; gap: 2px; }
  .sidebar nav a {
    border-left: none; padding: 8px 9px; font-size: 12px; white-space: nowrap;
    display: flex; flex-direction: column; align-items: center; gap: 2px;
  }
  .sidebar nav a.active { border-left: none; }
  .sidebar .me { border-top: none; padding: 0 4px; flex-direction: column; gap: 6px; font-size: 11px; }
  .sidebar .me .btn { padding: 4px 8px; }

  /* ---- 顶栏 ---- */
  .topbar { padding: 10px 12px; }
  .topbar h2 { font-size: 16px; }
  .topbar-right { flex-wrap: wrap; gap: 6px; }

  /* ---- 视图与工具栏 ---- */
  .view.dash-view { padding: 12px; }
  .view-toolbar { padding: 10px 12px 8px; }
  .view-toolbar .toolbar, .view-toolbar .filters { flex-wrap: wrap; }
  .ct-bar-main, .ct-bar-sub { max-width: 100%; }
  .ct-bar-sub { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; }

  /* ---- 触控目标与 iOS 聚焦防缩放 ---- */
  .btn { min-height: 36px; }
  select,
  input[type="text"], input[type="search"], input[type="password"],
  input[type="date"], input[type="tel"] { font-size: 16px; }

  /* ---- 统计卡片 ---- */
  .stats { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .grid2 { grid-template-columns: 1fr; }
  .perf-summary { grid-template-columns: 1fr; }
  .eb-summary { grid-template-columns: repeat(2, 1fr); }

  /* ---- 弹窗 ---- */
  .modal { width: 96vw; max-height: 92dvh; }
  .modal-body { padding: 14px; }
  .row2 { grid-template-columns: 1fr; }

  /* ---- 登录页：单列，隐藏左侧品牌区 ---- */
  .login-split { flex-direction: column; min-height: 0; width: 100%; max-width: 100vw; border-radius: 0; }
  .login-brand { display: none; }
}
