/* Account recovery and allauth fallbacks share the login page's font and surfaces. */
.wm-account-panel { max-width: 520px; }
.wm-account-content { min-width: 0; overflow-wrap: anywhere; }
.wm-account-content h1 {
    margin: 0 0 18px;
    color: var(--login-ink);
    font-size: clamp(24px, 4.5vw, 30px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.04em;
    text-align: center;
    word-break: keep-all;
}
.wm-account-content h2 { margin: 28px 0 14px; font-size: 20px; font-weight: 700; }
.wm-account-content p { margin: 0 0 18px; line-height: 1.7; word-break: keep-all; }
.wm-account-content .wm-account-intro { margin-bottom: 28px; color: var(--login-muted); font-size: 15px; text-align: center; }
.wm-account-email { color: var(--login-ink); word-break: break-all; }
.wm-account-content .wm-account-back { margin: 22px 0 0; text-align: center; font-size: 14px; }
.wm-account-content a:not(.wm-cta), .wm-account-navigation a { color: var(--login-accent); text-decoration: underline; text-underline-offset: 4px; }
.wm-account-page .wm-cta.wm-cta { font-family: inherit; }
.wm-account-navigation { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 18px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--login-line); font-size: 13px; }

/* Allauth's generic form elements have no utility classes. Keep these rules local. */
.wm-account-content form { margin-top: 24px; }
.wm-account-content label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 600; }
.wm-account-content input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.wm-account-content :is(textarea, select) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 52px;
    padding: 13px 15px;
    border: 1px solid var(--login-line);
    border-radius: 12px;
    background: var(--login-input-surface);
    color: var(--login-ink);
    font: inherit;
    font-size: 16px;
}
.wm-account-content :is(input, textarea, select):focus-visible { outline: 2px solid var(--login-focus-color); outline-offset: 2px; }
.wm-account-content :is(input, textarea)::placeholder { color: var(--login-muted); opacity: 1; }
.wm-account-content :is(input, textarea, select):disabled { opacity: 1; color: var(--login-muted); }
.wm-account-content :is(.helptext, .wm-login-help) { display: block; margin-top: 8px; color: var(--login-muted); font-size: 13px; line-height: 1.65; }
.wm-account-content .helptext ul { padding-left: 18px; }
.wm-account-content .errorlist { margin: 6px 0 12px; padding: 0; list-style: none; color: var(--wm-mode-red, #b52f4c); font-size: 13px; line-height: 1.65; }
.wm-account-content hr { margin: 24px 0; border-color: var(--login-line); }
html[data-wm-theme] .wm-account-page button:not(.wm-cta) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    max-width: 100%;
    margin: 6px 4px 6px 0;
    padding: 10px 18px;
    border: 1px solid #7250b4;
    border-radius: 12px;
    background: var(--wm-cta-fill);
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    word-break: keep-all;
}
html[data-wm-theme] .wm-account-page button[name="action_remove"] { background: var(--wm-mode-red-soft, #fff1f3); color: var(--wm-mode-red, #b52f4c); border-color: currentColor; box-shadow: none; }
html[data-wm-theme] .wm-account-page button:disabled { background: var(--login-input-surface); color: var(--login-muted); border-color: var(--login-line); box-shadow: none; cursor: not-allowed; }
@media (max-width: 479px) {
    .wm-account-page .wm-account-panel { max-width: 400px; }
}
@media (forced-colors: active) {
    html[data-wm-theme] .wm-account-page button:not(.wm-cta) { color: ButtonText; background: ButtonFace; border-color: ButtonText; box-shadow: none; }
    .wm-account-content input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
    .wm-account-content :is(textarea, select) { color: CanvasText; background: Canvas; border-color: ButtonText; }
}