/* ============================================================
   蓝鲸易支付 · 商户中心企业风皮肤  v1.5.1（文件 lj-auth-151.css）
   干净浅色动漫企业风：冷白底 + 明显的蓝紫粉柔光色斑，
   半透明磨砂白卡片透出柔彩（真毛玻璃）、漂浮气泡细节；
   仅覆盖视觉层，不改动任何接口地址与表单参数。
   说明：框架 scoped 样式带 [data-v-a1835b4a] 且运行时注入晚于
   本文件，故本文件选择器统一用 body 前缀提升优先级，避免被覆盖。
   ============================================================ */

:root {
  --el-color-primary: #2e7be8;
  --el-color-primary-light-3: #6ea4f0;
  --el-color-primary-light-5: #9fc4f5;
  --el-color-primary-light-7: #c8dcf9;
  --el-color-primary-light-8: #dce9fc;
  --el-color-primary-light-9: #edf4fe;
  --el-color-primary-dark-2: #1f63cf;
  --el-border-radius-base: 7px;
  --el-font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue",
    Helvetica, Arial, "Hiragino Sans GB", sans-serif;
}

/* 认证页显示期间，浏览器过度滚动的底色兜底（由 index.html 观察者切换 lj-auth 类） */
html.lj-auth,
html.lj-auth body {
  background-color: #f2f6fd;
}

/* 全站圆润卡片 / 弹窗 / 输入控件（登录后的商户中心同样生效） */
.el-card { border-radius: 16px; }
.el-dialog { border-radius: 18px; overflow: hidden; }
.el-message-box { border-radius: 16px; }
.el-button { border-radius: 9px; }
.el-input__wrapper { border-radius: 9px; }

/* ============================================================
   认证页（登录 / 注册 / 找回密码 / 授权回跳）
   ============================================================ */
body .auth-page[data-v-a1835b4a] {
  background:
    linear-gradient(165deg, #eaf0fd 0%, #f0ecfc 50%, #e9f4f1 100%);
}

/* 明显的彩色柔光斑：延展到卡片后方，透过磨砂呈现蓝紫粉雾面色彩 */
body .auth-page[data-v-a1835b4a]::before {
  content: "";
  position: absolute;
  inset: -16% -12%;
  background:
    radial-gradient(62% 58% at 66% 20%, rgba(74, 151, 255, 0.52), rgba(74, 151, 255, 0) 72%),
    radial-gradient(64% 60% at 26% 82%, rgba(139, 112, 246, 0.52), rgba(139, 112, 246, 0) 72%),
    radial-gradient(50% 46% at 88% 74%, rgba(255, 146, 166, 0.44), rgba(255, 146, 166, 0) 74%),
    radial-gradient(48% 44% at 14% 16%, rgba(96, 218, 194, 0.4), rgba(96, 218, 194, 0) 74%);
  z-index: 0;
  filter: blur(6px);
  animation: ljGlow 18s ease-in-out infinite alternate;
  pointer-events: none;
}

/* 漂浮气泡（呼应品牌鲸鱼形象）：白色细圆环 + 高光点 */
body .auth-page[data-v-a1835b4a]::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle 34px at 11% 76%, transparent 31px, rgba(255, 255, 255, 0.9) 32px, rgba(255, 255, 255, 0.9) 35px, transparent 36px),
    radial-gradient(circle 8px at 9.5% 70.5%, rgba(255, 255, 255, 0.95), transparent 70%),
    radial-gradient(circle 17px at 19% 42%, transparent 15px, rgba(255, 255, 255, 0.75) 16px, rgba(255, 255, 255, 0.75) 18px, transparent 19px),
    radial-gradient(circle 5px at 18.2% 39%, rgba(255, 255, 255, 0.9), transparent 70%),
    radial-gradient(circle 26px at 87% 24%, transparent 23px, rgba(255, 255, 255, 0.8) 24px, rgba(255, 255, 255, 0.8) 27px, transparent 28px),
    radial-gradient(circle 6px at 85.8% 20%, rgba(255, 255, 255, 0.95), transparent 70%),
    radial-gradient(circle 13px at 76% 70%, transparent 11px, rgba(255, 255, 255, 0.65) 12px, rgba(255, 255, 255, 0.65) 14px, transparent 15px),
    radial-gradient(circle 21px at 58% 94%, transparent 19px, rgba(255, 255, 255, 0.6) 20px, rgba(255, 255, 255, 0.6) 22px, transparent 23px);
  opacity: 0.9;
  z-index: 0;
  animation: ljBubbles 22s ease-in-out infinite alternate;
  pointer-events: none;
}

