/**
 * pn-mitsukuru パスワードリセット画面（/mypage/?a=pwdreset）のミツクル・デザイン適用（0.7.154）。
 *
 * 未ログイン＋`?a=` が PNM_Mypage::PWDRESET_ACTIONS のときだけ enqueue する
 * （PNM_Mypage::maybe_enqueue_pwdreset_assets）。他のページ・他の `a=` では配信しない。
 *
 * ★0.7.156：新パスワード設定（`?a=set_password_from_key`・リセットメールの着地先）でも配信する。
 *   ⚠️ **その画面の中身は実機未確認**。ここで確実に効くのは外枠（`.pnm-pwdreset` の余白・幅・中央寄せ）と
 *   `#wpmem_login` のカードまでで、見出し・入力欄・ボタンは WP-Members 既定の紫が残る可能性がある。
 *   🔴 足りなければ**実機の outerHTML を見てから**セレクタを足すこと（推測で書かない）。
 *
 * ★0.7.160：確認メールの再送（`?a=reconfirm`・register-2 の重複メール文言の遷移先）でも配信する。
 *   🔴 **その画面の実マークアップは未確認のため、reconfirm 専用のセレクタは1行も足していない。**
 *   確実に効くのは外枠（`.pnm-pwdreset`）と `#wpmem_login` のカードまで。中の要素（見出し・入力欄・
 *   ボタン）が `?a=pwdreset` と同じ構造かどうかは分からない。
 *   🔴 足りなければ**実機の outerHTML（`/member2/mypage/?a=reconfirm`）を見てから**セレクタを足すこと
 *   （0.7.146 の教訓＝実在しないクラス名に当てて何も効かなかった）。
 *
 * ★スコープは当プラグインが出すラッパー `.pnm-pwdreset` の配下だけ（PNM_Mypage::PWDRESET_WRAP_CLASS）。
 *   🔴 `#wpmem_login` を単独で狙わない（同じ id が `?a=getusername` でも出るため）。
 *   ⚠️ 0.7.160 から `?a=reconfirm` はこのラッパーの中に入る（＝巻き込みではなく対象）。
 *   🔴 html / body / * / 裸の form・input・legend は書かない。
 *
 * ★実マークアップ（2026-08-21 実機の outerHTML で確定・WP-Members 3.5.5.1。推測ではない）：
 *   #wpmem_login > a#pwdreset ＋ form#wpmem_pwdreset_form.form > fieldset >
 *   legend（見出し。⚠️ h1/h2 ではない）／label[for=user]／div.div_text > input#user.username／
 *   div.button_div > input.buttons[type=submit]（⚠️ <button> ではない）／
 *   div.link-text > span.link-text-username（`?a=getusername`）／
 *   div.link-text > span.link-text-reconfirm（`?a=reconfirm`・**フォームの下**）。
 *
 * ★色・角丸・余白は新しく決めず既存値を流用する：
 *   assets/css/pnm-register.css（WP-Members 登録フォームのミツクル化）と assets/css/wizard.css のパレット。
 *   緑＝#7CB342（--pnm-primary）／濃緑＝#689A38（--pnm-primary-dark）／淡緑＝#EFF6E4・枠 #D5E5BC
 *   （class-pnm-proposal-cta.php の会員登録CTAと同値）／本文 #2B2B2B／補足 #6B7280／枠 #E5E7EB。
 *   ⚠️ WP-Members 既定の紫は使わない。
 *
 * ⚠️ 詳細度：WP-Members の forms/generic-no-float.min.css と swell_child/css/wp-members.css の
 *   両方に負けないよう、`.pnm-pwdreset #wpmem_login …` まで書いて id を含む詳細度を確保し、
 *   実機で紫が残りやすい**色系だけ** !important を添える（登録フォーム #wpmem_reg と同じ流儀。乱用しない）。
 */

/* --- 外枠（他の会員ページと上下の余白を揃える） --- */
.pnm-pwdreset {
	display: block;
	float: none;
	/* 🔴 上下は margin ではなく padding で取る（0.7.155）。
	   margin だと親（テーマの本文カラム）と**相殺**して外へ抜け、画面上は余白ゼロに見える。
	   同じ症状が notice()（margin:48px auto が効かない）でも出ていた＝原因は margin の相殺。 */
	padding: 32px 0 40px;
	/* 左右は auto で中央寄せ。width:100% を併記して、親が flex/grid のとき
	   shrink-to-fit で細くならないようにする。 */
	width: 100%;
	max-width: 480px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	/* 親が text-align:center でも中身の基準を戻す（見出し・ラベルは左寄せが正）。 */
	text-align: left;
}

/* --- フォーム上の案内（常時表示・当プラグインの出力） --- */
.pnm-pwdreset .pnm-pwdreset__notice {
	margin: 0 0 20px;
	padding: 18px 20px;
	background: #EFF6E4;
	border: 1px solid #D5E5BC;
	border-radius: 16px;
	box-sizing: border-box;
}
.pnm-pwdreset .pnm-pwdreset__notice-body {
	margin: 0;
	font-size: 14px;
	line-height: 1.9;
	color: #374151;
	text-align: left;
}

/* --- カード（登録フォーム #wpmem_reg と同じ意匠） --- */
/* ⚠️ 0.7.155：`#wpmem_login` / `form` 側に幅や float が付いていると、480px のラッパーの中で
   カードだけ細く左に残り「案内ボックスとフォームの中心線がずれる」。実機の症状がこれに当たるため、
   **幅を親いっぱいに戻し、float を解除し、左右 auto で中央に置く**（推定でセレクタを足さず、
   実機の outerHTML で存在が確定している2要素〔#wpmem_login と form〕にだけ当てる）。 */
