{% extends "admin/base_site.html" %}
{% load i18n static %}

{% block bodyclass %}{{ block.super }} login hulu-admin-login{% endblock %}
{% block nav-sidebar %}{% endblock %}
{% block breadcrumbs %}{% endblock %}
{% block nav-global %}{% endblock %}
{% block content_title %}{% endblock %}

{% block content %}
<div class="hulu-login-shell">
  <section class="hulu-login-intro">
    <span class="hulu-eyebrow">HULU MATH OPERATIONS</span>
    <h1>管理数学人生宇宙</h1>
    <p>发布内容、维护剧情、组织比赛，并查看真实用户的成长轨迹。</p>
    <div class="hulu-login-points">
      <span>用户与邀请码</span>
      <span>剧情与 MathBTI</span>
      <span>比赛与内容运营</span>
    </div>
  </section>

  <section class="hulu-login-card">
    <div>
      <span class="hulu-eyebrow">STAFF SIGN IN</span>
      <h2>后台登录</h2>
      <p>仅限已授权的运营和管理员账号。</p>
    </div>

    {% if form.errors and not form.non_field_errors %}
      <p class="errornote">用户名或密码不正确，请重新输入。</p>
    {% endif %}
    {% if form.non_field_errors %}
      {% for error in form.non_field_errors %}
        <p class="errornote">{{ error }}</p>
      {% endfor %}
    {% endif %}

    <form action="{{ app_path }}" method="post" id="login-form">
      {% csrf_token %}
      <div class="form-row">
        {{ form.username.errors }}
        <label for="{{ form.username.id_for_label }}">用户名</label>
        {{ form.username }}
      </div>
      <div class="form-row">
        {{ form.password.errors }}
        <label for="{{ form.password.id_for_label }}">密码</label>
        {{ form.password }}
        <input type="hidden" name="next" value="{{ next }}">
      </div>
      {% url 'admin_password_reset' as password_reset_url %}
      {% if password_reset_url %}
        <div class="password-reset-link">
          <a href="{{ password_reset_url }}">忘记密码？</a>
        </div>
      {% endif %}
      <div class="submit-row">
        <input type="submit" value="进入运营后台">
      </div>
    </form>
    <a class="hulu-back-site" href="/">← 返回葫芦数学网站</a>
  </section>
</div>
{% endblock %}