@keyframes ljGlow {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(-2.5%, 2%, 0) scale(1.08); }
}
@keyframes ljBubbles {
  from { transform: translate3d(0, 14px, 0); }
  to   { transform: translate3d(10px, -18px, 0); }
}

/* 顶部品牌条 */
body .auth-page[data-v-a1835b4a] .auth-brand {
  color: #22304d;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}
body .auth-page[data-v-a1835b4a] .auth-brand img {
  width: 40px;
  height: 40px;
  filter: drop-shadow(0 8px 16px rgba(46, 123, 232, 0.28));
}

/* 半透明磨砂玻璃卡片：背景柔彩透过雾面 */
body .auth-page[data-v-a1835b4a] .auth-card.el-card {
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 22px;
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.56), rgba(255, 255, 255, 0.28) 46%, rgba(255, 255, 255, 0.44));
  box-shadow:
    0 28px 70px rgba(58, 78, 132, 0.22),
    0 6px 20px rgba(58, 78, 132, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    inset 0 -1px 0 rgba(255, 255, 255, 0.25);
  -webkit-backdrop-filter: blur(28px) saturate(190%);
  backdrop-filter: blur(28px) saturate(190%);
  animation: ljCardIn 0.55s cubic-bezier(0.22, 0.9, 0.3, 1) both;
}
body .auth-page[data-v-a1835b4a] .auth-card.el-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 8%;
  right: 8%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.95), transparent);
}
body .auth-page[data-v-a1835b4a] .auth-card .el-card__body { padding: 36px 34px 32px; }

