<div class="row">
	<div class="col-12 col-md-6 col-lg-4 mx-auto">
		<h1 class="h3 my-3 text-center">Login</h1>
		{% autoescape %}
			{{ message|raw }}
		{% endautoescape %}
		<div class="mb-3">
			<em class="fas fa-asterisk fa-xs text-danger mr-2"></em>Required
		</div>
		<form id="frmLogin" action="{{ loginURL }}" method="post" class="needs-validation" autocomplete="off" novalidate>
			<div class="form-group">
				<label for="txtUsername">
					Username<em class="fas fa-asterisk fa-xs text-danger ml-2"></em>
				</label>
				<input type="text" id="txtUsername" name="username" class="form-control" placeholder="Insert your username/email" data-error-required="The username/email is required" required>
				<div class="invalid-feedback"></div>
			</div>
			<div class="form-group">
				<label for="txtPassword">
					Password<em class="fas fa-asterisk fa-xs text-danger ml-2"></em>
				</label>
				<input type="password" autocomplete="false" id="txtPassword" name="password" class="form-control" placeholder="Insert your password" data-error-required="The password is required" required>
				<div class="invalid-feedback"></div>
			</div>
			<div class="form-group">
				<div class="custom-control custom-checkbox">
					<input type="checkbox" class="custom-control-input" id="remember" name="remember" value="1">
					<label class="custom-control-label" for="remember">Remember Me</label>
				</div>
			</div>
			<div class="form-group text-center">
				<div class="form-row">
					<div class="col">
						{% if recaptcha_site_key %}
							<div id="g-recaptcha" class="g-recaptcha" data-sitekey="{{ recaptcha_site_key }}" data-size="invisible" data-callback="gCallback"></div>
							<input type="hidden" id="captcha" name="captcha">
						{% endif %}
						<button type="submit" name="submit" class="btn btn-custom btn-block">
							<em class="fas fa-lock mr-2"></em>Login
						</button>
					</div>
					{% if disable_registration %}
						{% else %}
							<div class="col">
								<a href="{{ registerURL }}" class="btn btn-block btn-secondary">
									Register<em class="fas fa-arrow-right ml-2"></em>
								</a>
							</div>
					{% endif %}
				</div>
			</div>
		</form>
	</div>
</div>
