/* ============================================================
   v3.35 移动端适配重做 + 全局微调
   1) 侧栏抽屉修复：修复 .glass{position:relative} 覆盖 手机端 .sidebar{position:fixed} 导致侧栏占据布局空间、内容区被挤到 86px 的根因
   2) 全页面移动端响应式重排：顶栏、弹窗、浮层、表格、工具条、任务卡片、聊天、表单、统计卡等
   3) 头像无白底保障（聊天页等全站头像渲染透明）
   ============================================================ */

/* ---------- 3) 头像无白底保障（全站，含桌面） ---------- */
img.avatar{ background:transparent!important; }
.msg-ava,.conv-ava,.person-chip .avatar,.mtg-parts .avatar,.prof-avatar-btn,.member-ava,.rpt-ava{ background:transparent; }
.msg-ava{ overflow:hidden; }

/* ---------- 1)+2) 移动端 ---------- */
@media (max-width:860px){
  body{ overflow-x:hidden; }
  /* 布局：侧栏改为抽屉，主区独占全宽 */
  .app{ display:block; height:100vh; overflow:hidden; }
  .sidebar.glass,.sidebar{
    position:fixed !important;
    left:0; top:0; bottom:0; margin:0;
    width:min(288px,84vw);
    height:100vh;
    border-radius:0 22px 22px 0;
    transform:translateX(-106%);
    transition:transform .3s cubic-bezier(.2,.8,.3,1);
    z-index:70;
  }
  .sidebar.open,.sidebar.open.glass{ transform:translateX(0) !important; box-shadow:12px 0 40px rgba(0,0,0,.25); }
  .side-collapse{ display:flex; } /* 抽屉内保留关闭按钮 */
  .main{ height:100vh; padding:0; gap:8px; }
  .topbar{ border-radius:0 0 16px 16px; height:52px; padding:0 12px; gap:8px; flex-shrink:0; }
  .topbar h1{ font-size:16px; }
  .menu-btn{ display:flex; width:34px;height:34px;align-items:center;justify-content:center; }
  .content{ padding:0 10px 20px; min-height:0; }
  .top-actions{ gap:4px; }
  .user-chip{ display:none !important; }
  .notif-bell{ width:32px;height:32px;min-height:32px; }

  /* 弹窗：底部抽屉式，避免内容被裁切 */
  .modal-mask{ padding:0; align-items:flex-end; }
  .modal,.modal.wide{ width:100% !important; max-width:100%; max-height:92vh; border-radius:20px 20px 0 0; }
  .modal-head{ padding:15px 18px; }
  .modal-head h3{ font-size:16px; }
  .modal-body{ padding:16px 18px; -webkit-overflow-scrolling:touch; }

  /* 二级浮层同样底部抽屉式 */
  .pop-mask{ padding:0; align-items:flex-end; }
  .pop-sheet{ width:100% !important; max-width:100%; max-height:92vh; border-radius:20px 20px 0 0; }
  .pop-head{ padding:14px 18px 12px; }
  .pop-body{ padding:14px 18px; -webkit-overflow-scrolling:touch; }
  .pop-foot{ padding:12px 18px; }

  /* 表格：横向滚动 + 紧凑 */
  .table-wrap{ border-radius:14px; }
  thead th, tbody td{ padding:10px 12px; font-size:12.5px; }
  .table-wrap thead th, .table-wrap tbody td{ white-space:nowrap; }

  /* 工具条：换行紧凑 */
  .toolbar{ gap:6px; margin-bottom:12px; }
  .toolbar .spacer{ display:none; }
  .toolbar .btn,.toolbar .btn-sm,.seg .btn{ padding:8px 11px; font-size:12.5px; }
  .seg{ gap:4px; flex-wrap:wrap; }
  .search-box{ flex:1; min-width:110px; }
  .icon-btn{ width:34px;height:34px; }

  /* 表单：单列 + 防 iOS 聚焦放大 */
  .form-row,.item-grid,.item-zone{ grid-template-columns:1fr !important; }
  input,select,textarea{ font-size:15px; }
  label.fld{ margin-bottom:12px; }

  /* 任务卡片：纵向堆叠、操作换行 */
  .task-item{ flex-direction:column; align-items:stretch; gap:10px; padding:14px; }
  .task-acts{ flex-wrap:wrap; }
  .task-meta{ flex-wrap:wrap; row-gap:4px; }
  .task-toolbar{ flex-wrap:wrap; }

  /* 统计卡：两列 + 紧凑 */
  .stat-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .stat-card{ padding:14px; }
  .stat-num{ font-size:24px; }
  .stat-ico{ width:36px;height:36px;font-size:17px; }
  .dash-grid{ gap:12px; }
  .card{ padding:16px; }
  .section-title{ margin:16px 0 10px; font-size:15px; }

  /* 聊天 */
  .chat-layout{ height:calc(100vh - 96px); min-height:0; margin-top:8px; border-radius:16px; }
  .msg-row{ max-width:88%; }
  .conv-item{ padding:11px 12px; }
  .msg-stream{ padding:12px 10px; }
  .chat-input-bar{ padding:10px 10px; gap:8px; }
  .msg-img{ max-width:70vw; max-height:200px; }
  .msg-product{ width:230px; }

  /* 成员 / 商品网格：单列或两列 */
  .member-grid,.members-grid{ grid-template-columns:1fr !important; }
  .product-grid{ grid-template-columns:repeat(2,1fr) !important; gap:10px; }
  .product-card{ padding:12px; }

  /* 区域可视化：高度适配 */
  .zone-viewport{ height:62vh; min-height:340px; }
  .zone-canvas{ height:44vh; min-height:300px; }

  /* 导航触控面积 */
  .nav-item{ padding:13px 14px; }

  /* 其他细节 */
  .rpt-input textarea{ font-size:15px; }
  .member-pick{ max-height:30vh; overflow-y:auto; }
  .mtg-parts{ flex-wrap:wrap; }
  .hide-mobile{ display:none !important; }
}

/* 更小屏（≤400px）：进一步收紧 */
@media (max-width:400px){
  .stat-grid{ grid-template-columns:1fr 1fr; }
  .toolbar .btn{ padding:7px 9px; font-size:12px; }
  .content{ padding:0 8px 16px; }
  .modal-body,.pop-body{ padding:14px; }
}
