{% extends 'diary/base.html' %}
{% block title %}Register{% endblock %}
{% block content %}
<div class="auth-page">
  <div class="auth-card">
    <h1>Create an account 📓</h1>
    <form method="post" class="diary-form">
      {% csrf_token %}
      {% for field in form %}
        <div class="form-group">
          <label for="{{ field.id_for_label }}">{{ field.label }}</label>
          <input type="{{ field.field.widget.input_type }}"
                 id="{{ field.id_for_label }}"
                 name="{{ field.html_name }}"
                 class="input"
                 {% if field.field.required %}required{% endif %}>
          {% if field.help_text %}
            <span class="field-hint">{{ field.help_text }}</span>
          {% endif %}
          {% if field.errors %}
            <span class="field-error">{{ field.errors|join:', ' }}</span>
          {% endif %}
        </div>
      {% endfor %}
      <button type="submit" class="btn btn-primary btn-full">Register</button>
    </form>
    <p class="auth-footer">Already have an account? <a href="{% url 'login' %}">Login</a></p>
  </div>
</div>
{% endblock %}