{% extends "base.html.twig" %}

{% block title %}
	{{ parent() }}
	Accueil
{% endblock %}

{% block content %}
	<!DOCTYPE html>
	<html lang="fr">
		<head>
			<meta charset="UTF-8">
			<meta name="viewport" content="width=device-width, initial-scale=1.0">
			<title>Page de Connexion</title>
			<style>

				body {
					font-family: Arial, sans-serif;
					text-align: center;
					padding: 50px;
				}

				.login-box {
					max-width: 400px;
					margin: auto;
					background-color: #fff;
					padding: 30px;
					border-radius: 10px;
					box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
				}
				.form-group {
					margin-top: 20px;
					margin-bottom: 20px;
					text-align: left;
				}
				.form-group label {
					display: block;
					font-weight: bold;
					margin-bottom: 5px;
				}
				.form-group input {
					width: 100%;
					padding: 8px;
					border: 1px solid #ccc;
					border-radius: 4px;
				}
				.form-group button {
					padding: 10px 20px;
					background-color: #007bff;
					border: none;
					color: #fff;
					border-radius: 4px;
					cursor: pointer;
				}
				img {
					margin-top: 10%;
					margin-left: 0;
					width: 85%;
				}
				p {
					margin-left: 10px;
					font-size: 12px;
					text-align: left;
				}
				a {
					text-decoration: none;
					color: #007bff;
				}
			</style>
		</head>
		<body>
			<div class="login-box">
				<h2>S'inscrire</h2>
				<br>
				<h3>veuillez rentrer vos informations s'il vous plait</h3>
				<form action="" method="post">
					<div class="form-group">
						<label for="nom">Nom :</label>
						<input type="text" id="nom" name="nom" required placeholder="nom">
					</div>
					<div class="form-group">
						<label for="prenom">prenom :</label>
						<input type="text" id="prenom" name="prenom" required placeholder="prenom">
					</div>
					<div class="form-group">
						<label for="num_telephone">Numéro de telephone :</label>
						<input type="text" id="num_telephone" name="num_telephone" required placeholder="Numéro de telephone">
					</div>
					<div class="form-group">
						<label for="mail">adresse mail :</label>
						<input type="mail" id="mail" name="mail" required placeholder="mail">
					</div>
					<div class="form-group">
						<label for="mot_de_passe">mot de passe :</label>
						<input type="password" id="mot_de_passe" name="mot_de_passe" required placeholder="mot de passe">
					</div>
					<p>Vous étes déjà inscript ?
						<a href="index.php?page=connexion">
							connectez-vous
						</a>
					</p>
					<div class="form-group">
						<button type="submit" class="btn btn-primary" >S'enregistrer</button>
					</div>
				</div>
			</body>
		</body>
	</html>

{% endblock %}
