/* ============================================================
   components/auth.css — 鉴权页布局（登录 / 改密）
   依赖：tokens.css、base.css
   说明：鉴权页为前置页面，不挂载 v315 导航，采用自包含居中卡片。
         不引入 base_head（避免其内嵌 legacy button/footer/a:hover 污染）。
   ============================================================ */

.auth {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.auth__wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-6);
  padding: var(--space-8) var(--space-4);
  /* 极淡品牌渐变底，替代原 login 外链背景，避免资源缺失与深浅主题冲突 */
  background:
    radial-gradient(1100px 560px at 50% -12%, var(--brand-tint), transparent 60%),
    var(--bg);
}

/* ---- 卡片 ---- */
.auth-card {
  width: 100%;
  max-width: 400px;
  padding: var(--space-8) var(--space-6);
}

.auth-card__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
}

.auth-card__logo {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-lg);
  background: var(--brand-tint);
  color: var(--brand);
  margin-bottom: var(--space-1);
}

.auth-card__title {
  margin: 0;
  font-size: var(--fs-xl);
  font-weight: var(--fw-semibold);
  color: var(--text);
}

.auth-card__subtitle {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--text-muted);
}

.auth-card__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.auth-card__remember {
  margin: calc(-1 * var(--space-2)) 0 0;
}

.auth-card__submit {
  margin-top: var(--space-2);
}

/* 只读输入（改密页用户名预填） */
.input[readonly] {
  background: var(--surface-2);
  color: var(--text-muted);
  cursor: default;
}

/* 自包含页脚（替代 legacy footer 的 lightgray 污染） */
.auth-footer {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--fs-xs);
  color: var(--text-muted);
  padding: var(--space-4);
}

.auth-footer a {
  color: var(--text-muted);
}

.auth-footer a:hover {
  color: var(--brand);
}

/* 消息链接（改密成功 → 返回主页） */
.auth-link {
  color: var(--brand);
  font-weight: var(--fw-medium);
}

.auth-link:hover {
  text-decoration: underline;
}

/* 提示条图标槽位（alert.css 未定义，鉴权页复用） */
.alert__icon {
  flex-shrink: 0;
  color: inherit;
  margin-top: 1px;
}