/* SMH-LOGIN-FORM V2 · 登录页形态层（渠道② · T5 解耦产物 · 2026-10-10 夜）
 *
 * 【载体纪律（治理件：docs/治理变更-2026-10-10-登录页形态层解耦F3c口径.md）】
 *   本文件只承载**登录页**（/auth/*）的 CSS 微调，经 `location /auth/` 的
 *   `sub_filter $mpform_login_head` 注入，由 build-mp-form.sh 生成 `smh-form-login.css`。
 *   ★ 不得放入 SPA 规则（那是 extra.css 的职责）—— 双载体必分叉；
 *   ★ 登录页 **HTML 结构**改动仍走镜像（patch-login-back / patch-login-portal-roles），
 *     形态层只注入 CSS/JS（V2 的 DOM 增强由 extra-login.js 承担）。
 *
 * 【V2 动因】CEO 真机反馈 ③「字体还是溢出」：
 *   三入口按钮主文案过长时折行/顶破。JS 侧已收敛文案（我是X用户 → X用户，见 extra-login.js ③），
 *   本文件做**防溢出兜底**：任何文案、任何文字放大档位下，主文案不得横向溢出、不得折成两行。
 *   规格同 T2：横向溢出为空；纵向允许长高。
 *
 * 【V2 新增】④ 租户标识「渐进式登录」行样式：输入框 + 确认按钮 + 已确认回显。
 */
:root {
  --smh-login-form-v: 2;
}

/* ③ 三入口按钮：文案防溢出兜底（与 patch-login-portal-roles 的既有样式叠加，不覆盖其视觉） */
#smh-login-roles button {
  min-width: 0;
}
#smh-login-roles button b {
  display: block;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-align: center;
}
@media (max-width: 360px) {
  #smh-login-roles button b { font-size: 12.5px; }
}

/* ④ 租户标识行：输入 + 确认（CEO 建议的"确认后显示租户标识"＝渐进式登录）
   ★★ V2.1 修（2026-10-10 真机截图 + 无头实测）：首版**布局崩了** ——
      实测 `#tenant` 宽仅 **30px**（几乎不可见）、`#smh-tenant-confirm` 宽 **316px**（吃掉整行）。
      根因：登录页原生 CSS 给 `button` 设了 `width:100%`（「登 录」本就全宽），
      确认按钮继承了它；`flex:0 0 auto` 挡不住 `width:100%`（flex-basis:auto ⇒ 用 width）。
   ⇒ 正解：两个子项都**显式写 `width:auto`**，并给按钮 `white-space:nowrap`＋固定内边距。
   规格（判据 S12i）：390 视口下 输入框 ≥ 150px、按钮 ≤ 100px、两者不重叠。 */
.smh-tenant-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
  min-width: 0;
}
.smh-tenant-row #tenant {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;            /* ★ 覆盖可能继承的全宽/固定宽，交给 flex 分配剩余空间 */
  margin: 0;              /* ★ V2.2：清原生 input 的 margin，保证与按钮同行等高 */
  height: 46px;           /* ★ 与按钮一致（原生 input 亦为 46px，显式声明防漂移） */
}
#smh-tenant-confirm {
  flex: 0 0 auto;
  width: auto;            /* ★★ 关键：覆盖原生 `button{width:100%}` —— 否则按钮吃掉整行 */
  /* ★★ V2.2 修（2026-10-10 真机截图 + 无头复现）：原生规则是
       `button { width:100%; height:48px; margin-top:24px; ... }`
     ⇒ 本按钮**继承了 margin-top:24px** ⇒ 在 flex 行内被推下 24px（实测 tenant.y=367.3 / confirm.y=391.3，
     落差正是 24）⇒ 真机呈现"确认按钮掉到输入框右下角"。
     ★ 上一版只覆盖了 width、没清零 margin ⇒ 错位依旧（无头数据早已显示，是验证只测宽度没测垂直对齐）。 */
  margin: 0;
  height: 46px;           /* 与输入框等高（原生 48px 会略高） */
  min-height: 46px;
  padding: 0 14px;
  white-space: nowrap;
  cursor: pointer;
  border: 1px solid var(--line, rgba(127, 127, 127, .28));
  border-radius: 10px;
  background: transparent;
  color: var(--fg, #1c2436);
  font-size: 13px;
  -webkit-tap-highlight-color: transparent;
}
#smh-tenant-confirm:active {
  opacity: .72;
}
.smh-tenant-confirmed {
  margin: -2px 0 10px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--gold, #c8a04a);
}