/*
 * 图形验证码样式 —— 所有登录入口共用（用户 2026-10-11）。
 *
 * 四个入口的皮肤不同（PC 页 / H5 页 / PC 弹框 / H5 弹框），所以这里只保证
 * 「输入框 + 可点刷新的图」的排列与图片本身不失真；配色沿用各页自己的变量与
 * 继承色，不强行统一，免得把某个弹框的观感改坏。
 *
 * ⚠️ 图**不写死尺寸、不加压缩适配**（2026-10-11 实测踩到三次，别改回去）：
 *   · 写死 width + 按容器裁切 → 服务端的 132×40 被裁掉末位字符半个
 *   · 保留 border → border 占盒模型，把 132×40 撑成 134×42，字发虚
 *   · 父容器 align-items:stretch → 图被拉成 132×46
 *   所以：尺寸交给图片自己，边框用 box-shadow（不占盒模型），并 align-self:center。
 */

.st-captcha {
  display: flex;
  gap: 10px;
  align-items: center;
}

.st-captcha input {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
}

.st-captcha img {
  flex-shrink: 0;
  align-self: center;
  box-shadow: 0 0 0 1px #e3e7ef;
  border-radius: 9px;
  background: #f0f3fa;
  cursor: pointer;
}

.st-captcha img:hover {
  box-shadow: 0 0 0 1px #2f7bff;
}

/* H5 首页弹框是深色皮肤（h5-runtime.js），那里用 .h5-auth-captcha 的旧类名 */
.h5-auth-captcha img {
  flex-shrink: 0;
  align-self: center;
  box-shadow: 0 0 0 1px #e3e7ef;
  border-radius: 11px;
  background: #f0f3fa;
  cursor: pointer;
}

/*
 * 身份选择器锁定态（该手机号已注册，身份以账号为准）。
 * PC 首页弹框与 /login 页共用 .lg-role.locked。
 */
.lg-role.locked {
  opacity: .62;
}

.lg-role.locked .lr-tab {
  cursor: not-allowed;
}

.lg-role.locked .lr-tab[aria-disabled="true"],
.lg-role.locked .lr-tab[aria-disabled="true"]:hover {
  color: var(--text-light, #8993a8);
}

/* 预检结果说明（账号已存在时才出现） */
.lg-account-note {
  margin: -4px 0 12px;
  padding: 9px 12px;
  border: 1px solid #d8e4ff;
  border-radius: 10px;
  background: linear-gradient(120deg, #f2f6ff, #eaf0ff);
  color: var(--text-mid, #4c586b);
  font-size: 12.5px;
  line-height: 1.6;
}

.lg-account-note b {
  color: var(--primary-dark, #123ea8);
  font-weight: 800;
}
