/* =============================================================================
 * 登录/注册弹窗页专用样式（/popup/login/，由顶层页 popup.js 以 iframe 载入）
 * -----------------------------------------------------------------------------
 * ★ 主体样式**一行都不用重写**：全部来自原站那份表 AiSuite/assets/css/index.css
 *   （.login_dialog / .login_modal / .login_close_btn / .login_content / .logo /
 *     .slogan / .login_form_item / .btn_group / .btn / .login_tips / .parsley-errors-list）
 * ★ 本文件只做三件事：① iframe 透明底 ② 显式显示 ③ 验证码行（原站没有这块，本站按配置才有）
 *   2026-10-03b：删除了上一版对 .logo 的宽幅覆盖 —— 原站是全站方形图 + 6.25rem 方框，
 *   覆盖反而与截图不一致（这就是用户反馈"样式不一样"的直接原因之一）。
 * ========================================================================== */

/* ① 弹窗页在 iframe 内 ⇒ 必须透明底 */
html,
body.login_popup_body {
  margin: 0;
  padding: 0;
  background: transparent !important;
  overflow: hidden;
}

/* ② 本页唯一用途就是显示这个弹窗（原表里 display:none 是注释掉的，这里显式接管） */
.login_dialog {
  display: block !important;
}

/* 小屏时弹窗可能高于视口 ⇒ 允许内部滚动 */
.login_dialog .login_modal {
  max-height: 96vh;
  overflow-y: auto;
  /* ★ 2026-10-03c：显式禁横向滚动。只写 overflow-y:auto 时，按 CSS 规范 **overflow-x 会被计算成 auto**
     ⇒ 一旦内部有 1px 横向溢出就会出现底部那条横向滚动条（用户看到的就是它）。 */
  overflow-x: hidden;
}

/* ④ ★ 2026-10-03c 修"底部多出横向滚动条"（只补盒模型，不动任何尺寸/颜色/间距）
 * 实测（chromium headless，1903×900 的 iframe 载入本页）：
 *   .login_modal   clientWidth=666  scrollWidth=670  ⇒ 横向溢出 4px
 *   #account       边框盒宽 640，而其父 .login_form_item 内容宽只有 606 ⇒ 输入框比容器宽 34px
 * 原因：原站那份表（AiSuite/assets/css/index.css）里**有全局 `box-sizing:border-box`**，
 *       而我们复制过来的 login_popup_index.css 是**子集**、没带上这条 reset ⇒
 *       `.login_form_item > input{width:100%}` 变成 content-box，再叠加 padding(16×2)+border(1×2) 就多出 34px。
 * 影响：只有"带 padding/border 且 width:100%"的元素（就是两个输入框）会变，
 *       补上后输入框左右各留 30px、与下方按钮同宽 —— 这正是原站的样子。
 */
.login_dialog .login_modal,
.login_dialog .login_modal * {
  box-sizing: border-box;
}

/* ③ 验证码行（仅当后台开了登录/注册验证码时才渲染） */
.login_form_item_verify {
  display: flex;
  flex-direction: column;
  row-gap: 0.625rem;
}

.login_verify_img {
  width: 8.75rem;
  height: 2.75rem;
  border-radius: 0.25rem;
  background-color: #333;
  object-fit: cover;
  cursor: pointer;
}
