/* 聚单科技 · 移动端适配（打手/发单人/客户端外壳） v20261103a
   仅 ≤820px 生效，桌面端完全不受影响 */
@media (max-width:820px){
  /* ── 左侧图标栏 → 顶部横条 ─────────────────────────── */
  .customer-shell .customer-sidebar{
    top:0 !important; right:0 !important; bottom:auto !important; left:0 !important;
    width:100% !important; height:56px;
    display:flex; align-items:center;
    padding:0 8px;
    border-right:0; border-bottom:1px solid #d3dbe3;
    box-shadow:0 2px 10px rgba(31,72,115,.08);
    z-index:900;
  }
  .customer-shell .customer-brand{
    height:56px; margin-right:auto; border-bottom:0; gap:4px; flex:none;
  }
  .customer-shell .customer-brand strong{ display:none; }
  .customer-shell .customer-brand button{ width:40px; height:40px; }
  .customer-shell .customer-sidebar nav{
    display:flex; align-items:center; gap:2px;
    padding:0; overflow-x:auto; -webkit-overflow-scrolling:touch;
  }
  .customer-shell .customer-nav-item{
    flex:none; width:46px; height:44px; margin:0; padding:0; justify-content:center;
  }
  .customer-shell .customer-nav-item .nav-badge{ left:auto; right:-4px; top:2px; }

  /* ── 内容区让出顶部 ───────────────────────────────── */
  .customer-shell .customer-content{ margin-left:0 !important; margin-top:56px; }
  .customer-shell .customer-content:before{ left:0 !important; top:60px; }
  .customer-shell .customer-page{ padding:12px 12px 28px; }

  /* ── 页头：标题不再被挤成竖排，操作按钮自动换行 ───── */
  .customer-page .page-head{ flex-wrap:wrap; row-gap:10px; margin-bottom:12px; }
  .customer-page .page-head h1{ flex:0 0 auto; font-size:21px; }
  .customer-page .page-head .actions{ width:100%; flex-wrap:wrap; gap:8px; }

  /* ── 网格全部收成单列，不再横向溢出 ───────────────── */
  .customer-page .hall-grid{ grid-template-columns:1fr !important; min-height:0; }
  .customer-page .results{ grid-template-columns:1fr !important; }
  .customer-page .orders-layout{ grid-template-columns:1fr !important; }

  /* ── 抽屉/筛选面板接近全宽 ────────────────────────── */
  .customer-content .el-drawer.rtl,
  .customer-content .el-drawer.ltr{ width:96vw !important; }

  /* ── 表格类内容可横向滑动兜底 ─────────────────────── */
  .customer-page .el-table{ max-width:100%; }

  /* ── 发单人端 · 我的账户（/manager/account）────────── */
  .mgr-shell .account-page{ padding:12px 12px 28px !important; }
  .mgr-shell .account-page .top-grid{ grid-template-columns:1fr !important; }
  .mgr-shell .account-page .top-grid > article{ min-width:0; }
  .mgr-shell .account-page .identity{ min-width:0; }
  .mgr-shell .account-page .identity > div{ min-width:0; }
  .mgr-shell .account-page .identity p,
  .mgr-shell .account-page .identity small,
  .mgr-shell .account-page .identity h2{ word-break:break-all; }
  .mgr-shell .account-page .stats{ grid-template-columns:repeat(4,1fr) !important; }
  .mgr-shell .account-page .stats div{ min-width:0; }
  .mgr-shell .account-page .stats b{ font-size:17px; }
  .mgr-shell .account-page .service-grid{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)) !important; }
  .mgr-shell .account-page .profile-card,
  .mgr-shell .account-page .deposit-card,
  .mgr-shell .account-page .services{ padding:16px 14px; }
  .mgr-shell .account-page .deposit-total strong{ font-size:32px; }
  .mgr-shell .account-page .page-head{ flex-wrap:wrap; row-gap:8px; }
  .mgr-shell .account-page .page-head > div{ min-width:0; max-width:calc(100% - 60px); }
  .mgr-shell .account-page .deposit-card header{ flex-wrap:wrap; row-gap:8px; }
  .mgr-shell .account-page .deposit-card header h2{ white-space:nowrap; }
  .mgr-shell .account-page .deposit-card header span{ white-space:nowrap; }
}