{% extends "base.html" %}

{% block title %}{{ page_title }}{% endblock %}

{% block content %}
<main class="container narrow-section">
  <div class="page-head">
    <h1>Создать героя</h1>
    <p class="muted">Выберите происхождение и начните охоту за тайной Чёрной Трясины.</p>
  </div>
  <div class="glass-card form-card">
    <form method="post" class="form-grid">
      {% csrf_token %}
      <div>
        <label class="form-label" for="{{ form.name.id_for_label }}">Имя героя</label>
        {{ form.name }}
        {% if form.name.errors %}
        <div class="form-error">{{ form.name.errors|striptags }}</div>
        {% endif %}
      </div>
      <div>
        <label class="form-label" for="{{ form.background.id_for_label }}">Происхождение</label>
        {{ form.background }}
        {% if form.background.errors %}
        <div class="form-error">{{ form.background.errors|striptags }}</div>
        {% endif %}
      </div>
      <div class="form-hint">
        <strong>Подсказка:</strong> выбор происхождения задаёт стартовые навыки.
      </div>
      <button type="submit" class="btn btn-primary btn-lg">Сотворить героя</button>
    </form>
  </div>
</main>
{% endblock %}