/* ============================================================================
   得应盯 · H5 移动端样式层（v1.11.152 M-H5）
   ----------------------------------------------------------------------------
   站长口径：「我的 H5 端 我想重置 简化 一目了然」。
   本站**没有独立 H5**（一套模板 + 响应式），所以"重置"= 给手机做一层专属样式：
   桌面版一切不动，只在 ≤860px 时替换/隐藏部分元素。

   为什么单独一个文件、且放在所有样式之后（见 tpl/_layout_top.php 最后一行）：
   首页还会额外加载 redesign.css（里面有它自己的移动断点），
   写在 theme.css 里会被后加载的 redesign.css 同权重覆盖 —— 这份必须最后加载才能赢。

   先量后改（390px 真机尺寸实测，2026-09-18）：
     · 首页总高 11249px ≈ 13 屏 —— 桌面 16 个区块原样竖着堆下来
     · 头部 142px 高（顶栏 + 主头部 + 11 个频道链接换行）
     · 没有底部导航；语言切换按钮 28px（拇指点不到）
   三件事：
     ① 头部收成一行 56px（站名 + 搜索 + 语言），频道改横向滑动一行
     ② 新增底部标签栏五项（首页 / 供应 / 求购 / 发布 / 我的）
     ③ 首页只留"能找货、能下单"的区块；桌面密集区在手机上隐藏
        （用 display:none —— 元素仍在 HTML 里，爬虫照读，不影响 SEO 收录）
   ============================================================================ */

/* 移动专用元素：桌面端一律不显示（不占位、不影响桌面版排版） */
.m-head,.m-tabbar,.m-quick{display:none}

