/* MHTB-LOGIN-V2-20261103 · 登录/注册弹窗整体优化（CSS）
 * 目标：一屏放得下（不滚动）、默认即扫码、动作按钮明确、文案不分系统。
 * 变量沿用站点既有 --xia-color-* 令牌，避免硬编码色值。
 */
.mhtb-mask.mhtb-v2{ padding:12px; }
.mhtb-mask.mhtb-v2 .mhtb-modal{
  max-width:420px; width:100%;
  max-height:calc(100dvh - 24px);
  display:flex; flex-direction:column; overflow:hidden;
}
.mhtb-mask.mhtb-v2 .mhtb-body{
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:18px 18px 20px;
}
/* MHTB-V4-20261104（老牛第3条）：服务号二维码卡片**整体露出来**
   ⇒ 卡片从可滚动的 body 里挪出来，作为 modal 的固定底栏，永不被截断。
   （body 改为 flex 列：内容区可滚，卡片固定在底部） */
.mhtb-mask.mhtb-v2 .mhtb-modal{ display:flex; flex-direction:column; }
.mhtb-mask.mhtb-v2 .mhtb-body{ flex:1 1 auto; min-height:0; }
.mhtb-mask.mhtb-v2 .mhtb-v2-followbar{
  flex:none; padding:8px 16px 10px; border-top:1px solid var(--xia-color-neutral-200);
  background:var(--xia-color-neutral-0);
}
/* 关闭按钮固定右上，滚动时不跟着走 */
.mhtb-mask.mhtb-v2 .mhtb-x{
  position:absolute; top:8px; right:10px; z-index:3;
  width:34px; height:34px; line-height:1; font-size:20px;
  border:none; background:transparent; cursor:pointer;
  color:var(--xia-color-neutral-700);
}
/* 页签 */
.mhtb-mask.mhtb-v2 .mhtb-tabs{
  display:flex; border:1px solid var(--xia-color-neutral-200);
  border-radius:8px; overflow:hidden; margin:0 0 16px; font-size:13px;
}
.mhtb-mask.mhtb-v2 .mhtb-tabs span{
  flex:1; text-align:center; padding:9px 0; cursor:pointer;
  color:var(--xia-color-neutral-900); background:transparent;
}
.mhtb-mask.mhtb-v2 .mhtb-tabs span.on{
  background:var(--xia-color-primary-btn); color:var(--xia-color-neutral-0); font-weight:500;
}
/* 扫码区 */
.mhtb-v2-qr{ text-align:center; }
.mhtb-v2-qr h3{ margin:0 0 2px; font-size:15px; font-weight:500; color:var(--xia-color-neutral-900); }
.mhtb-v2-qr .steps{
  margin:0 0 12px; padding:0; list-style:none;
  font-size:13px; line-height:1.65; color:var(--xia-color-neutral-700);
}
.mhtb-v2-qr .steps li{ margin:0; }
.mhtb-v2-qr .qrbox{
  display:flex; justify-content:center; margin:0 0 8px;
}
.mhtb-v2-qr .qrbox img{
  width:180px; height:180px; object-fit:contain;
  border-radius:10px; border:1px solid var(--xia-color-neutral-200);
  background:var(--xia-color-neutral-0);
}
/* 动作按钮 */
.mhtb-v2-acts{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.mhtb-v2-acts button, .mhtb-v2-acts a{
  flex:1 1 auto; min-width:132px; text-align:center;
  padding:10px 14px; border-radius:8px; font-size:13px; cursor:pointer;
  border:1px solid var(--xia-color-primary-btn);
  background:var(--xia-color-primary-btn); color:var(--xia-color-neutral-0);
  text-decoration:none; line-height:1.4;
}
.mhtb-v2-acts .ghost{
  background:transparent; color:var(--xia-color-primary-btn);
}
.mhtb-v2-state{
  margin:10px 0 0; min-height:18px; text-align:center;
  font-size:12px; color:var(--xia-color-neutral-600);
}
.mhtb-v2-state.ok{ color:var(--xia-color-success); font-weight:500; }
/* 兜底提示（统一文案，不提系统） */
/* MHTB-V4-20261104：二维码下方的「长按二维码图片」提示（不可点击的说明文字，非按钮） */
.mhtb-v2-hint{
  margin:8px 0 0; padding:7px 12px; border-radius:8px;
  background:#EFF6FF; border:1px solid var(--xia-color-info-200);
  font-size:13px; line-height:1.55; text-align:center;
  color:#1E40AF; user-select:none; -webkit-user-select:none;
  cursor:default;
}
.mhtb-v2-hint b{ font-weight:600; color:#1D4ED8; }

/* MHTB-V3-20261104（老牛 2026-11-04 指令）：两段文案合并到底部**黄色警示框** */
.mhtb-v2-tip{
  margin:8px 0 0; padding:9px 11px; border-radius:8px; text-align:left;
  background:#FEF3C7;                       /* 警示黄底 */
  border:1px solid var(--xia-color-warning);                /* 琥珀描边 */
  font-size:12.5px; line-height:1.65; color:#78350F;
}
/* MHTB-V4-20261104：步骤列表（显式序号，不用 ol 自动编号 —— 会被父级 list-style 影响） */
.mhtb-v2-tiplist{ margin:0; text-align:left; }
.mhtb-v2-tiplist > div{
  margin:0 0 2px; padding-left:0; line-height:1.55;
}
.mhtb-v2-tiplist > div:last-child{ margin-bottom:0; }
.mhtb-v2-tip{ line-height:1.55; }
.mhtb-v2-tip p{ margin:0; }
.mhtb-v2-tip b{ font-weight:600; color:var(--xia-color-warning-800); }

/* MHTB-V3-20261104：服务号二维码块（老牛第3条要求恢复）—— 手机端也常显。
   注意：父容器 .mhtb-v2-qr 是 text-align:center，flex 子项必须显式 min-width:0，
   否则文字会被压成竖排（实测过）。 */
.mhtb-v2-follow{
  display:flex; gap:10px; align-items:center; justify-content:flex-start;
  width:100%; box-sizing:border-box; text-align:left;
  margin:10px 0 0; padding:8px 10px; border:1px solid var(--xia-color-neutral-200);
  border-radius:8px; background:var(--xia-color-neutral-0);
}
.mhtb-v2-gzhqr{
  width:52px; height:52px; object-fit:contain; flex:none; cursor:zoom-in;
  background:var(--xia-color-neutral-0); border-radius:4px; display:block;
}
.mhtb-v2-followtxt{
  flex:1 1 auto; min-width:0; width:0;           /* width:0 + flex 让文字正常横向排 */
  font-size:12px; line-height:1.55; word-break:keep-all; overflow-wrap:break-word;
  color:var(--xia-color-neutral-600);
}
.mhtb-v2-followtxt b{ color:var(--xia-color-neutral-900); }
/* 手机端隐藏服务号关注引导块（省高度，且它不是登录必需） */
@media (max-width:640px){
  /* MHTB-V3-20261104：服务号二维码块不再隐藏（老牛要求恢复） */
  .mhtb-mask.mhtb-v2 .mhtb-body{ padding:16px 14px 18px; }
  .mhtb-v2-gzhqr{ width:48px; height:48px; }
  .mhtb-v2-qr .qrbox img{ width:140px; height:140px; }
  /* MHTB-COPY-20261104：文案变长后 360×780 溢出 6px ⇒ 二维码 168→152px（仍足够扫描） */
  .mhtb-v2-qr .qrbox img{ width:140px; height:140px; }
}
/* 极矮屏（键盘弹出后）再收一收 */
@media (max-height:520px){
  .mhtb-v2-qr .qrbox img{ width:124px; height:124px; }
  .mhtb-v2-qr .steps{ font-size:12px; line-height:1.6; margin-bottom:10px; }
  .mhtb-v2-tip{ margin-top:8px; padding:7px 9px; }
}

/* 浮球遮挡修复：登录/注册弹窗是模态，客服悬浮球压在它上面会遮住提示文案
   （实测截图：右下紫球压住「…发到微信里点开，一步完成登录」）。
   ⇒ 弹窗打开期间隐藏浮球，关闭后由 JS 还原。 */
body.mhtb-login-open .mhcs-wrap,
body.mhtb-login-open .mh-askdudu,
body.mhtb-login-open .mhcs-panel{ display:none !important; }

/* ===== MHTB-V3-20261104 · 覆盖 topbar.js 的 .mhtb-modal img{width:210px} =====
   topbar.js 第 97 行那条规则会命中 v2 弹窗内**每一个 img**，
   导致服务号二维码被撑到 210px、旁边文字被挤成竖排（实测 gzhqr=210px / textW=14px）。
   ⇒ v2 用更精确的选择器 + !important 锁定尺寸。 */
.mhtb-mask.mhtb-v2 .mhtb-v2-gzhqr{
  width:46px !important; height:46px !important; flex:none !important;
  object-fit:contain !important; display:block !important; cursor:zoom-in;
}
.mhtb-mask.mhtb-v2 .mhtb-v2-follow{
  display:flex !important; gap:9px; align-items:center; justify-content:flex-start;
  width:100% !important; box-sizing:border-box; text-align:left;
  margin:10px 0 0; padding:7px 9px; border:1px solid var(--xia-color-neutral-200);
  border-radius:8px; background:var(--xia-color-neutral-0);
}
.mhtb-mask.mhtb-v2 .mhtb-v2-followtxt{
  flex:1 1 auto !important; min-width:0 !important; width:auto !important;
  font-size:12px; line-height:1.55; word-break:keep-all; overflow-wrap:break-word;
  color:var(--xia-color-neutral-600);
}
.mhtb-mask.mhtb-v2 .mhtb-v2-qr .qrbox img{
  width:140px !important; height:140px !important; object-fit:contain;
  display:block; margin:0 auto;
}
@media (max-width:640px){
  .mhtb-mask.mhtb-v2 .mhtb-v2-gzhqr{ width:44px !important; height:44px !important; }
  .mhtb-mask.mhtb-v2 .mhtb-v2-qr .qrbox img{ width:124px !important; height:124px !important; }
}
@media (max-height:520px){
  .mhtb-mask.mhtb-v2 .mhtb-v2-qr .qrbox img{ width:124px !important; height:124px !important; }
}