/* ── Reset password pages ─────────────────────────────────────────────────
   /reset-password/ (ask for the email) and /reset-password/new/ (the page the
   emailed link lands on). Both sit on top of contact.css: same panel, same pill
   button, so this file only adds the form fields and the status line. Every
   selector is under .reset-page.

   [PASSWORD-RESET 2026-10-05] contact.css sets .contact-button to inline-flex,
   which beats the browser's own [hidden] rule, so a hidden button would stay on
   screen. [hidden] is restated below for everything on these pages. */
.reset-page [hidden]{display:none!important}
.reset-form{display:flex;flex-direction:column;gap:12px;max-width:440px}
.reset-form label{font-size:13.5px;letter-spacing:.01em;color:#8b8b8b}
.reset-form label+.reset-input{margin-top:-4px}
.reset-input{width:100%;padding:15px 18px;border:1px solid #ffffff26;border-radius:14px;background:#ffffff0a;color:inherit;font:inherit;font-size:16px}
.reset-input:focus{outline:2px solid #c8c8c8;outline-offset:2px;border-color:transparent}
.reset-form .contact-button{border:0;align-self:flex-start;margin-top:6px}
.reset-page .contact-button[disabled]{opacity:.55;cursor:default;transform:none}
.reset-page .reset-status{font-size:16px;line-height:1.7;margin:22px 0 0;padding:14px 18px;border-radius:14px;border:1px solid #ffffff1f;background:#ffffff08;color:#e6e6e6;max-width:40em}
.reset-form[hidden]+.reset-status{margin-top:0}
.reset-page .reset-status.is-error{border-color:#b3261e80;background:#b3261e14}
html[data-theme=light] .reset-form label{color:#767676}
html[data-theme=light] .reset-input{border-color:#00000026;background:#fff}
html[data-theme=light] .reset-input:focus{outline-color:#333}
html[data-theme=light] .reset-page .reset-status{border-color:#00000018;background:#00000005;color:#222}
html[data-theme=light] .reset-page .reset-status.is-error{border-color:#b3261e66;background:#b3261e0d}
@media(max-width:600px){.reset-form{max-width:none}.reset-form .contact-button{align-self:stretch}}
/* Show-password toggle. A real checkbox in a label, so it is keyboard- and
   screen-reader-operable with no extra ARIA, and the whole line is clickable. */
.reset-form .reset-show{display:inline-flex;align-items:center;gap:9px;align-self:flex-start;font-size:14.5px;color:#aaa;cursor:pointer;margin-top:2px}
.reset-show input{width:17px;height:17px;margin:0;accent-color:#f5f5f5;cursor:pointer}
html[data-theme=light] .reset-form .reset-show{color:#555}
html[data-theme=light] .reset-show input{accent-color:#171b18}

/* Smoother: no panel box, no status box - just the form on the page and
   plain status text under it. Scoped to .reset-page so the support page
   keeps its panel. */
.reset-page .contact-panel{background:none;border:0;box-shadow:none;padding:0}
.reset-page .reset-status{border:0;background:none;padding:0;color:#9a9a9a}
.reset-page .reset-status.is-error{border:0;background:none;color:#e5484d}
html[data-theme=light] .reset-page .reset-status{border:0;background:none;color:#555}
html[data-theme=light] .reset-page .reset-status.is-error{background:none;color:#b3261e}