@media (max-width:860px){

  /* 给固定底部标签栏留出安全高度（含 iPhone 底部横条） */
  body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}

  /* ── ① 头部 ───────────────────────────────────────────────────────────── */
  .hp-top,.hp-head{display:none}

  .m-head{
    display:flex;align-items:center;gap:var(--s-2);
    position:sticky;top:0;z-index:60;height:56px;
    padding:0 var(--s-4);background:var(--paper);border-bottom:1px solid var(--line);
  }
  .m-logo{flex:0 0 auto;font-size:17px;font-weight:800;color:var(--t1);text-decoration:none;white-space:nowrap}
  .m-search{
    flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:2px;
    background:#f1f5f4;border:1px solid var(--line);border-radius:var(--r-pill);
    padding:0 4px 0 var(--s-3);
  }
  .m-search input{flex:1 1 auto;min-width:0;height:38px;border:0;background:transparent;font-size:14px;color:var(--t1);outline:none}
  .m-search button{
    flex:0 0 auto;width:36px;height:36px;border:0;background:transparent;color:var(--g-700);
    display:grid;place-items:center;cursor:pointer;
  }
  .m-lang{flex:0 0 auto;position:relative}
  .m-lang summary{list-style:none;width:40px;height:40px;display:grid;place-items:center;color:var(--t2);cursor:pointer}
  .m-lang summary::-webkit-details-marker{display:none}
  .m-lang .ic{width:22px;height:22px}
  .m-langmenu{
    position:absolute;inset-inline-end:0;top:46px;z-index:70;min-width:150px;max-width:min(240px,calc(100vw - 16px));
    max-height:62vh;overflow:auto;
    background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-2);padding:6px;
  }
  .m-langmenu a{display:block;padding:10px 12px;border-radius:var(--r-sm);font-size:14px;color:var(--t1);text-decoration:none}
  .m-langmenu a.on{background:var(--g-50);color:var(--g-700);font-weight:700}

  /* 频道导航：11 个链接不再换行堆高，改成一行横向滑动（比塞进汉堡更"一目了然"） */
  .hp-nav{position:sticky;top:56px;z-index:55;background:var(--paper);border-bottom:1px solid var(--line)}
  .hp-nav .hpin{
    display:flex;gap:6px;overflow-x:auto;padding:6px var(--s-4);
    white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .hp-nav .hpin::-webkit-scrollbar{display:none}
  .hp-nav a{
    flex:0 0 auto;padding:8px 13px;border-radius:var(--r-pill);
    background:#f4f7f6;border:1px solid transparent;font-size:13.5px;text-decoration:none;
  }
  .hp-nav a.on{background:var(--g-600);border-color:var(--g-600);color:#fff}
  .hp-nav .hpsvc{display:none}          /* 三个服务徽标：手机上省掉，页脚与详情页都有 */

  /* ── ③ 首页：只留"能找货、能下单"的（★ v1.11.157 H5Only）─────────────────
     站长口径：「我的 PC 版本不动 就是单独的 H5 版面简化」——所以桌面版一个像素不动，
     手机上直接把首页的"营销块"整块藏掉，只留：六板块宫格 + 精选供应 + 实时供需 + 页脚。
     藏掉的三块：hero（定位文案/四免/两个大按钮）、信任条（免费发布·实名·审核）、
     入驻 CTA。它们仍在 HTML 里（爬虫照读、H1 也还在），只是手机屏上不占地方。 */
  .hero,.trust{display:none}
  .m-hide{display:none}

  /* 板块宫格：4×2，一屏内点得到所有板块。
     ★ 轨道必须写 minmax(0,1fr) 而不是 1fr —— `1fr` 的最小值是 auto（= 内容的 min-content），
     而宫格文字在别的语种（如乌尔都语）里很长，会把轨道撑到 121px×4 = 504px，
     直接把手机页面撑出横向滚动（实测 scrollWidth 504 vs 视口 375）。 */
  .m-quick{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-2);
    padding:var(--s-3) var(--s-4) var(--s-4);
  }
  .m-quick a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;
    min-height:64px;padding:8px 4px;text-decoration:none;
    background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);color:var(--t1);
  }
  .m-quick .ic{width:22px;height:22px;color:var(--g-700);flex:0 0 auto}
  .m-quick b{font-size:11.5px;font-weight:600;line-height:1.25;text-align:center;overflow-wrap:anywhere}

  /* 供应精选：手机上只出前 4 条（其余交给"查看全部"，避免首页被 8 张卡拉到十几屏） */
  .goods{grid-template-columns:1fr}
  .goods .good:nth-child(n+5){display:none}

  /* 实时需求·好活·好货：手机上只留第一块（求购），另外两块在频道导航里都有入口 */
  .tri .panel:nth-child(n+2){display:none}

  /* 区块标题：桌面是"左标题 + 右链接"横排，手机上改成上下，避免链接被挤掉 */
  .sec-hd{flex-direction:column;align-items:flex-start;gap:var(--s-2)}
  .sec-hd h2{font-size:var(--fs-18)}
  .sec{padding:var(--s-6) 0}

  /* ── ② 底部标签栏 ─────────────────────────────────────────────────────── */
  .m-tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:80;
    background:var(--paper);border-top:1px solid var(--line);
    padding:4px 0 calc(4px + env(safe-area-inset-bottom));
    box-shadow:0 -2px 12px rgba(0,0,0,.04);
  }
  .m-tabbar a{
    flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
    min-height:44px;text-decoration:none;color:var(--t3);-webkit-tap-highlight-color:transparent;
  }
  .m-tabbar .ic{width:20px;height:20px;flex:0 0 auto}
  .m-tabbar b{max-width:100%;font-size:10.5px;line-height:1.2;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .m-tabbar a.on{color:var(--g-700)}
  .m-tabbar a.on .ic{color:var(--g-700)}

  /* 触达尺寸：主按钮一律 ≥44px（原来语言切换只有 28px、频道链接 34px） */
  .btn{min-height:44px}
  .hp-nav a{min-height:36px}
  .m-quick a,.m-tabbar a{min-height:50px}

  /* 列表/详情：手机上别让长英文或表格把页面撑出横向滚动 */
  .wrap,.hpin{overflow-wrap:anywhere}
  table.mc-tb{display:block;overflow-x:auto}

  /* ── 页脚压缩 ───────────────────────────────────────────────────────────
     实测手机上页脚占 1389px（免责声明 188 + 链接区 934 + 语言与版权 267），
     是首页总高的三成 —— 但页脚是"要有时不必抢眼"的东西，收成两列小字即可。
     免责声明保留（合规），只压字号与行距。 */
  .hp-footer{padding:var(--s-6) 0 var(--s-4)}
  .hp-footer .hpin{grid-template-columns:1fr 1fr;gap:var(--s-4) var(--s-5)}
  .hp-footer h4{font-size:13px;margin-bottom:var(--s-1)}
  .hp-footer a{display:block;font-size:12.5px;line-height:1.5;padding:2px 0}
  .hp-footer .fx-api-hd{font-size:11px}
  .hp-disc{margin-top:var(--s-4);padding:var(--s-3) var(--s-4);font-size:11.5px;line-height:1.65}
  .hp-disc b{font-size:12.5px}
  .hp-fbottom{margin-top:var(--s-4);padding-top:var(--s-3);font-size:11.5px;line-height:1.7}
  .hp-flangs{gap:var(--s-2) var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-2)}
  .hp-flangs a{font-size:11.5px;padding:1px 0}

  /* 商品卡：手机上把内外边距各收一档（186px 的卡在窄屏上是满宽，收一档能多露半张卡） */
  .good{padding:var(--s-3)}
  .good-t{font-size:13.5px}

  /* ── v1.11.155 CleanHome：首页（干净入口页）在手机上的收法 ────────────────
     搜索区：三个控件竖排、每个 48px（一行塞下拉+输入+按钮在 390px 下会挤成一条缝）；
     板块入口：6 个 → 3×2（用 minmax(0,1fr)，别再被长语种标签撑出横向滚动）；
     两块列表：沿用 .cards.cards6 的移动端规则（≤620px 单列）。 */
  .ch-top{padding:var(--s-6) 0 var(--s-5)}
  .ch-h1{font-size:var(--fs-18);margin-bottom:var(--s-4)}
  .ch-search{flex-direction:column;gap:var(--s-2);background:transparent;border:0;box-shadow:none;border-radius:0}
  .ch-search select,
  .ch-search input,
  .ch-search button{
    width:100%;height:48px;border:1px solid var(--line);border-radius:var(--r-md);font-size:15px;
  }
  .ch-search select{border-inline-end:1px solid var(--line)}
  .ch-search input{background:var(--paper)}
  .ch-search button{justify-content:center}
  .ch-boards{padding:var(--s-4) 0 0}
  .ch-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2)}
  .ch-card{padding:var(--s-4) var(--s-2);min-height:84px}
  .ch-card .ic{width:22px;height:22px}
  .ch-card b{font-size:var(--fs-14)}
  .ch-sec{padding:var(--s-6) 0 0}
}