@keyframes ljCardIn {
  from { opacity: 0; transform: translateY(18px) scale(0.985); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

body .auth-page[data-v-a1835b4a] .auth-heading { margin-bottom: 26px; }
body .auth-page[data-v-a1835b4a] .auth-heading h1 {
  margin: 2px 0 8px;
  font-size: 26px;
  font-weight: 650;
  letter-spacing: 0.01em;
  color: #22304d;
}
body .auth-page[data-v-a1835b4a] .auth-heading p {
  margin: 0;
  font-size: 14px;
  color: #7d8aa6;
}

/* 表单变量令牌 */
body .auth-page[data-v-a1835b4a] {
  --el-text-color-primary: #2b3650;
  --el-text-color-regular: #4a5673;
  --el-text-color-secondary: #7d8aa6;
  --el-color-primary: #2e7be8;
  --el-fill-color-blank: #ffffff;
  --el-input-bg-color: #ffffff;
  --el-input-text-color: #2b3650;
  --el-input-placeholder-color: #a4aec4;
  --el-input-icon-color: #93a0ba;
  --el-input-border-color: rgba(34, 48, 77, 0.12);
  --el-input-hover-border-color: rgba(46, 123, 232, 0.4);
  --el-input-focus-border-color: #2e7be8;
  --el-border-color: rgba(34, 48, 77, 0.12);
}

/* 输入框：白底轻玻璃 */
body .auth-page[data-v-a1835b4a] .el-input .el-input__wrapper {
  min-height: 44px;
  padding: 1px 15px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: inset 0 0 0 1px rgba(34, 48, 77, 0.12);
  transition: box-shadow 0.2s ease, background 0.2s ease;
}
body .auth-page[data-v-a1835b4a] .el-input .el-input__wrapper:hover {
  background: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(46, 123, 232, 0.35);
}
body .auth-page[data-v-a1835b4a] .el-input .el-input__wrapper.is-focus,
body .auth-page[data-v-a1835b4a] .el-input .el-input__wrapper:focus-within {
  background: #ffffff;
  box-shadow:
    inset 0 0 0 1px #2e7be8,
    0 0 0 4px rgba(46, 123, 232, 0.12);
}
body .auth-page[data-v-a1835b4a] .el-input__inner {
  color: #2b3650;
  caret-color: #2e7be8;
}
body .auth-page[data-v-a1835b4a] .el-input__inner::placeholder { color: #a4aec4; }
body .auth-page[data-v-a1835b4a] .el-input .el-input__prefix .el-icon,
body .auth-page[data-v-a1835b4a] .el-input .el-input__suffix .el-icon { color: #93a0ba; }
body .auth-page[data-v-a1835b4a] .el-input__inner:-webkit-autofill,
body .auth-page[data-v-a1835b4a] .el-input__inner:-webkit-autofill:hover,
body .auth-page[data-v-a1835b4a] .el-input__inner:-webkit-autofill:focus {
  -webkit-text-fill-color: #2b3650;
  caret-color: #2e7be8;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset;
  transition: background-color 99999s ease-out;
}

/* 分段切换（账号密码 / UID 密钥、邮箱 / 手机） */
body .auth-page[data-v-a1835b4a] .el-segmented {
  min-height: 42px;
  padding: 4px;
  border-radius: 12px;
  border: 1px solid rgba(34, 48, 77, 0.08);
  background: rgba(244, 247, 253, 0.9);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  --el-segmented-color: #6b7894;
  --el-segmented-bg-color: transparent;
  --el-segmented-item-selected-color: #2e7be8;
  --el-segmented-item-selected-bg-color: #ffffff;
  --el-segmented-item-hover-color: #2e7be8;
  --el-segmented-item-hover-bg-color: rgba(46, 123, 232, 0.08);
  --el-segmented-item-active-bg-color: rgba(46, 123, 232, 0.14);
}
body .auth-page[data-v-a1835b4a] .el-segmented .el-segmented__item-selected {
  box-shadow: 0 4px 12px rgba(46, 123, 232, 0.16);
}
body .auth-page[data-v-a1835b4a] .el-segmented__item-label {
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0 14px;
}
body .auth-page[data-v-a1835b4a] .el-segmented__item-selected { border-radius: 9px; }

/* 复选框 */
body .auth-page[data-v-a1835b4a] .el-checkbox { --el-checkbox-text-color: #4a5673; --el-checkbox-checked-text-color: #2e7be8; }
body .auth-page[data-v-a1835b4a] .el-checkbox__inner {
  background: #ffffff;
  border-color: rgba(34, 48, 77, 0.22);
  border-radius: 5px;
}
body .auth-page[data-v-a1835b4a] .el-checkbox__input.is-checked .el-checkbox__inner,
body .auth-page[data-v-a1835b4a] .el-checkbox__input.is-focus .el-checkbox__inner {
  background: #2e7be8;
  border-color: #2e7be8;
}
body .auth-page[data-v-a1835b4a] .el-checkbox__inner:hover { border-color: #2e7be8; }

/* 链接 */
body .auth-page[data-v-a1835b4a] .login-options a,
body .auth-page[data-v-a1835b4a] .auth-link a {
  color: #2e7be8;
  font-weight: 600;
  text-underline-offset: 3px;
  transition: color 0.18s ease;
}
body .auth-page[data-v-a1835b4a] .login-options a:hover,
body .auth-page[data-v-a1835b4a] .auth-link a:hover { color: #1f63cf; text-decoration: underline; }
body .auth-page[data-v-a1835b4a] .auth-link { color: #8d99b4; }

/* 分割线 */
body .auth-page[data-v-a1835b4a] .el-divider {
  --el-border-color: rgba(34, 48, 77, 0.1);
  --el-text-color-secondary: #98a3ba;
  margin: 24px 0;
}
body .auth-page[data-v-a1835b4a] .el-divider__text {
  background: transparent;
  font-size: 13px;
}

/* 主按钮：品牌蓝渐变 */
body .auth-page[data-v-a1835b4a] .submit-button.el-button {
  height: 46px;
  margin-top: 2px;
  border: none;
  border-radius: 13px;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: 0.08em;
  color: #fff;
  background: linear-gradient(135deg, #4a97ff 0%, #2e7be8 48%, #1b5fcb 100%);
  box-shadow:
    0 12px 26px rgba(46, 123, 232, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
  transition: transform 0.18s ease, filter 0.18s ease, box-shadow 0.18s ease;
}
body .auth-page[data-v-a1835b4a] .submit-button.el-button:hover,
body .auth-page[data-v-a1835b4a] .submit-button.el-button:focus {
  color: #fff;
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow:
    0 16px 32px rgba(46, 123, 232, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.32);
}
body .auth-page[data-v-a1835b4a] .submit-button.el-button:active { transform: translateY(0); filter: brightness(0.98); }

/* 获取验证码按钮：浅蓝玻璃 */
body .auth-page[data-v-a1835b4a] .code-row { gap: 10px; }
body .auth-page[data-v-a1835b4a] .code-row .el-button {
  width: 132px;
  height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(46, 123, 232, 0.28);
  border-radius: 12px;
  background: rgba(46, 123, 232, 0.08);
  color: #2e7be8;
  font-weight: 600;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
body .auth-page[data-v-a1835b4a] .code-row .el-button:hover {
  background: rgba(46, 123, 232, 0.14);
  border-color: rgba(46, 123, 232, 0.5);
  color: #1f63cf;
}
body .auth-page[data-v-a1835b4a] .code-row .el-button.is-disabled,
body .auth-page[data-v-a1835b4a] .code-row .el-button.is-disabled:hover {
  background: rgba(34, 48, 77, 0.05);
  border-color: rgba(34, 48, 77, 0.1);
  color: #a4aec4;
}

/* 第三方登录圆形按钮 */
body .auth-page[data-v-a1835b4a] .social-buttons .el-button {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(34, 48, 77, 0.12);
  background: rgba(255, 255, 255, 0.92);
  color: #6b7894;
  font-size: 19px;
  box-shadow: 0 6px 16px rgba(64, 84, 138, 0.1);
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
body .auth-page[data-v-a1835b4a] .social-buttons .el-button:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, #4a97ff, #1b5fcb);
  border-color: transparent;
  color: #fff;
}

/* 注册关闭提示：暖橙玻璃 */
body .auth-page[data-v-a1835b4a] .register-alert.el-alert {
  border: 1px solid rgba(255, 159, 96, 0.4);
  border-radius: 12px;
  background: rgba(255, 247, 238, 0.92);
  color: #b3541e;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  --el-alert-description-color: #9c7152;
}
body .auth-page[data-v-a1835b4a] .register-alert .el-alert__title { color: #b3541e; font-weight: 600; }

/* 注册须知 popover（teleport 到 body 下，用 html.lj-auth 限定） */
html.lj-auth .el-popover.el-popper {
  border-radius: 12px;
  --el-popover-bg-color: #ffffff;
  --el-text-color-primary: #2b3650;
  --el-text-color-regular: #4a5673;
  border: 1px solid rgba(34, 48, 77, 0.1);
  box-shadow: 0 16px 40px rgba(64, 84, 138, 0.16);
}

/* 底部版权 */
body .auth-page[data-v-a1835b4a] footer {
  color: #98a3ba;
  letter-spacing: 0.02em;
}

/* 弹窗（注册付费等，渲染在 body 下）保持圆润企业感 */
.el-dialog__header { padding-right: 20px; }
.el-dialog .el-radio.is-bordered { border-radius: 12px; }

/* 手机端 */
@media (max-width: 480px) {
  body .auth-page[data-v-a1835b4a] .auth-brand { height: 56px; padding: 0 18px; font-size: 17px; }
  body .auth-page[data-v-a1835b4a] .auth-brand img { width: 34px; height: 34px; }
  body .auth-page[data-v-a1835b4a] .auth-main { padding: 14px 16px 20px; align-content: center; }
  body .auth-page[data-v-a1835b4a] .auth-card .el-card__body { padding: 28px 20px 24px; }
  body .auth-page[data-v-a1835b4a] .auth-heading { margin-bottom: 22px; }
  body .auth-page[data-v-a1835b4a] .auth-heading h1 { font-size: 23px; }
  body .auth-page[data-v-a1835b4a]::after { opacity: 0.55; }
}

@media (prefers-reduced-motion: reduce) {
  body .auth-page[data-v-a1835b4a]::before,
  body .auth-page[data-v-a1835b4a]::after,
  body .auth-page[data-v-a1835b4a] .auth-card.el-card { animation: none; }
  body .auth-page[data-v-a1835b4a] .submit-button.el-button,
  body .auth-page[data-v-a1835b4a] .social-buttons .el-button { transition: none; transform: none; }
}