/* ⚠️ 幅・float・左右 margin だけ !important を添える（0.7.155）。
   swell_child / WP-Members 側に `!important` 付きの width や float があると、
   `.pnm-pwdreset #wpmem_login`（id＋class）でも負けて左寄りが残るため。
   実機で当たらないより優先する（崇さん判断）。⚠️ 色・余白など他のプロパティには付けない。 */
.pnm-pwdreset #wpmem_login {
	display: block;
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 0;
	margin-bottom: 0;
	padding: 32px 28px;
	background: #ffffff;
	border-radius: 18px;
	box-shadow: 0 10px 34px rgba( 0, 0, 0, 0.08 );
	box-sizing: border-box;
}
.pnm-pwdreset #wpmem_login .form,
.pnm-pwdreset #wpmem_pwdreset_form {
	display: block;
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	box-sizing: border-box;
}
.pnm-pwdreset #wpmem_login fieldset {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}

/* --- 見出し（legend）。既定は 24px・紫・line-height:1。文言は変更しない --- */
.pnm-pwdreset #wpmem_login legend {
	display: block;
	float: none;
	width: 100%;
	margin: 0 0 18px;
	padding: 0;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.5;
	color: #333333 !important;
	text-align: left;
}

/* --- ラベル・行（入力欄の上・左寄せ） --- */
.pnm-pwdreset #wpmem_login label {
	display: block;
	margin: 0 0 10px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
	color: #2B2B2B;
	text-align: left;
}
.pnm-pwdreset #wpmem_login .div_text {
	margin: 0 0 24px;
}

/* --- 入力欄（W-17：iOS の自動ズーム対策で 16px 下限） --- */
.pnm-pwdreset #wpmem_login input[type="text"],
.pnm-pwdreset #wpmem_login input[type="email"] {
	display: block;
	width: 100%;
	box-sizing: border-box;
	min-height: 44px;
	padding: 12px 14px;
	font-size: 16px;
	line-height: 1.6;
	color: #2B2B2B;
	background: #ffffff;
	border: 1.5px solid #E5E7EB;
	border-radius: 8px;
}
.pnm-pwdreset #wpmem_login input[type="text"]:focus,
.pnm-pwdreset #wpmem_login input[type="email"]:focus {
	border-color: #7CB342;
	box-shadow: 0 0 0 3px rgba( 124, 179, 66, 0.15 );
	outline: none;
}
.pnm-pwdreset #wpmem_login input::placeholder {
	color: #A9B0BB;
}

/* --- 送信ボタン（既定は紫・全幅）。ピル型の緑へ --- */
.pnm-pwdreset #wpmem_login .button_div {
	margin: 0;
	text-align: center;
}
.pnm-pwdreset #wpmem_login .button_div input[type="submit"],
.pnm-pwdreset #wpmem_login .button_div input.buttons {
	display: block;
	width: 100%;
	box-sizing: border-box;
	min-height: 44px;
	padding: 12px 24px;
	font-size: 15px;
	font-weight: 700;
	color: #ffffff !important;
	background: #7CB342 !important;
	border: none !important;
	border-radius: 9999px;
	box-shadow: 0 8px 20px rgba( 124, 179, 66, 0.30 );
	text-shadow: none;
	cursor: pointer;
}
.pnm-pwdreset #wpmem_login .button_div input[type="submit"]:hover,
.pnm-pwdreset #wpmem_login .button_div input[type="submit"]:focus,
.pnm-pwdreset #wpmem_login .button_div input.buttons:hover,
.pnm-pwdreset #wpmem_login .button_div input.buttons:focus {
	background: #689A38 !important;
	color: #ffffff !important;
}

/* --- 2つのリンク行（ユーザー名忘れ・確認リンク再送）。href・機能・DOM は変更しない --- */
.pnm-pwdreset #wpmem_login .link-text {
	margin: 18px 0 0;
	font-size: 13.5px;
	line-height: 1.8;
	color: #6B7280;
	text-align: center;
}
.pnm-pwdreset #wpmem_login .link-text a {
	color: #689A38 !important;
	font-weight: 700;
	text-decoration: underline;
}

/* --- 確認リンクの再送だけ目立たせる（未確認ユーザーの正しい導線はこちら） --- */
.pnm-pwdreset #wpmem_login .link-text-reconfirm {
	display: block;
	margin: 0;
	padding: 16px 18px;
	background: #EFF6E4;
	border: 1px solid #D5E5BC;
	border-radius: 16px;
	font-size: 14.5px;
	font-weight: 700;
	color: #2B2B2B;
	box-sizing: border-box;
}
.pnm-pwdreset #wpmem_login .link-text-reconfirm a {
	display: inline-block;
	margin-top: 10px;
	padding: 10px 22px;
	background: #ffffff;
	border: 1.5px solid #7CB342;
	border-radius: 9999px;
	color: #689A38 !important;
	font-size: 14px;
	font-weight: 800;
	text-decoration: none;
}
.pnm-pwdreset #wpmem_login .link-text-reconfirm a:hover,
.pnm-pwdreset #wpmem_login .link-text-reconfirm a:focus {
	background: #EFF6E4;
	color: #689A38 !important;
}

/* --- スマホ幅（screen 限定・既存のメディアクエリとは無関係の新規） --- */
@media screen and ( max-width: 520px ) {
	.pnm-pwdreset {
		padding: 16px 12px 32px;
	}
	.pnm-pwdreset #wpmem_login {
		padding: 24px 18px;
	}
	.pnm-pwdreset .pnm-pwdreset__notice {
		padding: 16px 16px;
	}
}