/*!
 * DisxCloud Auth v1.3.2 — 登录 / 注册 / 找回密码 / 令牌登录
 * 左侧品牌区 + 右侧表单卡片；明暗主题与官网同步（html[data-theme]）
 */
html, html[data-theme="light"] {
  --da-bg: #f3f6fb;
  --da-card: #ffffff;
  --da-field: #f6f8fc;
  --da-field-focus: #ffffff;
  --da-border: rgba(25, 55, 110, .10);
  --da-border-2: rgba(25, 55, 110, .16);
  --da-text: #0f1f3a;
  --da-text-2: #56667f;
  --da-text-3: #8a96aa;
  --da-icon: #6b7a93;
  --da-accent: #1677ff;
  --da-accent-rgb: 22, 119, 255;
  --da-grad: linear-gradient(135deg, #1677ff 0%, #4f6bff 100%);
  --da-shadow: 0 30px 80px rgba(20, 50, 110, .14), 0 2px 6px rgba(20, 50, 110, .05);
  --da-aside: linear-gradient(150deg, #0d47c9 0%, #2a5bff 46%, #6a5cff 100%);
  --da-font: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans SC', 'MiSans', 'Microsoft YaHei UI', 'Microsoft YaHei', 'Segoe UI', 'Noto Sans SC', Roboto, Arial, sans-serif;
}
html[data-theme="dark"] {
  --da-bg: #060a16;
  --da-card: #0e1428;
  --da-field: #0a1022;
  --da-field-focus: #0c1328;
  --da-border: rgba(130, 150, 210, .13);
  --da-border-2: rgba(130, 160, 230, .22);
  --da-text: #e8ebf3;
  --da-text-2: #9aa4c4;
  --da-text-3: #6c779b;
  --da-icon: #8d98ba;
  --da-accent: #3aa8ff;
  --da-accent-rgb: 58, 168, 255;
  --da-grad: linear-gradient(135deg, #3aa8ff 0%, #8b7bff 100%);
  --da-shadow: 0 30px 80px rgba(0, 0, 0, .45), 0 0 0 1px rgba(130, 150, 210, .08);
  --da-aside: linear-gradient(150deg, #0b1a44 0%, #16286a 50%, #2d2470 100%);
}

/* ---------- 页面底 ---------- */
body.auth-page {
  margin: 0; min-height: 100vh; overflow-x: hidden;
  font-family: var(--da-font) !important; color: var(--da-text);
  background: var(--da-bg) !important;
  background-image:
    radial-gradient(900px 520px at 100% 0%, rgba(var(--da-accent-rgb), .10), transparent 60%),
    radial-gradient(800px 520px at 0% 100%, rgba(139, 123, 255, .09), transparent 60%) !important;
  background-attachment: fixed !important;
  -webkit-font-smoothing: antialiased;
}
body.auth-page .auth-particles, body.auth-page .auth-fireworks-canvas { display: none !important; }
body.auth-page .auth-space-bg { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 0; pointer-events: none; opacity: .0; transition: opacity .6s ease; }
html[data-theme="dark"] body.auth-page .auth-space-bg { opacity: .55; }

/* ---------- 顶部按钮 ---------- */
.auth-topbar { position: fixed; top: 18px; right: 20px; z-index: 30; display: flex; gap: 10px; align-items: center; }
.auth-topbar .dx-home-link { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 14px; border-radius: 10px; font-size: 13px; font-weight: 600; color: var(--da-text-2); background: var(--da-card); border: 1px solid var(--da-border); text-decoration: none; transition: color .2s, border-color .2s; }
.auth-topbar .dx-home-link:hover { color: var(--da-accent); border-color: rgba(var(--da-accent-rgb), .4); text-decoration: none; }
.auth-theme-btn, .auth-lang-btn {
  min-width: 38px; height: 38px; padding: 0 10px; border-radius: 10px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; color: var(--da-text-2);
  background: var(--da-card); border: 1px solid var(--da-border); outline: none;
  transition: border-color .2s, color .2s, transform .2s;
}
.auth-theme-btn:hover, .auth-lang-btn:hover { color: var(--da-accent); border-color: rgba(var(--da-accent-rgb), .4); transform: translateY(-1px); }
.auth-theme-btn .icon-sun, .auth-theme-btn .icon-moon { font-size: 16px; line-height: 1; }
html[data-theme="dark"] .auth-theme-btn .icon-sun, html:not([data-theme="dark"]) .auth-theme-btn .icon-moon { display: none; }

/* ---------- 布局 ---------- */
.auth-section.dx-auth { position: relative; z-index: 10; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 84px 20px 40px; box-sizing: border-box; }
.dx-auth-shell {
  width: 100%; max-width: 1080px; display: grid; grid-template-columns: 1.05fr 1fr;
  border-radius: 26px; overflow: hidden; background: var(--da-card);
  box-shadow: var(--da-shadow);
  animation: daRise .7s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes daRise { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: none; } }

/* ---------- 左侧品牌区 ---------- */
.dx-auth-aside { position: relative; overflow: hidden; color: #fff; background: var(--da-aside); padding: 44px 48px; display: flex; flex-direction: column; min-height: 620px; }
.dx-auth-aside::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, .55) 1px, transparent 1.4px); background-size: 26px 26px; opacity: .12; -webkit-mask-image: linear-gradient(180deg, #000, transparent 75%); mask-image: linear-gradient(180deg, #000, transparent 75%); }
.dx-aside-orbits { position: absolute; right: -150px; bottom: -150px; width: 460px; height: 460px; color: #fff; pointer-events: none; }
.dx-aside-orbits svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: daSpin 60s linear infinite; }
.dx-aside-orbits .dx-orbit-dot { filter: drop-shadow(0 0 6px #fff); }
.dx-aside-globe { position: absolute; left: 50%; top: 50%; width: 220px; height: 220px; margin: -110px 0 0 -110px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .45), rgba(255, 255, 255, .06) 45%, transparent 70%), radial-gradient(rgba(255, 255, 255, .6) 1px, transparent 1.6px);
  background-size: 100% 100%, 12px 12px; box-shadow: inset -20px -30px 60px rgba(10, 20, 80, .45), 0 0 80px rgba(150, 180, 255, .35); opacity: .75; }
@keyframes daSpin { to { transform: rotate(360deg); } }
.dx-aside-logo { position: relative; display: inline-flex; align-self: flex-start; }
.dx-aside-logo img { height: 34px; width: auto; }
.dx-aside-main { position: relative; margin-top: auto; margin-bottom: auto; padding: 40px 0 24px; }
.dx-aside-eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 99px; font-size: 12px; font-weight: 600; letter-spacing: .04em; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .18); }
.dx-aside-eyebrow i { width: 6px; height: 6px; border-radius: 50%; background: #5cffc2; box-shadow: 0 0 0 4px rgba(92, 255, 194, .2); }
.dx-auth-aside h2 { margin: 20px 0 26px; font-size: 32px; line-height: 1.32; font-weight: 800; letter-spacing: .01em; color: #fff; }
.dx-auth-aside h2 em { font-style: normal; background: linear-gradient(90deg, #a8d8ff, #d9ccff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dx-aside-points { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.dx-aside-points li { display: flex; gap: 14px; align-items: flex-start; }
.dx-aside-points b { flex: none; width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .2); }
.dx-aside-points b svg { width: 18px; height: 18px; }
.dx-aside-points strong { display: block; font-size: 15px; margin-bottom: 2px; }
.dx-aside-points span { font-size: 13px; color: rgba(255, 255, 255, .72); }
.dx-aside-stats { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .16); }
.dx-aside-stats b { display: block; font-size: 20px; font-weight: 800; }
.dx-aside-stats span { font-size: 12px; color: rgba(255, 255, 255, .7); }

/* ---------- 右侧表单 ---------- */
.dx-auth .auth-card { position: relative; display: flex; flex-direction: column; background: transparent; border: 0; box-shadow: none; max-width: none; width: auto; border-radius: 0; }
.dx-auth .auth-card::before { content: none; }
.dx-auth .auth-card-body { flex: 1; padding: 46px 52px 26px; }
.auth-logo-area { display: none; }
.dx-auth .auth-title { margin: 0 0 6px; font-size: 26px; font-weight: 800; letter-spacing: .01em; color: var(--da-text); text-align: left; background: none; -webkit-text-fill-color: currentColor; }
.dx-auth .auth-subtitle { margin: 0 0 26px; font-size: 14px; color: var(--da-text-3); text-align: left; }
.auth-easter-msg { display: none !important; }

/* 标签切换 */
.auth-tab-switcher { position: relative; display: flex; gap: 4px; padding: 4px; margin-bottom: 22px; border-radius: 12px; background: var(--da-field); border: 1px solid var(--da-border); }
.auth-tab-btn { flex: 1; height: 38px; border: 0; border-radius: 9px; background: transparent; color: var(--da-text-2); font-weight: 600; font-size: 14px; cursor: pointer; transition: color .2s, background .25s, box-shadow .25s; }
.auth-tab-btn:hover { color: var(--da-accent); }
.auth-tab-btn.active { background: var(--da-card); color: var(--da-text); box-shadow: 0 2px 8px rgba(20, 50, 110, .10), 0 0 0 1px var(--da-border); }

/* 表单 */
.auth-form .auth-form-group, .auth-form .form-group { margin-bottom: 16px; }
.auth-form-label, .auth-form label:not(.custom-control-label) { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 600; color: var(--da-text-2); }
.auth-input-wrapper { position: relative; display: flex; align-items: center; flex: 1; }
.auth-input-icon { position: absolute; left: 0; top: 0; bottom: 0; width: 44px; display: flex !important; align-items: center; justify-content: center; transform: none !important; color: var(--da-icon); pointer-events: none; transition: color .2s; z-index: 2; }
.auth-input-icon svg { width: 18px; height: 18px; display: block; }
.auth-form .form-control, .auth-form select, .auth-form textarea {
  width: 100%; height: 46px; box-sizing: border-box; padding: 0 14px; border-radius: 12px;
  background: var(--da-field) !important; border: 1px solid var(--da-border-2) !important; color: var(--da-text) !important;
  font-size: 14px; font-family: var(--da-font); box-shadow: none !important; outline: none;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.auth-form textarea { height: auto; padding: 10px 14px; }
.auth-input-wrapper .form-control { padding-left: 42px; }
.auth-form .form-control::placeholder { color: var(--da-text-3); opacity: 1; }
.auth-form .form-control:focus { background: var(--da-field-focus) !important; border-color: rgba(var(--da-accent-rgb), .7) !important; box-shadow: 0 0 0 4px rgba(var(--da-accent-rgb), .12) !important; }
.auth-input-wrapper:focus-within .auth-input-icon { color: var(--da-accent) !important; }
.auth-form .form-control.is-invalid { border-color: #f46a6a !important; box-shadow: 0 0 0 4px rgba(244, 106, 106, .12) !important; }
.dx-pwd-eye { position: absolute; right: 8px; top: 0; bottom: 0; margin: auto 0; width: 30px; height: 30px; border: 0; background: transparent; color: var(--da-text-3); cursor: pointer; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; z-index: 2; }
.dx-pwd-eye:hover { color: var(--da-accent); background: rgba(var(--da-accent-rgb), .08); }
.auth-input-wrapper .form-control[type="password"], .auth-input-wrapper .form-control.dx-has-eye { padding-right: 44px; }
.dx-field-hint { display: block; margin-top: 6px; font-size: 12px; color: var(--da-text-3); }

.auth-code-row { display: flex; gap: 10px; }
.auth-code-btn {
  flex: none; min-width: 116px; height: 46px; padding: 0 14px; border-radius: 12px; cursor: pointer;
  font-size: 13px; font-weight: 700; white-space: nowrap;
  color: var(--da-accent); background: rgba(var(--da-accent-rgb), .08); border: 1px solid rgba(var(--da-accent-rgb), .28);
  transition: background .2s, color .2s;
}
.auth-code-btn:hover:not([disabled]) { background: var(--da-grad); color: #fff; border-color: transparent; }
.auth-code-btn[disabled] { cursor: not-allowed; color: var(--da-text-3); background: var(--da-field); border-color: var(--da-border); }

/* 图形验证码（后台开启时） */
.auth-form .input-group { display: flex; gap: 10px; flex-wrap: nowrap; }
.auth-form .input-group .form-control { border-radius: 12px !important; }
.auth-form .input-group-append img { height: 46px; width: 120px; border-radius: 12px; border: 1px solid var(--da-border-2) !important; object-fit: cover; cursor: pointer; }

.auth-checkbox-wrapper { display: flex; align-items: center; gap: 8px; margin: 4px 0 14px; font-size: 13px; color: var(--da-text-2); }
.auth-checkbox-wrapper input { width: 16px; height: 16px; accent-color: var(--da-accent); margin: 0; }
.auth-checkbox-wrapper label { margin: 0 !important; display: inline !important; font-weight: 500 !important; }
.auth-checkbox-wrapper a, .auth-links a { color: var(--da-accent); font-weight: 600; text-decoration: none; }
.auth-links { display: flex; justify-content: space-between; align-items: center; margin: 2px 0 20px; font-size: 13px; }
.auth-links a { color: var(--da-text-2); font-weight: 500; }
.auth-links a:hover { color: var(--da-accent); text-decoration: none; }

.auth-btn-primary {
  position: relative; width: 100%; height: 48px; border: 0; border-radius: 12px; cursor: pointer;
  font-size: 15px; font-weight: 700; letter-spacing: .12em; color: #fff; background: var(--da-grad);
  box-shadow: 0 10px 24px rgba(var(--da-accent-rgb), .30);
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; overflow: hidden;
  transition: transform .2s, box-shadow .2s, filter .2s;
}
.auth-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(var(--da-accent-rgb), .36); filter: brightness(1.05); }
.auth-btn-primary:active { transform: translateY(0); }
.auth-btn-primary[disabled] { opacity: .75; cursor: progress; }
.auth-spinner { width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: daSpin .7s linear infinite; }

.dx-auth-alt { margin-top: 18px; text-align: center; font-size: 13px; color: var(--da-text-3); }
.dx-auth-alt a { color: var(--da-accent); font-weight: 700; text-decoration: none; margin-left: 4px; }
.dx-auth-secure { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 16px; font-size: 12px; color: var(--da-text-3); }
.dx-auth-secure svg { width: 14px; height: 14px; color: #20b47f; }
.dx-return-tip { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; padding: 10px 14px; border-radius: 12px; font-size: 13px; color: var(--da-accent); background: rgba(var(--da-accent-rgb), .08); border: 1px solid rgba(var(--da-accent-rgb), .18); }

.auth-card-footer { padding: 16px 52px 22px; border-top: 1px solid var(--da-border); text-align: left; font-size: 12px; }
.auth-card-footer a { color: var(--da-text-3); text-decoration: none; }
.auth-card-footer a:hover { color: var(--da-accent); }

/* 入场动画（保留原有类名） */
.auth-fade-in { animation: daFade .55s cubic-bezier(.2, .8, .2, 1) both; }
.auth-fade-in-delay-1 { animation-delay: .06s; } .auth-fade-in-delay-2 { animation-delay: .12s; } .auth-fade-in-delay-3 { animation-delay: .18s; } .auth-fade-in-delay-4 { animation-delay: .24s; } .auth-fade-in-delay-5 { animation-delay: .3s; }
@keyframes daFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .auth-fade-in, .dx-auth-shell, .dx-aside-orbits svg { animation: none !important; } }

/* 二次验证弹窗（登录） */
.dx-modal { position: fixed; inset: 0; z-index: 2000; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(6, 12, 30, .5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.dx-modal.is-open { display: flex; animation: daFadeIn .2s ease; }
@keyframes daFadeIn { from { opacity: 0; } }
.dx-modal-card { width: 100%; max-width: 420px; padding: 28px; border-radius: 20px; background: var(--da-card, #fff); color: var(--da-text, #0f1f3a); box-shadow: 0 30px 80px rgba(0, 0, 0, .3); animation: daRise .35s cubic-bezier(.2, .8, .2, 1); }
.dx-modal-card h5 { margin: 0 0 6px; font-size: 18px; font-weight: 800; color: var(--da-text); }
.dx-modal-card p { margin: 0 0 18px; font-size: 13px; color: var(--da-text-3); }
.dx-modal-actions { display: flex; gap: 10px; margin-top: 18px; }
.dx-modal-actions .auth-btn-primary { flex: 1; }
.dx-btn-ghost { flex: none; height: 48px; padding: 0 18px; border-radius: 12px; border: 1px solid var(--da-border-2); background: transparent; color: var(--da-text-2); font-weight: 600; cursor: pointer; }
.dx-btn-ghost:hover { color: var(--da-accent); border-color: rgba(var(--da-accent-rgb), .4); }

/* ---------- 响应式 ---------- */
@media (max-width: 991.98px) {
  .dx-auth-shell { grid-template-columns: 1fr; max-width: 460px; border-radius: 22px; }
  .dx-auth-aside { min-height: 0; padding: 26px 28px 24px; }
  .dx-aside-main, .dx-aside-stats { display: none; }
  .dx-aside-orbits { right: -200px; bottom: -260px; opacity: .7; }
  .dx-auth-aside::after { content: "欢迎来到优丰互联"; position: relative; margin-top: 14px; font-size: 13px; color: rgba(255, 255, 255, .78); }
  .dx-auth .auth-card-body { padding: 30px 28px 20px; }
  .auth-card-footer { padding: 14px 28px 18px; text-align: center; }
}
@media (max-width: 479.98px) {
  .auth-section.dx-auth { padding: 70px 12px 24px; align-items: flex-start; }
  .auth-topbar { top: 12px; right: 12px; gap: 8px; }
  .auth-topbar .dx-home-link span { display: none; }
  .dx-auth .auth-card-body { padding: 26px 20px 18px; }
  .dx-auth .auth-title { font-size: 22px; }
  .auth-code-btn { min-width: 104px; }
}

/* 浏览器自动填充：保持与主题一致，避免深色模式下文字“消失” */
.auth-form input:-webkit-autofill, .auth-form input:-webkit-autofill:hover, .auth-form input:-webkit-autofill:focus, .auth-form input:-webkit-autofill:active,
.dx-modal input:-webkit-autofill, .dxs-card input:-webkit-autofill {
  -webkit-text-fill-color: var(--da-text) !important; caret-color: var(--da-text);
  -webkit-box-shadow: 0 0 0 1000px var(--da-field) inset !important; box-shadow: 0 0 0 1000px var(--da-field) inset !important;
  transition: background-color 99999s ease 0s, border-color .2s;
}
.auth-form input:autofill { background: var(--da-field) !important; color: var(--da-text) !important; }
.auth-form .form-control { -webkit-text-fill-color: var(--da-text); }
/* 输入框入场动画结束后不再隐藏（浏览器返回 / 缓存恢复时保持可见） */
.dx-auth-ready .auth-fade-in { animation: none !important; opacity: 1 !important; transform: none !important; }
/* 二次验证加载中 */
.auth-btn-primary.is-busy { pointer-events: none; opacity: .85; }