{{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="login" 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 placeholder-gray-500 outline-none focus:border-gold-500/50 transition-colors"
            placeholder="you@example.com">
    </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="current-password" required
            class="w-full px-4 py-2.5 rounded-md bg-black/40 border border-white/10 text-white placeholder-gray-500 outline-none focus:border-gold-500/50 transition-colors"
            placeholder="请输入密码">
    </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 `forgot_password_url`}}" class="text-gold-400 hover:text-gold-300">忘记密码？</a>
    <a href="{{get_option `register_url`}}" class="text-gold-400 hover:text-gold-300">注册账号</a>
</p>
{{template "member_auth_card_end"}}
{{template "footer" .}}