{% extends 'layouts/base.html.twig' %}
{% block body %}
	<section id="register" class="contact section">
		<div class="container" data-aos="fade-up" data-aos-delay="100">
			<div class="row gy-4">
				{% for flash_error in app.flashes('verify_email_error') %}
					<div class="alert alert-danger" role="alert">{{ flash_error }}</div>
				{% endfor %}
				<br>
				<br>
				<h1>Inscription</h1>

				<div class="col-lg-6 order-2 order-lg-1 d-flex flex-column justify-content-center">
					<div class="row gy-4">
						<div class="col-md-6">
							<div class="info-item" data-aos="fade" data-aos-delay="200">
								<i class="bi bi-geo-alt"></i>
								<h3>Adresse</h3>
								<p>17, rue Elisabeth Paulbert</p>
								<p>Pointe-Noire, Congo</p>
							</div>
						</div>
						<!-- End Info Item -->

						<div class="col-md-6">
							<div class="info-item" data-aos="fade" data-aos-delay="300">
								<i class="bi bi-telephone"></i>
								<h3>Appelez-nous</h3>
								<p>04 474 7447</p>
								<p>&nbsp;</p>

							</div>
						</div>
						<!-- End Info Item -->

						<div class="col-md-6">
							<div class="info-item" data-aos="fade" data-aos-delay="400">
								<i class="bi bi-envelope"></i>
								<h3>Email</h3>
								<p>contact@kerenes-digital.com</p>
								<p>&nbsp;</p>
							</div>
						</div>
						<!-- End Info Item -->

						<div class="col-md-6">
							<div class="info-item" data-aos="fade" data-aos-delay="500">
								<i class="bi bi-clock"></i>
								<h3>Open Hours</h3>
								<p>Monday - Friday</p>
								<p>9:00AM - 05:00PM</p>
							</div>
						</div>
						<!-- End Info Item -->

					</div>
				</div>

				<div class="col-lg-6 order-1 order-lg-2 hero-img" data-aos="zoom-out">
					{{ form_start(registrationForm) }}
					<div class="row gy-4">
						<div class="col-md-12">
							{{ form_label(registrationForm.lastname) }}&nbsp;*
							<div class="input-group">
								<span class="input-group-text">
									<i class="bi bi-person"></i>
								</span>
								{{ form_widget(registrationForm.lastname, {'attr': {'class': 'form-control'}}) }}
							</div>
							<div>
								{{ form_errors(registrationForm.lastname) }}
							</div>
						</div>

						<div class="col-md-12">
							{{ form_label(registrationForm.firstname) }}&nbsp;*
							<div class="input-group">
								<span class="input-group-text">
									<i class="bi bi-person"></i>
								</span>
								{{ form_widget(registrationForm.firstname, {'attr': {'class': 'form-control'}}) }}
							</div>
							<div>
								{{ form_errors(registrationForm.firstname) }}
							</div>
						</div>

						<div class="col-md-12">
							{{ form_label(registrationForm.currency) }}&nbsp;*
							<div class="input-group">
								<span class="input-group-text">
									<i class="bi bi-currency-euro"></i>
								</span>
								{{ form_widget(registrationForm.currency, {'attr': {'class': 'form-control'}}) }}
							</div>
							<div>
								{{ form_errors(registrationForm.currency) }}
							</div>
						</div>

						<div class="col-md-12">
							{{ form_label(registrationForm.email) }}&nbsp;*
							<div class="input-group">
								<span class="input-group-text">
									<i class="bi bi-at"></i>
								</span>
								{{ form_widget(registrationForm.email, {'attr': {'class': 'form-control'}}) }}
							</div>
							<div>
								{{ form_errors(registrationForm.email) }}
							</div>
						</div>

						<div class="col-md-12">
							{{ form_label(registrationForm.plainPassword) }}&nbsp;*
							<div class="input-group">
								<span class="input-group-text">
									<i class="bi bi-lock"></i>
								</span>
								{{ form_widget(registrationForm.plainPassword, {'attr': {'class': 'form-control'}}) }}
							</div>
							<div>
								{{ form_errors(registrationForm.plainPassword) }}
							</div>
						</div>


						<div class="col-md-12 text-center">
							<button style="font-size:18px;" class="btn btn-primary" type="submit">Inscription</button>
						</div>
					</div>
					{{ form_end(registrationForm) }}
					<div style="display: flex; align-items: center; height: 50px; font-size:18px;" class="text-center">
						Déjà inscrit ?
						<a href="{{ path('app_login') }}">Cliquez ici</a>
					</div>
				</div>
			</div>
		</div>
	</section>
{% endblock %}
{% block heros %}
	{{ include('layouts/partials/_heros.html.twig') }}
{% endblock %}
{% block footer %}
	{{ parent() }}
{% endblock %}