{extends file="views/layout.tpl"}
{block name="title" append} - Inscription{/block}

{block name="content"}
<!-- Page : Inscription -->

<div class="py-5">

	<!-- Centrage horizontal du formulaire -->
	<div class="row justify-content-center">
		<div class="col-12 col-md-10 col-lg-6">

			<!-- Carte contenant le formulaire d'inscription -->
			<div class="card shadow-sm border-0 rounded-4 p-4 p-lg-5">

				<!-- Titre principal de la page -->
				<h1 class="h3 fw-bold mb-1">Inscription</h1>

				<!-- Texte descriptif -->
				<p class="text-secondary mb-4">
					Créez votre compte utilisateur.
				</p>

				<!-- Formulaire d'inscription -->
				<!-- Les données seront traitées côté serveur en PHP via la méthode POST -->
				<form method="POST">
					<div class="row g-3">

						<!-- Champ : prénom de l'utilisateur -->
						<div class="col-md-6">
							<label class="form-label" for="user_firstname">
								Prénom *
							</label>
							<input
								class="form-control"
								type="text"
								id="user_firstname"
								name="user_firstname"
								value="{$objUser->getFirstname()|default:''}"
								required
							>
						</div>

						<!-- Champ : nom de l'utilisateur -->
						<div class="col-md-6">
							<label class="form-label" for="user_name">
								Nom *
							</label>
							<input
								class="form-control"
								type="text"
								id="user_name"
								name="user_name"
								value="{$objUser->getName()|default:''}"
								required
							>
						</div>

						<!-- Champ : pseudo -->
						<div class="col-12">
							<label class="form-label" for="user_pseudo">
								Pseudo *
							</label>
							<div class="input-group">
								<span class="input-group-text">@</span>
								<input
									class="form-control"
									type="text"
									id="user_pseudo"
									name="user_pseudo"
									value="{$objUser->getPseudo()|default:''}"
									required
								>
							</div>
						</div>

						<!-- Champ : adresse e-mail -->
						<div class="col-12">
							<label class="form-label" for="user_mail">
								Adresse e-mail *
							</label>
							<input
								class="form-control"
								type="email"
								id="user_mail"
								name="user_mail"
								value="{$objUser->getMail()|default:''}"
								required
							>
						</div>

						<!-- Champ : mot de passe -->
						<div class="col-12">
							<label class="form-label" for="user_password">
								Mot de passe *
							</label>
							<input
								class="form-control"
								type="password"
								id="user_password"
								name="user_password"
								required
							>
						</div>

						<!-- Champ : confirmer le mot de passe -->
						<div class="col-12">
							<label class="form-label" for="pwd_confirm">
								Confirmer le mot de passe *
							</label>
							<input
								class="form-control"
								type="password"
								id="pwd_confirm"
								name="pwd_confirm"
								required
							>
						</div>

						<!-- Champ optionnel : numéro de téléphone -->
						<div class="col-12">
							<label class="form-label" for="user_phone">
								Téléphone
							</label>
							<input
								class="form-control"
								type="text"
								id="user_phone"
								name="user_phone"
								value="{$objUser->getPhone()|default:''}"
							>
						</div>

						<!-- Champ optionnel : profession de l'utilisateur -->
						<div class="col-12">
							<label class="form-label" for="user_work">
								Profession
							</label>
							<input
								class="form-control"
								type="text"
								id="user_work"
								name="user_work"
								value="{$objUser->getWork()|default:''}"
							>
						</div>

						<!-- Champ optionnel : localisation de l'utilisateur -->
						<div class="col-12">
							<label class="form-label" for="user_location">
								Localisation
							</label>
							<input
								class="form-control"
								type="text"
								id="user_location"
								name="user_location"
								value="{$objUser->getLocation()|default:''}"
							>
						</div>

						<!-- Champ optionnel : phrase d'accroche -->
						<div class="col-12">
							<label class="form-label" for="user_description">
								Phrase d'accroche
							</label>
							<textarea
								class="form-control"
								id="user_description"
								name="user_description"
								value="{$objUser->getDescription()|default:''}"
								rows="3"
							></textarea>
						</div>

						<!-- Bouton de soumission du formulaire -->
						<div class="col-12 d-grid mt-2">
							<button type="submit" class="btn btn-primary btn-lg rounded-3">
								Créer mon compte
							</button>
						</div>

						<!-- Lien vers la page de connexion -->
						<div class="col-12 text-center">
							<small class="text-secondary">
								Déjà un compte ?
								<a class="link-primary" href="index.php?ctrl=user&action=login">
									Se connecter
								</a>
							</small>
						</div>

					</div>
				</form>

			</div>

		</div>
	</div>

</div>
{/block}