/* ===== v3.0 Design System: Design Tokens（值等价抽取，改主题只改此处） ===== */
:root {
  --ti-primary:#1989fa; --ti-primary-dark:#096dd9; --ti-primary-light:#37a2ff; --ti-primary-deep:#0e62c7; --ti-primary-alt:#1e88e5;
  --ti-success:#07c160; --ti-success-2:#4caf50; --ti-warning:#ff9800; --ti-danger:#f44336; --ti-danger-2:#f56c6c;
  --ti-info-bg:#e3f2fd; --ti-success-bg:#e8f5e9;
  --ti-white:#fff; --ti-mask:rgba(0,0,0,0.5);
  --ti-text-1:#1f2d3d; --ti-text-2:#333; --ti-text-3:#666; --ti-text-4:#999; --ti-text-disabled:#bbb; --ti-text-strong:#555;
  --ti-border:#ddd; --ti-border-light:#eee; --ti-divider:#e0e0e0;
  --ti-bg-page:#f5f6fa; --ti-bg-page-2:#f0f2f5; --ti-bg-gray:#f5f5f5; --ti-bg-gray-2:#f0f0f0; --ti-bg-hover:#f5f7fa; --ti-bg-fa:#fafafa;
  --ti-grad-primary:linear-gradient(135deg,var(--ti-primary),var(--ti-primary-dark));
  --ti-grad-primary-bright:linear-gradient(135deg,var(--ti-primary),var(--ti-primary-light));
  --ti-grad-hero:linear-gradient(135deg,var(--ti-primary-dark),var(--ti-primary));
  --ti-grad-hero2:linear-gradient(135deg,var(--ti-primary) 0%,var(--ti-primary-dark) 100%);
  --ti-grad-primary-alt:linear-gradient(135deg,var(--ti-primary-alt),var(--ti-primary));
  --ti-grad-blue-soft:linear-gradient(135deg,var(--ti-bg-hover),var(--ti-info-bg));
  --ti-radius-sm:6px; --ti-radius:8px; --ti-radius-lg:12px; --ti-radius-xl:16px;
  --ti-shadow-sm:0 1px 4px rgba(16,24,40,0.06);
  --ti-shadow-blue:0 2px 8px rgba(25,137,250,0.22);
  --ti-shadow-blue-lg:0 3px 12px rgba(25,137,250,0.32);
  --ti-shadow-focus:0 0 0 3px rgba(25,137,250,0.12);
  --ti-shadow-modal:0 16px 48px rgba(0,0,0,0.18);
  --ti-gap-xs:4px; --ti-gap-sm:8px; --ti-gap:12px; --ti-gap-lg:16px; --ti-gap-xl:24px;
}

  * { -webkit-tap-highlight-color: transparent; }
  /* v3.8.153 数字自适应：不换行 + 溢出省略，配合 fitShrink 逐级缩字号 */
  [data-shrink] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; font-variant-numeric: tabular-nums; }
  /* 概况工单 tab：按钮内文字永不折行（整行放不下时换行排列，不横向裁掉） */
  #tab-all, #tab-wait, #tab-pool, #tab-transfer { white-space: nowrap; }
  @media (max-width: 768px) {
    /* 库存统计卡：手机端标签与数值上下两行，窄卡片里互不挤压，长数值也不会被截断 */
    #inventory-stats > div { flex-direction: column !important; align-items: flex-start !important; gap: 2px; }
    #inventory-stats > div > div:last-child { max-width: 100%; text-align: left; }
  }
  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: var(--ti-bg-hover); }
  .page { display: none; }
  .page.active { display: block; }
  .tab-bar { position: fixed; bottom: 0; left: 0; right: 0; background: var(--ti-white); border-top: 1px solid var(--ti-border-light); display: flex; z-index: 50; }
  .tab-item { flex: 1; text-align: center; padding: 8px 0; font-size: 12px; color: var(--ti-text-4); cursor: pointer; position: relative; }
  .tab-item.active { color: var(--ti-primary); }
  /* v3.7.0 客服端嵌入适配：会话区高度避让底 tab；嵌入商城时隐藏商城自带顶栏 */
  .cs-home-embed > div { height: calc(100vh - 122px) !important; }
  .cs-mall-embed .mall-topnav, .cs-mall-embed .part-detail-topnav { display: none !important; }

  /* v3.7.1 管理端手机端：数据表格转卡片（隐藏表头，行变卡片，列带标签） */
  @media (max-width: 768px) {
    .admin-mobile-body table, .admin-mobile-body tbody, .admin-mobile-body tr { display: block; width: 100%; }
    .admin-mobile-body thead { display: none; }
    /* v3.8.153 卡片压缩：字段两列排布（tr 用 font-size:0 消除 inline-block 空隙），操作行独占一行，整卡可点开详情 */
    .admin-mobile-body tr { background: #fff; border-radius: 10px; margin-bottom: 8px; padding: 8px 10px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); border: 1px solid #eef0f3; font-size: 0; cursor: pointer; }
    .admin-mobile-body tr:active { background: var(--ti-bg-hover); }
    .admin-mobile-body td, .admin-mobile-body th { display: inline-block; width: 50%; box-sizing: border-box; vertical-align: top; padding: 2px 4px 2px 0 !important; border: none !important; text-align: left !important; max-width: 100% !important; white-space: normal !important; font-size: 13px; overflow-wrap: break-word; }
    .admin-mobile-body td::before { display: inline-block; min-width: 50px; color: #999; font-size: 11px; margin-right: 5px; font-weight: normal; }
    .admin-mobile-body td:last-child { display: flex !important; width: 100% !important; flex-wrap: wrap; align-items: center; gap: 2px 10px; margin-top: 4px; padding-top: 5px !important; border-top: 1px dashed var(--ti-border-light) !important; }
    /* v3.8.154 归属二选一：手机端整格隐藏（PC 端保留占位对齐列） */
    .admin-mobile-body td.cell-hide { display: none !important; }
    #dash-order-list td:nth-child(1)::before { content: '单号'; }
    #dash-order-list td:nth-child(2)::before { content: '类型'; }
    #dash-order-list td:nth-child(3)::before { content: '故障描述'; }
    #dash-order-list td:nth-child(4)::before { content: '状态'; }
    #dash-order-list td:nth-child(5)::before { content: '师傅'; }
    #dash-order-list td:nth-child(6)::before { content: '时间'; }
    #dash-order-list td:nth-child(7)::before { content: '操作'; }
    #customer-list td:nth-child(1)::before { content: 'ID'; }
    #customer-list td:nth-child(2)::before { content: '账号'; }
    #customer-list td:nth-child(3)::before { content: '名称'; }
    #customer-list td:nth-child(4)::before { content: '电话'; }
    #customer-list td:nth-child(5)::before { content: '工单数'; }
    #customer-list td:nth-child(6)::before { content: '商城订单'; }
    #customer-list td:nth-child(7)::before { content: '操作'; }
    #elevator-list td:nth-child(1)::before { content: '编号'; }
    #elevator-list td:nth-child(2)::before { content: '品牌'; }
    #elevator-list td:nth-child(3)::before { content: '主板型号'; }
    #elevator-list td:nth-child(4)::before { content: '地址'; }
    #elevator-list td:nth-child(5)::before { content: '所属客户'; }
    #elevator-list td:nth-child(6)::before { content: '负责维保工'; }
    #elevator-list td:nth-child(7)::before { content: '急修负责人'; }
    #elevator-list td:nth-child(8)::before { content: '操作'; }
    #account-list td:nth-child(1)::before { content: 'ID'; }
    #account-list td:nth-child(2)::before { content: '账号'; }
    #account-list td:nth-child(3)::before { content: '姓名'; }
    #account-list td:nth-child(4)::before { content: '角色'; }
    #account-list td:nth-child(5)::before { content: '所属仓库'; }
    #account-list td:nth-child(6)::before { content: '所属公司'; }
    #account-list td:nth-child(7)::before { content: '电话'; }
    #account-list td:nth-child(8)::before { content: '状态'; }
    #account-list td:nth-child(9)::before { content: '积分'; }
    #account-list td:nth-child(10)::before { content: '操作'; }
    #worker-list td:nth-child(1)::before { content: 'ID'; }
    #worker-list td:nth-child(2)::before { content: '账号'; }
    #worker-list td:nth-child(3)::before { content: '姓名'; }
    #worker-list td:nth-child(4)::before { content: '等级'; }
    #worker-list td:nth-child(5)::before { content: '电话'; }
    #worker-list td:nth-child(6)::before { content: '技能标签'; }
    #worker-list td:nth-child(7)::before { content: '状态'; }
    #worker-list td:nth-child(8)::before { content: '证件认证'; }
    #worker-list td:nth-child(9)::before { content: '操作'; }
    #admin-parts-list td:nth-child(2)::before { content: '商品名称'; }
    #admin-parts-list td:nth-child(3)::before { content: '物料号'; }
    #admin-parts-list td:nth-child(4)::before { content: '编码'; }
    #admin-parts-list td:nth-child(5)::before { content: '品牌'; }
    #admin-parts-list td:nth-child(6)::before { content: '规格'; }
    #admin-parts-list td:nth-child(7)::before { content: '价格'; }
    #admin-parts-list td:nth-child(8)::before { content: '库存'; }
    #admin-parts-list td:nth-child(9)::before { content: '状态'; }
    #admin-parts-list td:nth-child(10)::before { content: '替代物料'; }
    #admin-parts-list td:nth-child(11)::before { content: '操作'; }
  }

  /* v3.7.2 商品详情页底部操作栏手机端压缩 */
  @media (max-width: 768px) {
    .part-detail-footer { padding: 8px 10px !important; gap: 6px !important; justify-content: flex-start !important; padding-bottom: max(8px, env(safe-area-inset-bottom)) !important; }
    .part-detail-footer > div:first-child { transform: scale(0.85); transform-origin: left center; margin-right: -10px; }
    .part-detail-footer button { padding: 8px 10px !important; font-size: 12px !important; border-radius: 18px !important; white-space: nowrap; flex-shrink: 0; }
    /* v3.7.9 详情页顶部导航手机端隐藏（桌面导航在手机上不可用） */
    .part-detail-topnav { display: none !important; }
    /* v3.7.9 详情页 hero 蓝条：标题一行、搜索+购物车一行 */
    .part-detail-hero { padding: 12px 14px !important; }
    .part-detail-hero-row { flex-wrap: wrap !important; gap: 10px !important; }
    .part-detail-hero-row > img { width: 34px !important; height: 34px !important; }
    .part-detail-hero-row > div:nth-child(2) { flex: 1 1 auto !important; }
    .part-detail-hero-row > div:nth-child(2) > div:first-child { font-size: 15px !important; white-space: nowrap; }
    .part-detail-hero-sub { display: none !important; }
    .part-detail-hero-search { order: 3; flex: 1 1 100% !important; max-width: 100% !important; }
  }

  /* v3.7.3 PC 端配件管理表：表头与关键列强制一行不换行 */
  @media (min-width: 769px) {
    #admin-parts-list th { white-space: nowrap !important; }
    #admin-parts-list td:nth-child(4), #admin-parts-list td:nth-child(5), #admin-parts-list td:nth-child(6), #admin-parts-list td:nth-child(9), #admin-parts-list td:nth-child(11) { white-space: nowrap !important; }
  }
  /* v3.7.5 PC 端库存管理明细表：表头强制一行不换行 */
  @media (min-width: 769px) {
    #admin-inventory-table th { white-space: nowrap !important; }
  }
  .tab-item .icon { font-size: 20px; display: block; margin-bottom: 2px; pointer-events: none; } .tab-item > * { pointer-events: none; }
  .notify-badge { position: absolute; top: 2px; right: 14%; min-width: 16px; height: 16px; line-height: 16px; padding: 0 4px; background: var(--ti-danger); color: var(--ti-white); border-radius: 8px; font-size: 11px; font-weight: bold; text-align: center; box-sizing: border-box; pointer-events: none; }
  .admin-menu-item .notify-badge { position: static; margin-left: 8px; vertical-align: middle; }
  /* v3.8.60 隐藏全部待办红点角标（stats 接口与声音提醒保留；删除下一行即可恢复） */
  .notify-badge, .admin-menu-item .notify-badge { display: none !important; }

  /* v3.5.0 移动端适配：业务/仓库/仓管/采购 底部 tabbar + 手机端布局 */
  .wh-mobile-shell .tab-bar { overflow-x: auto; padding-bottom: env(safe-area-inset-bottom, 0px); }
  .wh-mobile-shell .tab-bar .tab-item { min-width: 64px; flex: 1 0 auto; }

  /* v3.13.0 顶部可横滑分段控件：功能 tab 超过 4 个时的手机端形态。
     底部 tabbar 在 7 个 tab 时总宽 448px，手机上只能盲滑且无提示，用户以为入口丢了。
     改到顶部后所有入口一眼可见，右侧渐隐暗示「还能往右滑」。 */
  .wh-top-tabs {
    position: sticky; top: 56px; z-index: 39; background: var(--ti-white);
    border-bottom: 1px solid var(--ti-border-light);
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
    mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent 100%);
  }
  .wh-top-tabs::-webkit-scrollbar { display: none; }
  .wh-top-tabs-inner { display: flex; gap: 6px; padding: 10px 12px; width: max-content; min-width: 100%; }
  .wh-top-tabs .tab-item {
    flex: 0 0 auto; min-width: auto; padding: 7px 14px; font-size: 13px;
    border-radius: 18px; background: var(--ti-bg-page-2); color: var(--ti-text-3);
    display: flex; align-items: center; gap: 4px; white-space: nowrap; line-height: 1.2;
  }
  .wh-top-tabs .tab-item.active {
    background: var(--ti-primary); color: #fff; font-weight: bold;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
  }
  .wh-top-tabs .tab-item .icon { font-size: 14px; }
  @media (max-width: 768px) {
    .purchase-top-actions { display: none !important; }
    .purchase-home-tabs { padding-bottom: 4px; }
  }
  .card { background: var(--ti-white); border-radius: 14px; margin: 12px; padding: 16px; box-shadow: 0 1px 4px rgba(16,24,40,0.06); border: 1px solid rgba(16,24,40,0.04); }
  .btn { padding: 10px 20px; border-radius: 8px; font-size: 14px; cursor: pointer; border: none; text-align: center; transition: all .18s ease; }
  .btn-primary { background: var(--ti-primary); color: var(--ti-white); box-shadow: 0 2px 8px rgba(25,137,250,0.22); }
  .btn-primary:hover { background: var(--ti-primary-dark); box-shadow: 0 3px 12px rgba(25,137,250,0.32); }
  .btn-success { background: var(--ti-success); color: var(--ti-white); }
  .btn-success:hover { background: #06ad56; }
  .btn-warning { background: var(--ti-primary-light); color: var(--ti-white); }
  .btn-danger { background: #ee0a24; color: var(--ti-white); }
  .btn-danger:hover { background: #d40f23; }
  .btn-plain { background: var(--ti-white); color: var(--ti-text-2); border: 1px solid var(--ti-border); }
  .btn-plain:hover { border-color: var(--ti-primary); color: var(--ti-primary); }
  .input { width: 100%; padding: 10px 12px; border: 1px solid var(--ti-border); border-radius: 8px; font-size: 14px; box-sizing: border-box; transition: border-color .18s ease, box-shadow .18s ease; }
  .input:focus { outline: none; border-color: var(--ti-primary); box-shadow: 0 0 0 3px rgba(25,137,250,0.12); }
  .label { font-size: 14px; color: var(--ti-text-2); margin-bottom: 6px; font-weight: 500; }
  .tag { display: inline-block; padding: 3px 10px; border-radius: 6px; font-size: 12px; font-weight: 500; }
  .tag-blue { background: #e8f3ff; color: #3b82f6; }
  .tag-green { background: #e8f7ee; color: var(--ti-success); }
  .tag-orange { background: #fff3e8; color: var(--ti-primary-light); }
  .tag-red { background: #ffeaea; color: #ee0a24; }
  .tag-purple { background: #f3e8ff; color: #7c3aed; }
  .tag-gray { background: var(--ti-bg-gray); color: var(--ti-text-4); }
  .status-badge { padding: 3px 10px; border-radius: 12px; font-size: 12px; }
  .modal-mask { position: fixed; top:0; left:0; right:0; bottom:0; background: var(--ti-mask); z-index: 100; display: flex; align-items: center; justify-content: center; }
  .modal-box { background: var(--ti-white); border-radius: 16px; width: 90%; max-width: 400px; max-height: 80vh; overflow-y: auto; box-shadow: 0 16px 48px rgba(0,0,0,0.18); }
  .toast { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: rgba(0,0,0,0.75); color: var(--ti-white); padding: 10px 20px; border-radius: 8px; z-index: 99999; font-size: 14px; }
  .admin-layout { display: flex; min-height: 100vh; }
  .admin-sidebar { width: 200px; background: linear-gradient(180deg, #0e1d30 0%, #001529 100%); color: var(--ti-white); height: 100vh; position: fixed; left: 0; top: 0; display: flex; flex-direction: column; overflow: hidden; box-shadow: 2px 0 12px rgba(0,0,0,0.08); }
  .admin-menu-wrap { flex: 1; overflow-y: auto; }
  .admin-menu-wrap::-webkit-scrollbar { width: 4px; }
  .admin-menu-wrap::-webkit-scrollbar-thumb { background: var(--ti-text-1); border-radius: 2px; }
  .admin-sidebar .logout-item { margin-top: auto; border-top: 1px solid rgba(255,255,255,0.08); }
  .admin-menu-group-head { padding: 10px 14px 6px; color: #7a8ba3; font-size: 12px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; user-select: none; letter-spacing: .05em; }
  .admin-menu-group-head:hover { color: #d0d8e2; }
  .admin-menu-group-head .g-arrow { font-size: 11px; opacity: .7; }
  .admin-mobile-group-title { padding: 8px 16px 2px; font-size: 11px; color: #64748b; letter-spacing: .05em; }
  .admin-content { margin-left: 200px; flex: 1; padding: 20px; }
  .admin-menu-item { padding: 11px 14px; cursor: pointer; font-size: 14px; border-left: 3px solid transparent; margin: 3px 8px; border-radius: 8px; transition: all .18s ease; display: flex; align-items: center; }
  .admin-menu-item .menu-icon { width: 22px; text-align: center; margin-right: 8px; font-size: 15px; flex-shrink: 0; }
  .admin-menu-item.active .menu-icon { }
  .admin-menu-item:hover { background: rgba(255,255,255,0.07); }
  .admin-menu-item.active { background: linear-gradient(90deg, var(--ti-primary) 0%, var(--ti-primary-dark) 100%); border-left-color: var(--ti-primary-light); color: var(--ti-white); font-weight: 600; box-shadow: 0 3px 10px rgba(25,137,250,0.35); }
  .screen-bg { background: #050d19; color: var(--ti-white); min-height: 100vh; }
  .screen-card { background: rgba(16,32,52,0.6); border: 1px solid rgba(25,137,250,0.22); border-radius: 10px; padding: 16px; }
  .screen-title { font-size: 16px; font-weight: 500; margin-bottom: 12px; padding-left: 10px; border-left: 3px solid var(--ti-primary-light); }
  @media (max-width: 768px) {
    .admin-sidebar { display: none; }
    .admin-content { margin-left: 0; padding: 12px; }
  }
  /* 手机端响应式优化 */
  @media (max-width: 768px) {
    .admin-content .grid.grid-cols-4 { grid-template-columns: repeat(2, 1fr) !important; }
    .admin-content .grid.grid-cols-3 { grid-template-columns: repeat(2, 1fr) !important; }
    .admin-content table { display: block; overflow-x: auto; white-space: nowrap; }
    .admin-mobile-header { display: flex !important; }
    /* v3.3.1 全局手机适配：采购/业务/仓库等非 admin-content 容器 */
    .grid.grid-cols-4 { grid-template-columns: repeat(2, 1fr) !important; }
    .grid.grid-cols-3 { grid-template-columns: repeat(2, 1fr) !important; }
    #purchase-content table, #wh-sublist table, #cs-admin-area table { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
    #purchase-content .card, #wh-sublist .card { overflow-x: hidden; }
    /* v3.7.9 手机端管理页整体优化 */
    /* 库存统计卡片 6 列 → 2 列 */
    #inventory-stats { grid-template-columns: repeat(3, 1fr) !important; gap: 6px !important; }
    #inventory-stats > div { padding: 6px 8px !important; }
    #inventory-stats > div > div:first-child { font-size: 11px !important; }
    #inventory-stats > div > div:last-child { font-size: 15px !important; }
    /* 页面容器留白收紧（库存/商城等页 padding:20px → 12px） */
    .admin-mobile-body > div > div[style*="padding:20px"] { padding: 12px !important; }
    /* 页头标题栏：标题一行、按钮区一行可横滑 */
    .mob-page-head { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; margin-bottom: 14px !important; }
    .mob-page-head > h2 { font-size: 17px !important; }
    .mob-page-head > div { overflow-x: auto !important; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; }
    .mob-page-head > div::-webkit-scrollbar { display: none; }
    .mob-page-head > div > button, .mob-page-head > div > span, .mob-page-head > div > select { font-size: 12px !important; padding: 7px 10px !important; }
    /* 统计卡片数字防挤压 */
    #inventory-stats > div { min-width: 0; }
    /* 详情页字段表行距 */
    .admin-mobile-body table td { padding: 6px 8px !important; }
  }
  /* 采购等横向 tab 栏手机可滑动 */
  .m-tabs-scroll { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .m-tabs-scroll::-webkit-scrollbar { display: none; }
  .m-tabs-scroll button { white-space: nowrap; flex-shrink: 0; }
  .admin-mobile-header { display: none; position: sticky; top: 0; z-index: 50; background: #001529; color: var(--ti-white); padding: 12px 16px; align-items: center; justify-content: space-between; }
  .admin-mobile-header .menu-btn { font-size: 20px; cursor: pointer; background: none; border: none; color: var(--ti-white); }
  .admin-mobile-header .title { font-size: 16px; font-weight: bold; }
  .admin-mobile-menu { display: none; position: fixed; top: 0; left: 0; width: 250px; height: 100vh; background: #001529; color: var(--ti-white); z-index: 1000; overflow-y: auto; transform: translateX(-100%); transition: transform 0.3s; }
  .admin-mobile-menu.open { display: block; transform: translateX(0); }
  .admin-mobile-mask { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: var(--ti-mask); z-index: 999; }
  .admin-mobile-mask.open { display: block; }

/* 统计卡片子元素不拦截点击事件 */
.grid.grid-cols-4 .card > * {
  pointer-events: none;
}
.grid.grid-cols-4 .card {
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}
.grid.grid-cols-4 .card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(25,137,250,0.14);
}

/* ===== v2.13.1 商城高级版 + 移动端适配 ===== */
.mall-skel-img, .mall-skel-line { background: linear-gradient(90deg,var(--ti-bg-page-2) 25%,#e8ecf1 37%,var(--ti-bg-page-2) 63%); background-size: 400% 100%; animation: mallSkl 1.2s ease infinite; border-radius: 8px; }
@keyframes mallSkl { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
.mall-tabbar { display: none; }
.mall-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mall-out-mask { position: absolute; inset: 0; background: rgba(255,255,255,0.72); display: flex; align-items: center; justify-content: center; }
.mall-out-mask span { background: rgba(31,45,61,0.82); color: var(--ti-white); font-size: 12px; padding: 6px 16px; border-radius: 16px; letter-spacing: 0.12em; }
.mall-quick-grid > div > div:first-child { }
#mall-category-list > div.cat-active { background: var(--ti-info-bg) !important; color: var(--ti-primary) !important; border-left-color: var(--ti-primary) !important; font-weight: bold; }
@media (max-width: 768px) {
  /* 手机端：顶部文字导航隐藏，由底部 TabBar 承接 */
  .mall-topnav { display: none !important; }
  .mall-hero { padding: 22px 14px 18px !important; }
  .mall-hero .mall-hero-title { font-size: 21px !important; margin-bottom: 6px !important; }
  .mall-hero .mall-hero-sub { font-size: 12px !important; margin-bottom: 14px !important; }
  .mall-hero .mall-hero-emoji { display: none !important; }
  .mall-hero .mall-search-row { max-width: 100% !important; }
  .mall-hero .mall-hot-row { display: none !important; }
  /* 三栏 → 单栏 */
  .mall-body { display: block !important; padding: 12px !important; }
  .mall-aside-cats { width: 100% !important; margin-bottom: 12px; position: static !important; } /* v3.19.26 手机端不吸顶（用户反馈：上滑时分类卡钉在搜索框下，截断 chips 影响显示） */
  .mall-aside-right { display: none !important; }
  #mall-category-list { max-height: none !important; display: flex !important; overflow-x: auto !important; overflow-y: hidden !important; padding: 8px 10px !important; gap: 8px; -webkit-overflow-scrolling: touch; }
  #mall-category-list > div { flex: 0 0 auto !important; border-left: none !important; border-radius: 18px !important; padding: 7px 14px !important; font-size: 12px !important; border: 1px solid #eef0f3 !important; background: var(--ti-white) !important; }
  /* 快捷宫格紧凑化 */
  .mall-quick-grid { gap: 8px !important; margin-bottom: 12px !important; }
  .mall-quick-grid > div { padding: 12px 4px !important; border-radius: 10px !important; }
  .mall-quick-grid > div > div:first-child { font-size: 26px !important; margin-bottom: 4px !important; }
  /* 商品双列卡片 */
  #mall-parts-list { padding: 10px !important; }
  #mall-parts-list > div { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  #mall-parts-list .mall-card-img { height: 108px !important; }
  #mall-parts-list .mall-card-name { font-size: 13px !important; }
  #mall-pagination button { padding: 10px 18px !important; font-size: 14px !important; }
  /* 底部 TabBar */
  .mall-tabbar { display: flex !important; position: fixed; left: 0; right: 0; bottom: 0; z-index: 200; background: var(--ti-white); border-top: 1px solid #eef0f3; box-shadow: 0 -2px 12px rgba(0,0,0,0.06); padding: 6px 0 max(6px, env(safe-area-inset-bottom)); }
  .mall-tabbar .tab { flex: 1; text-align: center; font-size: 11px; color: var(--ti-text-3); cursor: pointer; }
  .mall-tabbar .tab .t-ico { font-size: 20px; line-height: 1.3; }
  .mall-tabbar .tab.on { color: var(--ti-primary); font-weight: bold; }
  .mall-tabbar .t-badge { position: relative; top: -8px; left: 2px; background: var(--ti-danger); color: var(--ti-white); border-radius: 9px; font-size: 11px; padding: 0 5px; display: none; }
  /* 详情页单列 */
  .mall-detail-main { flex-direction: column !important; padding: 14px !important; gap: 16px !important; }
  .mall-detail-imgcol { width: 100% !important; }
  .mall-detail-imgcol .mall-detail-bigimg { width: 100% !important; height: 300px !important; }
  /* ===== v3.18.24 淘宝/京东式移动端首页 ===== */
  /* ① 搜索栏置顶常驻（京东式：进页即见搜索框，不再等下滑才出现） */
  #mall-sticky-search { display: block !important; position: sticky; top: 0; }
  #mall-sticky-search span { display: none; } /* 隐藏返回箭头（已在页顶） */
  #mall-sticky-search input { font-size: 13px !important; }
  /* ② Hero 压成紧凑品牌行（大标题/副标题/搜索框让位给置顶搜索栏） */
  .mall-hero { padding: 12px 14px 14px !important; }
  .mall-hero .mallx-hero-title { font-size: 16px !important; gap: 8px !important; justify-content: center; }
  .mall-hero .mallx-hero-title img { width: 24px !important; height: 24px !important; border-radius: 6px !important; }
  .mall-hero .mall-hero-sub { display: none !important; }
  .mall-hero .mall-search-row { display: none !important; }
  /* ③ 金刚区：去卡片化 + 圆形彩色图标（淘宝式） */
  .mallx-quick { background: transparent !important; }
  .mallx-quick > div { background: transparent !important; border: none !important; box-shadow: none !important; padding: 4px 2px !important; }
  .mallx-quick > div:hover { transform: none !important; box-shadow: none !important; }
  .mallx-quick .ti-qicon { width: 48px !important; height: 48px !important; font-size: 23px !important; border-radius: 50% !important; margin: 0 auto 5px !important; box-shadow: 0 4px 12px rgba(0,0,0,.10); }
  .mallx-quick .qi-green { background: linear-gradient(135deg,#07c160,#5ad8a6) !important; }
  .mallx-quick .qi-red { background: linear-gradient(135deg,#ff4d4f,#ff7875) !important; }
  .mallx-quick .qi-blue { background: linear-gradient(135deg,#1989fa,#5cadff) !important; }
  .mallx-quick .qi-orange { background: linear-gradient(135deg,#ff9a3c,#ff6a00) !important; }
  .mallx-quick > div > div:nth-child(2) { font-size: 12px !important; }
  .mallx-quick > div > div:nth-child(3) { display: none !important; }
  /* ④ Banner 矮化 + 楼层横向卡收窄 */
  #mall-banner { height: 140px !important; border-radius: 12px !important; }
  .mallx-quick + #mall-banner { margin-top: 4px !important; }
}

/* ===== v3.0 Design System: 8 核心组件标准层（新代码优先复用，存量不动） ===== */
.ti-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ti-gap-xs);padding:9px 18px;border-radius:var(--ti-radius);border:1px solid transparent;font-size:14px;line-height:1;cursor:pointer;transition:opacity .15s,box-shadow .15s;white-space:nowrap;user-select:none}
.ti-btn:active{opacity:.82}
.ti-btn-primary{background:var(--ti-grad-primary);color:var(--ti-white);box-shadow:var(--ti-shadow-blue)}
.ti-btn-ghost{background:transparent;color:var(--ti-primary);border-color:var(--ti-primary)}
.ti-btn-danger{background:var(--ti-danger);color:var(--ti-white)}
.ti-btn-sm{padding:6px 12px;font-size:12px;border-radius:var(--ti-radius-sm)}
.ti-btn-lg{padding:13px 24px;font-size:16px}
.ti-btn[disabled]{opacity:.5;cursor:not-allowed}
.ti-card{background:var(--ti-white);border-radius:var(--ti-radius-lg);box-shadow:var(--ti-shadow-sm);padding:var(--ti-gap-lg)}
.ti-modal-mask{position:fixed;inset:0;background:var(--ti-mask);z-index:9998;display:flex;align-items:center;justify-content:center}
.ti-modal-panel{background:var(--ti-white);border-radius:var(--ti-radius-xl);box-shadow:var(--ti-shadow-modal);max-width:92vw;max-height:86vh;overflow:auto;padding:var(--ti-gap-xl)}
.ti-badge{display:inline-block;min-width:16px;height:16px;line-height:16px;padding:0 5px;border-radius:8px;background:var(--ti-danger);color:var(--ti-white);font-size:11px;text-align:center}
.ti-input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--ti-border);border-radius:var(--ti-radius);font-size:14px;color:var(--ti-text-2);background:var(--ti-white);outline:none;transition:border-color .15s,box-shadow .15s}
.ti-input:focus{border-color:var(--ti-primary);box-shadow:var(--ti-shadow-focus)}
.ti-table{width:100%;border-collapse:collapse;font-size:13px;color:var(--ti-text-2)}
.ti-table th{background:var(--ti-bg-hover);color:var(--ti-text-3);font-weight:500;text-align:left;padding:10px 12px;border-bottom:1px solid var(--ti-border-light);white-space:nowrap}
.ti-table td{padding:10px 12px;border-bottom:1px solid var(--ti-border-light)}
.ti-table tr:hover td{background:var(--ti-bg-fa)}
.ti-tag{display:inline-block;padding:2px 10px;border-radius:10px;font-size:12px;line-height:18px;background:var(--ti-info-bg);color:var(--ti-primary-dark)}
.ti-toast{position:fixed;left:50%;top:18%;transform:translateX(-50%);background:rgba(0,0,0,.78);color:var(--ti-white);padding:10px 18px;border-radius:var(--ti-radius);font-size:14px;z-index:10001;pointer-events:none;max-width:80vw;text-align:center}

.sos-layer{background:linear-gradient(135deg,#d93025,#e8710a);border-radius:14px;padding:14px 16px;display:flex;align-items:center;gap:12px;color:#fff;cursor:pointer;box-shadow:0 6px 16px rgba(217,48,37,.28);transition:transform .15s}
.sos-layer:active{transform:scale(.98)}
.home-grid8{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.home-grid8 .g-item{background:var(--ti-white);border-radius:12px;padding:12px 4px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;box-shadow:var(--ti-shadow-sm);transition:transform .15s;border:1px solid var(--ti-bg-page-2)}
.home-grid8 .g-item:active{transform:scale(.95)}
.home-grid8 .g-icon{font-size:24px;line-height:1}
.home-grid8 .g-label{font-size:12px;color:var(--ti-text-2)}
.home-grid8 .g-hero{background:var(--ti-grad-primary);border-color:transparent}
.home-grid8 .g-hero .g-label{color:var(--ti-white);font-weight:bold}
/* v3.8.154 快捷入口图标统一：浅色圆角底托 + 22px 图标，解决裸大 emoji 尺寸不一、重心偏移、上下留白不均 */
/* v3.8.163 微信式语音气泡：点击播放 + 波形动画 + 按时长伸缩，不再用原生 audio 控件 */
.vm-bubble{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.vm-bubble .vm-ico{display:inline-flex;align-items:flex-end;gap:3px;height:16px;flex-shrink:0}
.vm-bubble .vm-ico i{width:3px;height:6px;background:currentColor;border-radius:2px;opacity:.8;display:inline-block}
.vm-bubble.playing .vm-ico i{animation:vmWave .9s infinite ease-in-out}
.vm-bubble.playing .vm-ico i:nth-child(2){animation-delay:.15s}
.vm-bubble.playing .vm-ico i:nth-child(3){animation-delay:.3s}
@keyframes vmWave{0%,100%{height:6px}50%{height:15px}}
/* v3.8.166 微信式录音浮层：屏幕中间面板 + 麦克风 + 音量条 + 上滑取消 */
.vm-panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:168px;background:rgba(0,0,0,.74);border-radius:14px;padding:18px 14px 14px;text-align:center;color:#fff;z-index:10003;pointer-events:none;box-sizing:border-box}
.vm-panel .vm-row{display:flex;align-items:center;justify-content:center;gap:10px}
.vm-panel .vm-mic{width:26px;height:26px;display:flex;align-items:center;justify-content:center;flex:none}
.vm-panel .vm-vol{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:26px;flex:none}
.vm-panel .vm-vol i{width:3px;height:26px;background:#fff;border-radius:2px;opacity:.9;transform-origin:bottom;transform:scaleY(.28);display:inline-block}
.vm-panel .vm-sec{font-size:12px;opacity:.7;flex:none;min-width:24px;text-align:left}
.vm-panel .vm-hint{font-size:12px;opacity:.82;margin-top:12px;line-height:1.4}
.vm-panel.cancel{background:rgba(214,40,40,.88)}
.vm-panel.cancel .vm-hint{opacity:1;font-weight:bold}
.vm-panel.cancel .vm-vol{opacity:.3}
.ti-qicon{width:28px;height:28px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:14px;line-height:1;margin:0 auto 3px;flex:none;box-sizing:border-box}
.ti-qicon-inline{width:24px;height:24px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;line-height:1;flex:none;box-sizing:border-box}
.qi-blue{background:var(--ti-info-bg)}.qi-green{background:var(--ti-success-bg)}.qi-orange{background:#fff3e0}.qi-purple{background:#f3e8ff}.qi-red{background:#ffebee}.qi-gray{background:var(--ti-bg-page-2)}.qi-glass{background:rgba(255,255,255,.22)}
/* v3.19.35 bottom 改随 --gtab-h（JS 实测 tabbar 真实高度）：系统字体放大后 tabbar 实际
   高于 56px，写死 56px 会把进度条下半截压进 tabbar 里（安卓 WebView 吃系统字体缩放）。 */
.live-strip{position:fixed;left:50%;transform:translateX(-50%);bottom:var(--gtab-h, calc(56px + env(safe-area-inset-bottom, 0px)));width:min(92vw,480px);background:linear-gradient(135deg,#1f2937,#374151);color:var(--ti-white);border-radius:14px;padding:10px 14px;display:flex;align-items:center;gap:10px;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.25);z-index:60}
.live-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;flex:none;animation:liveBlink 1.2s infinite}
@keyframes liveBlink{0%,100%{opacity:1}50%{opacity:.3}}
.od-hero{background:linear-gradient(135deg,var(--ti-primary-dark),var(--ti-primary) 60%,var(--ti-primary-light));border-radius:14px;padding:18px 16px;color:var(--ti-white);margin-bottom:12px;position:relative;overflow:hidden}
.od-hero::after{content:'';position:absolute;right:-40px;top:-50px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.08)}
/* v3.18.75：右上角「转发」按钮占位（odHeroCard 里那颗 📤），避免长状态文案被压在按钮下面 */
.od-hero-big{font-size:20px;font-weight:bold;line-height:1.3;position:relative;z-index:1;padding-right:40px}
.od-hero-eta{font-size:12px;opacity:.88;margin-top:6px;position:relative;z-index:1;padding-right:40px}
.od-hero-no{display:inline-block;margin-top:10px;background:rgba(255,255,255,.16);border-radius:20px;padding:3px 12px;font-size:11px;position:relative;z-index:1}
.od-tl{display:flex;align-items:flex-start;position:relative;padding:6px 0 2px}
.od-tl .tl-step{flex:1;text-align:center;position:relative}
.od-tl .tl-step::before{content:'';position:absolute;top:9px;left:-50%;width:100%;height:2px;background:var(--ti-border-light)}
.od-tl .tl-step:first-child::before{display:none}
.od-tl .tl-dot{width:18px;height:18px;border-radius:50%;background:var(--ti-white);border:2px solid var(--ti-border);margin:0 auto 6px;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--ti-white)}
.od-tl .tl-step.done::before{background:var(--ti-primary)}
.od-tl .tl-step.done .tl-dot{background:var(--ti-primary);border-color:var(--ti-primary)}
.od-tl .tl-step.cur::before{background:var(--ti-primary)}
.od-tl .tl-step.cur .tl-dot{border-color:var(--ti-primary);box-shadow:0 0 0 4px var(--ti-info-bg)}
.od-tl .tl-label{font-size:11px;color:var(--ti-text-3)}
.od-tl .tl-step.done .tl-label,.od-tl .tl-step.cur .tl-label{color:var(--ti-primary);font-weight:bold}
.agent-card{display:flex;align-items:center;gap:12px;background:var(--ti-white);border-radius:12px;padding:12px 14px;box-shadow:var(--ti-shadow-sm);margin-bottom:12px;border:1px solid var(--ti-bg-page-2)}
.agent-avatar{width:44px;height:44px;border-radius:50%;background:var(--ti-info-bg);display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.od-actionbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(56px + env(safe-area-inset-bottom,0px));width:min(92vw,480px);background:var(--ti-white);border-radius:16px;padding:10px;display:flex;gap:10px;box-shadow:0 -4px 24px rgba(0,0,0,.12);z-index:61;align-items:center}
.od-actionbar .ab-btn{flex:1;padding:11px 0;border:none;border-radius:12px;font-size:14px;font-weight:bold;cursor:pointer}
.od-actionbar .ab-ghost{background:var(--ti-bg-hover);color:var(--ti-text-2)}
.od-actionbar .ab-pri{background:var(--ti-grad-primary);color:var(--ti-white)}
.od-actionbar .ab-pri[disabled]{opacity:.55;cursor:not-allowed}

/* ===== v3.32.8 配件订单详情底部操作栏 =====
   旧写法是 position:fixed + bottom:50px + 页面底部死占位 <div style="height:130px">。
   问题出在「fixed 的定位基准不一定是窗口」：祖先一旦有 transform/filter/will-change，
   fixed 就改为相对那个祖先定位 —— 宽屏桌面壳里底栏直接浮到页面中间，
   把「订单信息」那一屏文字压在底下（用户截图：下单/支付时间被盖住）。
   死占位也补不上：底栏只要往下挪一寸，占位就少一寸。
   现在改成 sticky：参与文档流，贴住可视区底部，但永远占据自己的位置、不吃掉内容。 */
.pod-actionbar{
  position:sticky; bottom:0; z-index:60;
  background:var(--ti-white);
  border-top:1px solid var(--ti-border-light);
  box-shadow:0 -4px 20px rgba(16,24,40,.08);
  padding:10px 12px;
  display:flex; gap:10px; align-items:center;
  margin-top:auto;   /* 内容比屏幕短时也贴在底部，而不是浮在内容后面 */
}
/* 让底栏在「内容不够长」时也能贴底：页面主体改成纵向 flex，内容区吃掉剩余高度 */
.pod-page{ display:flex; flex-direction:column; min-height:var(--app-100vh); }
.pod-page #parts-order-detail-content{ flex:1 1 auto; display:flex; flex-direction:column; }
/* 宽屏下按钮不再拉成一整条：限宽居中，和内容卡片对齐 */
.pod-actionbar .pod-inner{ width:100%; max-width:720px; margin:0 auto; display:flex; gap:10px; align-items:center; }
/* 底栏要贴住内容区左右边缘：抵掉 #parts-order-detail-content 的 14px 内边距。
   下边不抵 —— 下面留的那 14px 正好让 sticky 到顶时也不会顶到上一块卡片。 */
.pod-page #parts-order-detail-content > .pod-actionbar{
  margin-left:-14px; margin-right:-14px;
}

/* ===== v3.10.0 AI 客服「正在输入」三点动画 ===== */
@keyframes csBlink {
  0%, 80%, 100% { opacity: .25; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-2px); }
}

/* ==========================================================================
   v3.18.32 手机端页面结构统一：全局底部导航 + 滑动返回
   ========================================================================== */
/* ① v3.18.36：这里**不再**全局 contain。
   v3.18.32 曾给 html,body 加 overscroll-behavior-x:contain 想保住自建手势，
   结果把用户「原来一直正常」的系统原生边缘侧滑一起禁掉了 —— 那才是用户熟悉的返回方式。
   而 contain 只对真正的滚动容器生效，页面里大量 overflow-x 子容器照样会触发系统侧滑，
   于是变成「原生被禁 + 自建接不住」两头空。
   正确解法分两层：全局放开让原生侧滑回来（由 popstate 守卫兜住不退出），
   只在横向可滚的容器上 contain，避免横滑 tab 时被误判成返回手势。 */
html, body { overscroll-behavior-x: auto; overscroll-behavior-y: auto; }
.overflow-x-auto, [data-no-swipe], [data-swipe-ignore], .swiper,
.m-tabs-scroll, #mall-category-list, .wh-mobile-shell .tab-bar, .mob-page-head > div,
#purchase-content table, #wh-sublist table, .admin-content table {
  overscroll-behavior-x: contain;
}

/* ② 左边缘手势热区：touch-action:pan-y ⇒ 纵向滑动照常滚页面；
   v3.18.36 加宽到 34px 并提到 9500，减少被页面元素盖住的概率。
   注意：热区只是「补位」，原生侧滑恢复后即使热区被盖住也仍有系统手势可用。 */
#swipe-edge-zone {
  position: fixed; left: 0; top: 0; bottom: 0; width: 34px;
  z-index: 9500; touch-action: pan-y; background: transparent;
  -webkit-tap-highlight-color: transparent;
}
@media (min-width: 769px) { #swipe-edge-zone { display: none; } }

/* ③ 手势跟手反馈：拖动时整个 #app 跟着手指平移，松手不足距离则回弹 */
#app.swipe-dragging { transition: none !important; will-change: transform; }
#app.swipe-releasing { transition: transform .18s cubic-bezier(.22,.61,.36,1); }
.swipe-edge-hint {
  position: fixed; top: 0; bottom: 0; left: 0; width: 18px; z-index: 8999;
  pointer-events: none; opacity: 0;
  background: linear-gradient(to right, rgba(0,0,0,.22), rgba(0,0,0,0));
  transition: opacity .15s linear;
}

/* ④ 全局底部导航（手机端常驻；页面自带 tabbar 时不重复挂载） */
.gtabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9100;
  display: flex; background: var(--ti-white);
  border-top: 1px solid var(--ti-border-light);
  box-shadow: 0 -2px 12px rgba(16,24,40,.07);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.gtabbar .gt-item {
  flex: 1; text-align: center; padding: 6px 0 5px; cursor: pointer;
  color: var(--ti-text-4); font-size: 11px; line-height: 1.25;
  -webkit-tap-highlight-color: transparent; user-select: none;
}
.gtabbar .gt-item .gt-ico { font-size: 20px; line-height: 1.25; display: block; }
.gtabbar .gt-item.gt-on { color: var(--ti-primary); font-weight: 700; }
.gtabbar .gt-item.gt-on .gt-ico { transform: translateY(-1px); }
@media (min-width: 769px) { .gtabbar { display: none; } }
/* 挂了全局底导航的页面，内容区留出底部空间，避免最后一行被盖住 */
@media (max-width: 768px) {
  #app.has-gtabbar { padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)); }
}

/* v3.19.76 售后详情底部操作条（原为内联 style：bottom:0 + z-index:60）
   全局底导航 #gtabbar 挂在 document.body 上、z-index 9100，且跨页面常驻 —— 操作条被整条压在
   它下面，用户看到的现象就是「详情页底部被挡住了」：回复/抢单/确认流转这些按钮一个都点不到。
   口径：操作条永远浮在底导航**之上**（bottom 抬到底导航高度），桌面端底导航隐藏时回到 0。 */
.tk-actionbar {
  position: fixed; left: 0; right: 0; bottom: 0;
  background: var(--ti-white); border-top: 1px solid var(--ti-divider);
  padding: 10px 14px; gap: 8px; z-index: 9200;
  /* v3.19.94 按钮变多（确认发货 + 确认已送达·结案 + 回复 / 无需发货 / 关闭），窄屏必须换行，
     否则一排挤成 5 个 60px 的药丸，字全被截断。 */
  flex-wrap: wrap;
  box-shadow: 0 -4px 12px rgba(0, 0, 0, .06);
}
#app.has-gtabbar .tk-actionbar { bottom: calc(56px + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 769px) { .tk-actionbar { bottom: 0; } }

/* v3.20.12 桌面壳里的售后处理条：上面的 .tk-actionbar 是 left:0;right:0 的**全视口** fixed，
   一旦详情页被 _deskEnsureSidebar 包进 .admin-content，它就会横着压过左侧导航（盖住「退出登录」），
   还在页面中部挡住详情正文 —— 用户报的「售后工单内容乱了」就是这条。
   口径：处在管理端/桌面壳内容区里时，收成内容区内的 sticky 条：宽度跟着内容区、
   纵向只在内容区内贴底，不越界压侧栏。手机端（≤768px）不受影响，仍是全宽 fixed 操作条。 */
.admin-content .tk-actionbar {
  position: sticky; left: auto; right: auto; bottom: 0;
  margin: 14px 0 0; border: 1px solid var(--ti-divider); border-radius: 10px;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, .05); z-index: 60;
}
@media (max-width: 768px) {
  .admin-content .tk-actionbar {
    position: fixed; left: 0; right: 0; bottom: calc(56px + env(safe-area-inset-bottom, 0px));
    margin: 0; border-radius: 0; border: none; border-top: 1px solid var(--ti-divider); z-index: 9200;
  }
}

/* ==========================================================================
   v3.18.34 可见返回键兜底：手势在部分 ROM / 企业微信 WebView 里会被系统侧滑抢走，
   这里给一枚常驻的半透明返回键（左侧中部，避开页面自带顶栏与底部导航），
   点击走的是与手势完全相同的 appGoBack()，不会退出 APP。
   ========================================================================== */
.gtback {
  position: fixed; left: 6px; top: 56%; z-index: 8900;
  width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(16, 24, 40, .42); color: #fff;
  font-size: 18px; line-height: 1; font-weight: 700;
  backdrop-filter: blur(2px);
  -webkit-tap-highlight-color: transparent; user-select: none; cursor: pointer;
}
.gtback:active { background: rgba(16, 24, 40, .62); }
@media (min-width: 769px) { .gtback { display: none; } }

/* ==========================================================================
   v3.18.75 应用内图片查看器：多图翻页 + 双击放大。
   硬性约定 —— 这是 APP 里唯一允许显示大图的地方，任何 window.open(url) 都会把用户
   甩到系统浏览器（=「跳转到其他应用」），已在 viewImg() 里统一改道到这里。
   z-index 必须高于所有业务弹窗（uiDialog 用 10050），同时 ≥50 以便物理返回键
   优先关闭它（见 _closeTopOverlay / _ivBackClose）。
   ========================================================================== */
#app-img-viewer { position: fixed; inset: 0; z-index: 10060; background: #000; display: flex; flex-direction: column; }
#app-img-viewer .iv-head { flex: none; height: 52px; display: flex; align-items: center; justify-content: space-between; padding: 0 8px 0 16px; color: #fff; }
#app-img-viewer .iv-count { font-size: 14px; letter-spacing: .04em; opacity: .92; }
#app-img-viewer .iv-close { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 22px; cursor: pointer; border-radius: 50%; }
#app-img-viewer .iv-close:active { background: rgba(255,255,255,.16); }
#app-img-viewer .iv-stage { flex: 1; min-height: 0; position: relative; overflow: hidden; }
#app-img-viewer .iv-pan { position: absolute; inset: 0; overflow: hidden; }
#app-img-viewer .iv-pan > img { width: 100%; height: 100%; object-fit: contain; display: block; }
/* 放大态：容器变成可滚动视口，图片拉到 2.5 倍，手指拖动即可平移（看型号/签名细节） */
#app-img-viewer .iv-pan.zoomed { overflow: auto; -webkit-overflow-scrolling: touch; }
#app-img-viewer .iv-pan.zoomed > img { width: 250%; height: 250%; object-fit: contain; }
#app-img-viewer .iv-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 64px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 34px; line-height: 1; cursor: pointer; user-select: none; background: rgba(255,255,255,.08); border-radius: 10px; z-index: 3; }
#app-img-viewer .iv-prev { left: 8px; }
#app-img-viewer .iv-next { right: 8px; }
#app-img-viewer .iv-foot { flex: none; padding: 10px 16px calc(14px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: center; gap: 8px; color: rgba(255,255,255,.72); }
#app-img-viewer .iv-dots { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; max-width: 100%; }
#app-img-viewer .iv-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.32); cursor: pointer; }
#app-img-viewer .iv-dot.on { background: #fff; transform: scale(1.35); }
#app-img-viewer .iv-tip { font-size: 11px; opacity: .6; }
#app-img-viewer .iv-done { margin-top: 2px; padding: 7px 26px; border-radius: 18px; border: 1px solid rgba(255,255,255,.34); font-size: 13px; cursor: pointer; }
#app-img-viewer .iv-done:active { background: rgba(255,255,255,.14); }
#app-img-viewer .iv-stage { padding-top: env(safe-area-inset-top); }

/* ==========================================================================
   v3.18.75 手机端统一去除可见后退按钮
   返回能力已有三套（系统侧滑 / 物理返回键 / APP 端原生返回），页头那颗「← 返回」和
   左侧悬浮圆钮变成纯装饰性噪音。凡是带 .page-back-btn 的一律不渲染。
   ⚠️ 这里是「隐藏」而非删除：万一将来某 ROM 手势再次失效，删掉这一段 CSS 就能全部回来。
   ========================================================================== */
@media (max-width: 768px) {
  .page-back-btn { display: none !important; }
  #gtback { display: none !important; }
}

/* ==========================================================================
   v3.18.39 电脑端桌面布局：师傅 / 客户 / 客服此前只有手机版壳（顶部条 + 底部 tab-bar），
   宽屏下铺满整屏观感就是「手机界面」。这里给宽屏套 .admin-layout 骨架（CSS 已内置，
   ≤768px 自动收起侧栏），并修正几处按手机版尺寸写死的高度/留白。
   ========================================================================== */
@media (min-width: 769px) {
  /* 桌面壳内不再有手机版顶栏与底部 tab 栏，去掉为它们预留的留白 */
  #desk-content .pb-20 { padding-bottom: 0 !important; }
  /* 客服会话面板原本按「手机顶栏 60 + 底栏 62」算高，桌面壳里要按内容区实际可用高度。
     v3.19.13：190px 扣得过多（实际只耗掉 20*2 内容区 padding + ~40 标题行），对话区被压矮，
     这里按实测量改为 116px，同样的窗口能多看到 3~4 条消息。 */
  #desk-content .cs-home-embed > div { height: calc(100vh - 116px) !important; }
  /* 桌面下不再渲染手机底导航（若某页面仍自带，直接收掉，避免出现第二套导航） */
  #desk-content > .tab-bar, #desk-content .tab-bar.wh-mobile-shell { display: none !important; }
}

/* ==========================================================================
   v3.19.13 客服工作台会话列表瘦身：原写死 300px，会话项三行（名+脱敏电话+角色标签 /
   最后消息 / 状态·时间），一屏只放得下 6~7 个会话，右侧对话区也被挤窄。
   · 列表宽度 300 → 248（窄屏递减，手机上照样能显示名字和最后一句）
   · 会话项改两行，详情（电话 / 状态）移到 title 悬浮与聊天头部
   ========================================================================== */
.cs-wb-side { width: 248px; flex-shrink: 0; }
@media (max-width: 1024px) { .cs-wb-side { width: 210px; } }

/* v3.19.14：≤768px 走「列表态 ↔ 聊天态」两段式，不再左右分栏
   列表态（默认）：列表铺满，聊天区让位；聊天态（选中会话后加 .cs-wb-chat）：反过来。
   用 !important 压住 switchCsWbTab 里内联的 style.display —— 否则 JS 一赋值就把
   手机端的显隐重新抢回去（内联优先级高于普通 CSS）。 */
@media (max-width: 768px) {
  #cs-wb-root > .cs-wb-side { width: 100% !important; border-right: none !important; }
  #cs-wb-root:not(.cs-wb-chat) > #cs-chat-area,
  #cs-wb-root:not(.cs-wb-chat) > #im-chat-area { display: none !important; }
  #cs-wb-root.cs-wb-chat > .cs-wb-side { display: none !important; }
  #cs-wb-root.cs-wb-chat > #cs-chat-area,
  #cs-wb-root.cs-wb-chat > #im-chat-area { display: flex !important; flex: 1 1 auto !important; min-width: 0 !important; }
}

/* ==================== v3.19.16 手机端客服工作台：AI 内容推荐快捷条 ====================
   桌面端右侧有常驻「AI 助手栏」，手机上没有那个位置 ⇒ 坐席完全看不到能推什么。
   快捷条只在窄屏出现（桌面保持 inline 的 display:none），按钮排也允许换行，
   否则 6 个按钮挤在 375px 上会把输入框挤没。 */
@media (max-width: 768px) {
  #cs-kb-chips { display: flex !important; }
  .cs-input-row { flex-wrap: wrap; }
  .cs-input-row > input { min-width: 120px; }
}

/* v3.22.3 让位：右下角「🎨 主题球」原来正好压在「发送」按钮上（窄屏 right:14/bottom:72，
   桌面 ≥1024px 时 right:24/bottom:24，两档都压）。给输入区补右内边距把按钮左推，
   球本身位置不动 —— 只影响客服工作台的输入栏，其他页面不受牵连。 */
#cs-chat-input { padding-right: 60px !important; }

/* ==================== v3.19.17 手机端维保管理：工具条竖排 ====================
   桌面版是「3 个 tab + 180px 搜索框 + 新增 + 刷新」一行 flex，375px 上换行后东倒西歪。
   窄屏改成竖排：tab 一行，搜索+按钮一行，搜索框吃满宽度。 */
@media (max-width: 768px) {
  .maint-toolbar { flex-direction: column; align-items: stretch !important; }
  .maint-toolbar > div:last-child { flex-wrap: wrap; }
  #maint-keyword { width: 100% !important; }
}
/* 师傅计件结算：桌面 3 列汇总卡在 375px 上每格只剩 ~110px，24px 数字会挤爆 ⇒ 窄屏改 2+1 布局 */
@media (max-width: 768px) {
  .settle-sum-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; margin-bottom: 12px !important; }
  .settle-sum-grid > div { padding: 12px !important; }
  .settle-sum-grid > div > div:last-child { font-size: 20px !important; }
  .settle-sum-grid > div:last-child { grid-column: span 2; }
}

/* ==================== v3.19.18 手机端「系统设置」页 ====================
   设置页没有表格，只有十几张配置卡竖排 —— 真正挤的是 tailwind 的双列表单（grid-cols-2）
   与 p-6 大内边距：375px 上两个输入框各只剩 ~150px，placeholder 全被截断。
   这里用作用域类 .adm-settings-m 收成单列并收窄内边距，不动任何 JS 结构。
   ⚠️ 必须带 !important：tailwind 是运行时注入的类（.p-6 / .grid-cols-2），
   普通 CSS 权重相同且顺序不确定，不带 !important 会被随机覆盖。 */
@media (max-width: 768px) {
  .adm-settings-m { padding: 12px !important; border-radius: 8px !important; }
  .adm-settings-m .space-y-6 > * + * { margin-top: 12px !important; }
  .adm-settings-m .border.rounded-lg { padding: 12px !important; border-radius: 8px !important; }
  .adm-settings-m .grid { grid-template-columns: 1fr !important; }
  .adm-settings-m .grid-cols-2 { grid-template-columns: 1fr !important; }
  .adm-settings-m .grid-cols-3 { grid-template-columns: 1fr !important; }
  .adm-settings-m .input, .adm-settings-m input.input { font-size: 14px !important; padding: 10px 12px !important; }
  .adm-settings-m .btn { padding: 11px 14px !important; font-size: 14px !important; }
  /* 设置页里偶发的横向按钮组（如「打开配置 / 快捷回复 / 常见问题」）窄屏竖排更好点 */
  .adm-settings-m .flex.gap-2.flex-wrap > button { flex: 1 1 100% !important; }
}