{{ form:benevole }}
                    <h4 class="uppercase mt48 mt-xs-0">Devenir bénévole</h4>
                    <p class="lead mb64 mb-xs-24">
                        Vous souhaitez vous impliquer et contribuer à la réussite de notre Pride ? Devenez bénévole et participez à cette expérience enrichissante ! Remplissez simplement le formulaire ci-dessous pour rejoindre notre équipe.
                    </p>


                    {{ if success }}
                        <div class="bg-green-300 text-white p-2">
                            {{ success }}
                        </div>
                    {{ else }}
                        <div>
                            <hr>
                            <h6 class="uppercase">
                                1. Comment te nommes-tu?
                            </h6>
                            {{ fields }}
                            {{ if type == "text" }}
                                {{ if handle == "email"}}
                                    </div><div>
                                    <hr>
                                    <h6 class="uppercase">
                                        3. Pour te contacter
                                    </h6>
                                    <input type="email" class="col-md-6 validate-required validate-email{{ if error }} field-error mb0{{ /if }}" name="{{handle}}" placeholder="{{ display }}" value="{{ old }}" />
                                {{ elseif handle == "street" }}
                                </div><div>
                                    <hr>
                                    <h6 class="uppercase">
                                        4. Ton adresse
                                    </h6>
                                    <input type="text" class="col-md-12 validate-required{{ if error }} field-error mb0{{ /if }}" name="{{handle}}" placeholder="{{ display }}" value="{{ old }}" />
                                {{ elseif handle == "city" }}
                                    <input type="text" class="col-md-12 validate-required {{ if error }} field-error mb0{{ /if }}" name="{{handle}}" placeholder="{{ display }}" value="{{ old }}" />
                                {{ elseif handle == "birthdate" }}
                                </div><div>
                                    <hr>
                                    <h6 class="uppercase">
                                        5. Ta date de naissance
                                    </h6>
                                    <input type="date" class="col-md-6 col-md-offset-3 {{ if error }} field-error mb0{{ /if }}" name="{{handle}}" placeholder="{{ display }}" value="{{ old }}" />
                                {{ else }}
                                    <input type="text" class="col-md-6 validate-required{{ if error }} field-error mb0{{ /if }}" name="{{handle}}" placeholder="{{ display }}" value="{{ old }}" />
                                {{ /if }}
                            {{ elseif type == "radio" }}
                                </div><div>
                                <hr>
                                <h6 class="uppercase">
                                    2. Comment doit-on te genrer?
                                </h6>
                                    <div class="col-sm-4 col-xs-4">
                                        <p>Il</p>
                                        <div class="radio-option">
                                            <div class="inner"></div>
                                            <input type="radio" name="gender" value="il" />
                                        </div>
                                    </div>
                              <div class="col-sm-4 col-xs-4">
                                        <p>Elle</p>
                                        <div class="radio-option">
                                            <div class="inner"></div>
                                            <input type="radio" name="gender" value="elle" />
                                        </div>
                                    </div>
                              <div class="col-sm-4 col-xs-4">
                                        <p>Iel</p>
                                        <div class="radio-option">
                                            <div class="inner"></div>
                                            <input type="radio" name="gender" value="iel" />
                                        </div>
                                    </div>
                            {{ elseif type == "textarea" }}
                            </div><div>
                                <hr>
                                <h6 class="uppercase">
                                    6. Des remarques?
                                </h6>
                                <textarea class="{{ if error }} field-error mb0{{ /if }}" name="{{ handle }}" rows="4" placeholder="{{ display }}">{{ old }}</textarea>
                            {{ /if }}
                            {{ if error }}
                                <p class="text-gray-500">Ce champs est obligatoire</p>
                            {{ /if }}
                            {{ /fields }}
                        </div>
                        <input type="text" class="hidden" name="{{ honeypot ?? 'honeypot' }}">

                        <button type="submit">S'inscrire</button>
                    {{ /if }}
                {{ /form:benevole }}