{% extends 'layouts/security/security.html.twig' %}

{% block title %}{{ context.get['app'] ? context.get['app'].name : company_name }} - {{ title }}{% endblock %}

{% block body %}
    <div class="w-100">
        <div class="text-center">
            {% include 'layouts/partials/__logo.html.twig' %}
        </div>
        <h4 class="text-center text-lighter font-weight-normal mt-5 mb-0">Espace administration</h4>

        <!-- [ Form ] Start -->
        {{ form_start(form, {'action': path('security_register'), 'attr': {'class': ''}}) }}

            <div class="form-group">
                <small>{{ form_errors(form.nom) }}</small>
                <label class="form-label">* Nom</label>
                {{ form_widget(form.nom) }}
                <div class="clearfix"></div>
            </div>

            <div class="form-group">
                <small>{{ form_errors(form.prenoms) }}</small>
                <label class="form-label">* Prenoms</label>
                {{ form_widget(form.prenoms) }}
                <div class="clearfix"></div>
            </div>

            <div class="form-group">
                <small>{{ form_errors(form.email) }}</small>
                <label class="form-label">* Adresse email</label>
                {{ form_widget(form.email) }}
                <div class="clearfix"></div>
            </div>

            <div class="form-group">
                <small>{{ form_errors(form.contacts) }}</small>
                <label class="form-label">* Contacts</label>
                {{ form_widget(form.contacts) }}
                <div class="clearfix"></div>
            </div>

            <div class="form-group">
                <small>{{ form_errors(form.username) }}</small>
                <label class="form-label">* Nom d'utilisateur</label>
                {{ form_widget(form.username) }}
                <div class="clearfix"></div>
            </div>

            <div class="form-group">
                <small>{{ form_errors(form.password.first) }}</small>
                <label class="form-label d-flex justify-content-between align-items-end">
                    <span>Mot de passe</span>
                </label>
                {{ form_widget(form.password.first) }}
                <div class="clearfix"></div>
            </div>

            <div class="form-group">
                <small>{{ form_errors(form.password.second) }}</small>
                <label class="form-label d-flex justify-content-between align-items-end">
                    <span>Confirmer le mot de passe</span>
                </label>
                {{ form_widget(form.password.second) }}
                <div class="clearfix"></div>
            </div>

            <div class="d-flex justify-content-between align-items-center m-0">
                <button type="submit" class="btn btn-primary"><i class="fa fa-user"></i> S'inscrire</button>
            </div>
        {{ form_end(form) }}
        <!-- [ Form ] End -->

        <div class="text-center text-muted mt-5">
            <a href="{{ path('security_login') }}"><i class="fa fa-arrow-right"></i> &nbsp; Se connecter</a>
        </div>

    </div>
{% endblock %}