{% include 'overall_header.html' %}

<header class="iz-sectionhead">
	<h1 class="iz-sectionhead__title">{{ SITENAME }}&nbsp;&#45;&nbsp;<small>{{ L_LOGIN_LINK }}</small></h1>
</header>

<div class="iz-alert iz-alert--warning" role="note">
	<strong>{{ L_LOGIN_LINK_EXPLAIN }}</strong>
</div>

{% if LOGIN_LINK_ERROR %}
	<div class="iz-alert iz-alert--warning" role="alert">
		<strong>{{ LOGIN_LINK_ERROR }}</strong>
	</div>
{% endif %}

<section class="iz-layout iz-layout--two iz-layout--loginlink">
	<div class="iz-layout__main">

		{% if S_REGISTER_ENABLED %}
			<section class="iz-card iz-card--register">
				<header class="iz-card__header">
					<h2 class="iz-card__title">{{ L_CREATE_ACCOUNT }}</h2>
				</header>

				<div class="iz-card__body">
					<p class="iz-prose">{{ L_LOGIN_INFO }}</p>

					<p class="iz-meta">
						<a class="iz-link" href="{{ U_TERMS_USE }}">{{ L_TERMS_USE }}</a>
						<span class="iz-sep">|</span>
						<a class="iz-link" href="{{ U_PRIVACY }}">{{ L_PRIVACY }}</a>
					</p>

					<form action="{{ REGISTER_ACTION }}" method="post" id="register" class="iz-form">
						<fieldset class="iz-fieldset">
							{{ S_HIDDEN_FIELDS }}
							<button type="submit" name="register" tabindex="1" value="{{ L_REGISTER }}" class="iz-btn iz-btn--primary">
								{{ L_REGISTER }}
							</button>
						</fieldset>
					</form>

					{% EVENT ss_ucp_login_link_register_append %}
				</div>
			</section>
		{% else %}
			<section class="iz-card iz-card--register">
				<header class="iz-card__header">
					<h2 class="iz-card__title">{{ L_CREATE_ACCOUNT_DISABLED }}</h2>
				</header>

				<div class="iz-card__body">
					<p class="iz-prose">{{ L_REGISTRATION_DISABLED }}</p>

					<p class="iz-meta">
						<a class="iz-link" href="{{ U_TERMS_USE }}">{{ L_TERMS_USE }}</a>
						<span class="iz-sep">|</span>
						<a class="iz-link" href="{{ U_PRIVACY }}">{{ L_PRIVACY }}</a>
					</p>

					<p>
						<a class="iz-btn iz-btn--ghost" href="mailto:{{ BOARD_EMAIL }}?subject=Registrations%20Closed&body=Dear%20Admin,%20%0A%0AI%20Just%20wanted%20to%20let%20you%20know%20that%20the%20board%20registrations%20are%20closed.%20%0A%0AThis%20might%20be%20an%20error%20and%20I%20would%20like%20to%20register.%20%0A%0APlease%20let%20me%20know%20if%20this%20is%20possible.%0A%0AThanks!">
							{{ L_CONTACT_WEBMASTER }}
						</a>
					</p>
				</div>
			</section>
		{% endif %}

	</div>

	<aside class="iz-layout__aside">
		<section class="iz-card iz-card--signin">
			<header class="iz-card__header">
				<h2 class="iz-card__title">{{ L_SIGN_IN_ACCOUNT }}</h2>
			</header>

			<div class="iz-card__body">
				<form action="{{ LOGIN_ACTION }}" method="post" id="login" class="iz-form">
					<fieldset class="iz-fieldset">

						<div class="iz-field">
							<label class="iz-label iz-visually-hidden" for="{{ USERNAME_CREDENTIAL }}">
								{{ L_USERNAME }}{{ L_COLON }}
							</label>
							<input
								type="text"
								tabindex="2"
								name="{{ USERNAME_CREDENTIAL }}"
								id="{{ USERNAME_CREDENTIAL }}"
								value="{{ LOGIN_USERNAME }}"
								class="iz-input iz-input--lg"
								placeholder="{{ L_USERNAME }}"
								autocomplete="username"
							>
						</div>

						<div class="iz-field">
							<label class="iz-label iz-visually-hidden" for="{{ PASSWORD_CREDENTIAL }}">
								{{ L_PASSWORD }}{{ L_COLON }}
							</label>
							<input
								type="password"
								tabindex="3"
								id="{{ PASSWORD_CREDENTIAL }}"
								name="{{ PASSWORD_CREDENTIAL }}"
								class="iz-input iz-input--lg"
								placeholder="{{ L_PASSWORD }}"
								autocomplete="current-password"
							>
						</div>

						{% if CAPTCHA_TEMPLATE and S_CONFIRM_CODE %}
							<div class="iz-space iz-space--sm"></div>
							{% set CAPTCHA_TAB_INDEX = 4 %}
							{% include '{{ CAPTCHA_TEMPLATE }}' %}
						{% endif %}

						<div class="iz-actions">
							<button type="submit" class="iz-btn iz-btn--primary iz-btn--lg" tabindex="5" name="login" value="{{ L_LOGIN }}">
								{{ L_LOGIN_ME_IN }}
							</button>
						</div>

						{{ S_LOGIN_REDIRECT }}
						{{ S_HIDDEN_FIELDS }}
					</fieldset>
				</form>
			</div>
		</section>
	</aside>
</section>

{% include 'overall_footer.html' %}