<form class="card card-md" action="{{ site.base }}/" method="get" autocomplete="off" novalidate>
	<div class="card-body">
		<h2 class="card-title text-center mb-4">Create new account</h2>

		<div class="mb-3">
			<label class="form-label">Name</label>
			<input type="text" class="form-control" placeholder="Enter name">
		</div>
		<div class="mb-3">
			<label class="form-label">Email address</label>
			<input type="email" class="form-control" placeholder="Enter email">
		</div>
		<div class="mb-3">
			<label class="form-label">Password</label>
			{% include ui/form/input-group.html type="password" append-button="eye:Show password" flat=true placeholder="Password" %}
		</div>
		<div class="mb-3">
			<label class="form-check">
				<input type="checkbox" class="form-check-input"/>
				<span class="form-check-label">Agree the <a href="{{ site.base }}/terms-of-service.html" tabindex="-1">terms and policy</a>.</span>
			</label>
		</div>

		<div class="form-footer">
			<button type="submit" class="btn btn-primary w-100">Create new account</button>
		</div>
	</div>
</form>

<div class="text-center text-muted mt-3">
	Already have account? <a href="{{ site.base }}/sign-in.html" tabindex="-1">Sign in</a>
</div>