/* ============================================================
   V3.23  手机端全面适配（断点 860px / 480px）
   ============================================================ */

@media (max-width:860px){

  /* ---------- 全局基础 ---------- */
  body{ font-size:14px; -webkit-text-size-adjust:100%; }
  .app{ height:100dvh; }
  .main{ padding:8px; gap:10px; }
  .content{ padding-right:0; padding-bottom:20px; }

  /* ---------- 顶部栏 ---------- */
  .topbar{ height:52px; padding:0 12px; gap:8px; border-radius:14px; }
  .topbar h1{ font-size:16px; font-weight:700; }
  .menu-btn{ width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:10px; }
  .top-actions{ gap:4px; }
  .top-actions .glass-btn{ width:36px; height:36px; padding:0; border-radius:10px; font-size:12px; }
  .icon-zoom{ font-size:12px!important; font-weight:700; }
  .user-chip{ max-width:80px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:6px 10px; font-size:12px; }
  .notif-bell{ position:relative; }

  /* ---------- 侧边栏抽屉 ---------- */
  .sidebar{ width:260px; padding:16px 12px; }
  .brand{ padding:4px 6px 14px; }
  .brand-logo{ width:38px; height:38px; font-size:18px; }
  .brand-txt b{ font-size:15px; }
  .nav-item{ padding:11px 12px; font-size:14.5px; gap:10px; }
  .ni-ico{ width:20px; font-size:16px; }
  .side-foot .theme-toggle{ padding:10px; font-size:13px; }

  /* ---------- 仪表盘 ---------- */
  .stat-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .stat-card{ padding:14px; gap:5px; }
  .stat-num{ font-size:24px; }
  .stat-label{ font-size:12px; }
  .stat-ico{ width:36px; height:36px; font-size:17px; border-radius:10px; }
  .section-title{ font-size:14.5px; margin:16px 0 8px; }
  .dash-section{ padding:14px; }

  /* ---------- 工具栏 ---------- */
  .toolbar{ gap:6px; margin-bottom:10px; }
  .toolbar .btn{ padding:8px 12px; font-size:13px; min-height:38px; border-radius:10px; }
  .toolbar .btn-sm{ padding:6px 10px; font-size:12px; min-height:34px; }
  .toolbar .search, .toolbar input.glass{ min-width:0!important; width:100%; height:38px; font-size:13px; order:99; }
  .toolbar select.glass{ height:38px; font-size:13px; padding:0 10px; }
  .toolbar .spacer{ display:none; }

  /* ---------- 表格 ---------- */
  .table-wrap{ border-radius:14px; -webkit-overflow-scrolling:touch; }
  table{ font-size:12.5px; }
  thead th{ padding:10px 10px; font-size:11.5px; }
  tbody td{ padding:9px 10px; font-size:12.5px; }
  .cell-img{ width:32px; height:32px; border-radius:6px; }
  .act-btns{ gap:2px; }
  .icon-btn{ width:30px; height:30px; font-size:13px; }
  .row-chk{ width:16px; height:16px; }

  /* ---------- 弹窗 ---------- */
  .modal-mask{ padding:10px; align-items:flex-end; }
  .modal{ width:100%; max-width:100%; max-height:92dvh; margin:0; border-radius:18px 18px 0 0; overflow:hidden; display:flex; flex-direction:column; animation:modalSlideUp .3s cubic-bezier(.2,.8,.3,1); }
  @keyframes modalSlideUp{ from{ transform:translateY(100%); opacity:.5; } to{ transform:none; opacity:1; } }
  .modal-head{ padding:14px 16px; min-height:48px; }
  .modal-head h3{ font-size:16px; }
  .modal-close{ width:34px; height:34px; font-size:18px; }
  .modal-body{ padding:14px 16px; overflow-y:auto; -webkit-overflow-scrolling:touch; flex:1; }
  .modal-foot{ padding:12px 16px 16px; gap:8px; display:flex; }
  .modal-foot .btn{ flex:1; min-height:44px; font-size:14px; justify-content:center; }
  .modal-foot .btn-ghost{ flex:1; padding:0; }

  /* ---------- 表单 ---------- */
  .fld{ margin-bottom:12px; }
  .fld span{ font-size:12.5px; margin-bottom:5px; }
  input,select,textarea{ font-size:15px; padding:11px 13px; min-height:44px; border-radius:10px; }
  textarea{ min-height:80px; }
  .form-row{ grid-template-columns:1fr; gap:0; }
  .fld textarea{ font-size:15px; }

  /* ---------- 到货单明细卡片 ---------- */
  .item-card{ padding:12px; gap:8px; position:relative; }
  .item-grid{ display:flex; flex-wrap:wrap; gap:6px 8px; align-items:center; }
  .item-grid .ar-prod-img{ width:40px; height:40px; flex:0 0 40px; }
  .item-grid .it-code{ flex:1 1 calc(100% - 56px); min-width:0; font-size:14px; font-weight:600; }
  .item-grid input[data-f="product_name"]{ flex:1 1 100%; }
  .item-grid input[data-f="color_spec"]{ flex:1 1 100%; }
  .item-grid input[data-f="spec_qty"]{ flex:1 1 calc(50% - 4px); }
  .item-grid input[data-f="pieces"]{ flex:1 1 calc(50% - 4px); }
  .item-grid [data-act="item-del"]{ position:absolute; top:8px; right:8px; width:30px; height:30px; z-index:2; background:var(--input-bg); border-radius:8px; }
  .item-grid input{ width:auto; min-height:40px; font-size:14px; }
  .item-zone{ flex-direction:column; align-items:stretch; gap:6px; margin-top:4px; }
  .item-zone .it-zone{ width:100%; min-height:42px; font-size:14px; }
  .item-zone .it-sum{ font-size:12px; text-align:right; order:3; }
  .item-zone .item-photo-btn{ width:100%; justify-content:center; min-height:42px; order:2; }
  .slot-chips{ margin-bottom:2px; order:1; }
  .arr-detail{ padding:10px 12px; }
  .arr-detail-head{ font-size:12px; flex-wrap:wrap; gap:6px; }

  /* ---------- 区域管理 ---------- */
  .zone-viewport{ height:calc(100dvh - 240px); min-height:320px; border-radius:14px; }
  .zoom-ctl{ padding:4px 8px; gap:2px; }
  .zoom-ctl button{ width:30px; height:30px; font-size:14px; }
  .zoom-ctl span{ font-size:11px; min-width:36px; }
  .zone-box{ font-size:11px; }
  .zone-box .zb-name{ font-size:11px; }

  /* ---------- 权限矩阵 ---------- */
  .perm-matrix{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .pm-table{ min-width:560px; }
  .pm-head-row,.pm-row{ grid-template-columns:110px repeat(6,1fr); }
  .pm-mod{ font-size:12px; padding:0 8px; }
  .pm-head-row .pm-act{ font-size:11px; }
  .pm-cb input{ width:18px; height:18px; }
  .pm-quick{ flex-wrap:wrap; }
  .pm-quick .btn{ flex:1; min-width:80px; justify-content:center; }

  /* ---------- 字段设置 ---------- */
  .col-mgr-list{ max-height:40vh; }
  .col-mgr-row{ flex-wrap:wrap; gap:6px; padding:8px; }
  .col-mgr-row .col-title{ flex:1 1 100%; min-width:0; }
  .col-mgr-row .col-type{ flex:1; min-width:100px; }
  .col-mgr-row .col-rm{ width:34px; height:34px; }
  .col-add-btn{ min-height:40px; }

  /* ---------- 成员卡片 ---------- */
  .members-grid{ grid-template-columns:1fr; gap:10px; }
  .member-card{ padding:14px; }

  /* ---------- 聊天页面 ---------- */
  .chat-layout{ flex-direction:column; }
  .chat-sidebar{ width:100%; max-height:40vh; border-right:none; border-bottom:1px solid var(--divider); }
  .chat-main{ flex:1; }
  .chat-msg{ max-width:85%; }
  .chat-input-area{ padding:8px; }
  .chat-input{ font-size:15px; min-height:40px; }

  /* ---------- 商品管理 ---------- */
  .product-grid{ grid-template-columns:repeat(2,1fr); gap:10px; }
  .product-card{ padding:12px; }
  .product-img{ width:100%; aspect-ratio:1; }

  /* ---------- 供应商/流水等列表 ---------- */
  .list-item{ padding:12px; flex-direction:column; align-items:flex-start; gap:6px; }
  .list-item .act-btns{ align-self:flex-end; }

  /* ---------- 加载/空状态 ---------- */
  .empty{ padding:30px 16px; }
  .empty .e-ico{ font-size:36px; }

  /* ---------- 通知面板 ---------- */
  .notif-panel{ width:calc(100vw - 20px); right:10px; left:10px; max-height:70vh; }

  /* ---------- 确认弹窗 ---------- */
  .confirm-dialog{ width:calc(100vw - 40px); max-width:360px; }
  .confirm-dialog .modal-foot .btn{ flex:1; }

  /* ---------- 图片预览 ---------- */
  .img-preview{ max-width:95vw; max-height:85vh; }

  /* ---------- 隐藏桌面端专属元素 ---------- */
  .desktop-only{ display:none!important; }
}

/* ============================================================
   超小屏（≤480px）精细优化
   ============================================================ */
@media (max-width:480px){
  .stat-grid{ grid-template-columns:1fr; }
  .product-grid{ grid-template-columns:1fr; }
  .topbar h1{ font-size:15px; }
  .user-chip{ display:none; }
  .toolbar .btn{ padding:7px 10px; font-size:12.5px; }
  .stat-num{ font-size:22px; }
  .modal-body{ padding:12px 14px; }
  .pm-table{ min-width:500px; }
  .pm-head-row,.pm-row{ grid-template-columns:96px repeat(6,1fr); }
  .arr-detail table{ font-size:11.5px; }
  .arr-detail th,.arr-detail td{ padding:7px 6px; }
  .zone-viewport{ height:calc(100dvh - 240px); min-height:300px; }
}

/* ============================================================
   横屏手机优化
   ============================================================ */
@media (max-width:860px) and (orientation:landscape){
  .modal{ max-height:88dvh; }
  .zone-viewport{ height:calc(100dvh - 140px); min-height:260px; }
  .stat-grid{ grid-template-columns:repeat(4,1fr); }
}