{% extends "base.html" %}

{% block title %}
Register
{% endblock %}

{% block content %}
<div class="form-container">
    {% if messages %}
    <ul class="error-messages">
        {% for message in messages %}
        <li>{{ message }}</li>
        {% endfor %}
    </ul>
    {% endif %}

    <form method="post" class="user-form">
        {% csrf_token %}

        <div class="form-group">
            <label for="{{ form.username.id_for_label }}">Username</label>
            {{ form.username }}
            {% if form.username.errors %}
            <div class="error-messages">
                {{ form.username.errors }}
            </div>
            {% endif %}
        </div>

        <div class="form-group">
            <label for="{{ form.password1.id_for_label }}">Password</label>
            {{ form.password1 }}
            {% if form.password1.errors %}
            <div class="error-messages">
                {{ form.password1.errors }}
            </div>
            {% endif %}
        </div>

        <div class="form-group">
            <label for="{{ form.password2.id_for_label }}">Confirm Password</label>
            {{ form.password2 }}
            {% if form.password2.errors %}
            <div class="error-messages">
                {{ form.password2.errors }}
            </div>
            {% endif %}
        </div>

        <button type="submit" class="btn">Register</button>
    </form>
</div>
{% endblock %}