{% extends '/wpadmin_pages/base.twig' %}

{% block h1heading %}<h1 style="display: none;">&nbsp;</h1>{% endblock %}
{% block page_head %}{% endblock %}
{% block body %}
	<div class="row justify-content-center">
	<div class="col-xl-6 col-lg-7 col-md-8 col-sm-12">
		<div class="options-body" id="IcwpWpsfSecurityAdmin">

			<h3>{{ strings.aar_title }}</h3>
			<p>
				{{ strings.aar_what_should_you_enter }}
				<br />{{ strings.aar_must_supply_key_first }}
			</p>

			<form action="{{ form_action }}" method="post" class="form-horizontal" id="SecurityAdminForm">

				{% for input_name, input_val in ajax.sec_admin_login %}
					<input type="hidden" name="{{ input_name }}" value="{{ input_val }}" />
				{% endfor %}

				<div class="row no-gutters">

					<label class="form-label col-3 col-form-label" for="sec_admin_key">
						<span class="optname">{{ strings.aar_enter_access_key }}</span>
					</label>

					<div class="col-8 col-xs-offset-1 option_container">
						<div class="option_section">
							<label class="sec_admin_key form-label">
								<input type="password" name="sec_admin_key"
									   id="sec_admin_key"
									   value="" autocomplete="off" autofocus />
							</label>
							<p class="help-block">{{ strings.aar_to_manage_must_enter_key }}</p>
						</div>
					</div>
				</div>

				<div class="row no-gutters">
					<div class="col-6 order-2 text-end">
						<button type="submit" class="btn btn-primary" name="submit">
							{{ strings.aar_submit_access_key }}</button>
					</div>
					<div class="col-5 order-1 text-start">
						<a class="btn btn-link "
						   href="{{ hrefs.aar_forget_key }}" target="_blank">
							{{ strings.aar_forget_key }}</a>
					</div>
				</div>

			</form>

			<div class="alert alert-success mb-0 mt-5 text-center">
				{% if flags.allow_email_override %}

					<p>
						{{ strings.force_remove_email }}
					</p>
					<p class="mb-0">
						<a href="#" id="SecAdminRemoveConfirmEmail"
						   class="alert-link">{{ strings.click_email }}</a>
						<br />
						({{ strings.send_to_email }})
					</p>
				{% else %}
					{{ strings.no_email_override }}
				{% endif %}
			</div>
		</div>
	</div>
</div>
{% endblock %}

{% block page_foot %}
{% endblock %}

{% block inline_styles %}
	<style>
		#wpwrap {
			background-image: url({{ imgs.background_svg }});
			background-size:100%;
			background-repeat:no-repeat;
		}
		#wpcontent,
		#wpbody-content {
			background-color: transparent;
		}
	</style>
{% endblock %}