/* ── ログイン画面（/Login）固有のスタイル。
      骨格・フォーム・ボタン（.btn-auth）・フッター・トークン・描画前フォントゲートは
      login-common.css に集約している（パスワード再設定と共有）。 ── */

/* ⚠️ カード幅は「認証失敗メッセージが1行に収まる幅」で決めている（既定の 440px では折り返す）。
      内訳（14px/600 の実測。フォントは Inter＋Noto Sans JP）:
        ID（メールアドレス）またはパスワードが間違っています = 337.4px
        ＋ アイコン 18.8 ＋ gap 8 ＋ .login-error の左右padding 28 ＋ 枠線 2 = 394.2px
        ＋ .login-card の左右padding 88 ＋ 枠線 2 = 484.2px → 余裕をみて 490px。
      ⚠️ ロック中・停止中のメッセージは長文なので折り返す（1行に収めるのは上記の文言だけ）。
      ⚠️ .login-error の font-size／padding、.login-card の padding、上記の文言のいずれかを
         変えたら、この値を測り直すこと（パスワード再設定は 460px で別に上書きしている）。 */
.login-card { max-width: 490px; }

/* 利用区分バッジ（モック 01_ログイン.html＝関電用／お客さま用でログイン画面を分ける） */
.login-kbn {
  display: block;
  width: fit-content;
  margin: 0 auto 12px;
  padding: 4px 14px;
  font-size: 12px; font-weight: 700;
  letter-spacing: 0.10em;
  color: var(--primary);
  background: var(--primary-light);
  border: 1px solid rgba(37,99,235,0.25);
  border-radius: 999px;
}

/* 認証失敗・ロック中のエラーメッセージ（項目単位のインライン検証とは別＝フォーム上部の赤バナー） */
.login-error {
  display: flex; align-items: flex-start; gap: 8px;
  margin-bottom: 22px; padding: 12px 14px;
  font-size: 13px; font-weight: 600; line-height: 1.5;
  color: var(--danger-text);
  background: var(--danger-bg);
  border: 1px solid var(--danger-border);
  border-radius: var(--radius-sm);
}
.login-error i { font-size: 15px; margin-top: 1px; flex-shrink: 0; }