{% extends "base.html" %}
{% load i18n %}
{% load widget_tweaks %}

{% block title %}{% trans "Inscription" %} - ServicesCRM{% endblock %}

{% block content %}
<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-12 col-md-8 col-lg-5">
            <div class="card auth-card border-0 shadow-sm">
                <div class="card-body p-4 p-md-5">
                    <h1 class="auth-title mb-3">{% trans "Create an account" %}</h1>
                    <p class="auth-subtitle mb-4">{% trans "Access your space in seconds." %}</p>

                    <form method="post" action="{% url 'account_signup' %}">
                        {% csrf_token %}

                        {% if form.non_field_errors %}
                            <div class="alert alert-danger" role="alert">
                                {% for error in form.non_field_errors %}
                                    <div>{{ error }}</div>
                                {% endfor %}
                            </div>
                        {% endif %}

                        {% for field in form %}
                            {% if field.is_hidden %}
                                {{ field }}
                            {% else %}
                                <div class="mb-3">
                                    <label class="form-label" for="{{ field.id_for_label }}">{% trans field.label %}</label>
                                    {% if field.field.widget.input_type == "text" or field.field.widget.input_type == "password" or field.field.widget.input_type == "email" %}
                                        {{ field|add_class:"form-control auth-text-field" }}
                                    {% else %}
                                        {{ field|add_class:"form-control" }}
                                    {% endif %}
                                    {% if field.help_text %}
                                        <div class="form-text auth-help-text">{{ field.help_text|safe }}</div>
                                    {% endif %}
                                    {% if field.errors %}
                                        <div class="invalid-feedback d-block">
                                            {% for error in field.errors %}
                                                <div>{{ error }}</div>
                                            {% endfor %}
                                        </div>
                                    {% endif %}
                                </div>
                            {% endif %}
                        {% endfor %}

                        {% if redirect_field_value %}
                            <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}">
                        {% endif %}

                        <button class="btn btn-light w-100 fw-semibold" type="submit">{% trans "Register" %}</button>
                    </form>

                    <p class="mb-0 mt-4 text-center text-white-50">
                        {% trans "Already have an account?" %}
                        <a href="{% url 'account_login' %}" class="auth-link">{% trans "Log in" %}</a>
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}