{{template "header" .}}
{{template "member_auth_card_start"}}
<h1 class="text-2xl font-bold text-white mb-2">找回密码</h1>
<p class="text-sm text-gray-400 mb-6">输入注册邮箱，我们将发送验证码</p>
<form data-bj-member-form="reset" class="space-y-4">
    <div>
        <label class="block text-sm text-gray-300 mb-1.5 mb-2" for="member-email">邮箱</label>
        <input id="member-email" name="email" type="email" autocomplete="email" required
            class="w-full px-4 py-2.5 rounded-md bg-black/40 border border-white/10 text-white outline-none focus:border-gold-500/50"
            placeholder="you@example.com">
    </div>
    <div>
        <label class="block text-sm text-gray-300 mb-1.5 mb-2" for="member-code">验证码</label>
        <div class="flex gap-2">
            <input id="member-code" name="code" type="text" inputmode="numeric" maxlength="6" required
                class="flex-1 px-4 py-2.5 rounded-md bg-black/40 border border-white/10 text-white outline-none focus:border-gold-500/50"
                placeholder="6 位验证码">
            <button type="button" data-bj-send-code="reset"
                class="shrink-0 px-4 py-2.5 rounded-md border border-gold-500/30 text-gold-400 text-sm font-medium hover:bg-gold-500/10 transition-colors whitespace-nowrap">
                获取验证码
            </button>
        </div>
    </div>
    <div>
        <label class="block text-sm text-gray-300 mb-1.5 mb-2" for="member-password">新密码</label>
        <input id="member-password" name="password" type="password" autocomplete="new-password" required
            class="w-full px-4 py-2.5 rounded-md bg-black/40 border border-white/10 text-white outline-none focus:border-gold-500/50"
            placeholder="至少 8 位，含字母和数字">
    </div>
    <div data-bj-member-error class="hidden text-sm text-red-400"></div>
    <button type="submit" data-bj-member-submit
        class="w-full py-2.5 rounded-md bg-gradient-to-r from-gold-400 to-gold-600 text-black font-bold hover:from-gold-300 hover:to-gold-500 transition-all">
        重置密码
    </button>
</form>
<p class="mt-6 text-center text-sm text-gray-400">
    <a href="{{get_option `login_url`}}" class="text-gold-400 hover:text-gold-300">返回登录</a>
</p>
{{template "member_auth_card_end"}}
{{template "footer" .}}