{% extends 'shared/auth.html.twig'%}
{% block title %}Enter your One Time Verification Code{% endblock %}

	 {% block content %}
   	<!--begin::Form-->
	<form class="form w-100 mb-20" id="kt_sign_in_form" action="{{ checkPathUrl ? checkPathUrl: path(checkPathRoute) }}"  method="post">
								<!--begin::Icon-->
								<div class="text-center mb-10">
									<img alt="Logo" class="mh-125px" src="{{secure_assets}}/media/svg/misc/smartphone-2.svg" />
								</div>
								<!--end::Icon-->
								<!--begin::Heading-->
								<div class="text-center mb-10">
									<!--begin::Title-->
									<h1 class="text-gray-900 mb-3">One Time Verification Code</h1>
									<!--end::Title-->
									<!--begin::Sub-title-->
									<div class="text-muted fw-semibold fs-5 mb-5">Enter the verification code you get from your downlaoded Authy or Google Authenticator App</div>
									<!--end::Mobile no-->
								</div>
								<!--end::Heading-->
									{% if authenticationError %}
									<div class="alert alert-danger">{{ authenticationError|trans(authenticationErrorData, 'SchebTwoFactorBundle') }}</div>
									{% endif %}
								<!--begin::Section-->
								<div class="mb-10">
									<!--begin::Label-->
									<div class="fw-bold text-start text-gray-900 fs-6 mb-1 ms-1">Type your 6 digit security code</div>
									<!--end::Label-->
									<!--begin::Input group-->
									<div class="d-flex flex-wrap flex-stack">
											<input
													id="_auth_code"
													type="text"
													class="form-control bg-transparent  fs-2qx text-center mx-1 my-2"
													name="{{ authCodeParameterName }}"
													autocomplete="one-time-code"
													autofocus
													inputmode="numeric"
													pattern="[0-9]*"
													maxlength="6"
													{#
													https://www.twilio.com/blog/html-attributes-two-factor-authentication-autocomplete
													If your 2fa methods are using numeric codes only, add these attributes for better user experience:
													inputmode="numeric"
													pattern="[0-9]*"
													#}
											/>
    									</div>
									<!--begin::Input group-->
								</div>
								<!--end::Section-->
									{% if displayTrustedOption %}
										<p class="widget"><label for="_trusted"><input id="_trusted" type="checkbox" name="{{ trustedParameterName }}" /> {{ "trusted"|trans({}, 'SchebTwoFactorBundle') }}</label></p>
								{% endif %}
								{% if isCsrfProtectionEnabled %}
										<input type="hidden" name="{{ csrfParameterName }}" value="{{ csrf_token(csrfTokenId) }}">
								{% endif %}
								<!--begin::Submit-->
								<div class="d-flex flex-center">
									<p class="cancel"><a class="btn btn-lg btn-cancel fw-bold pt-10" href="{{ logoutPath }}">{{ "cancel"|trans({}, 'SchebTwoFactorBundle') }}</a></p>

									<button type="submit" id="kt_sing_in_two_factor_submit" class="btn btn-lg btn-primary fw-bold">{{ "login"|trans({}, 'SchebTwoFactorBundle') }}
									</button>
								</div>
								<!--end::Submit-->
</form>

<div class="text-center fw-semibold fs-5">
								<span class="text-muted me-1">Haven't scaned the QRCode and downloaded the App?</span>
								<a href="{{ url('app_2fa_enable') }}" class="link-primary fs-5 me-1">Try again here</a>

	</div>
{% endblock %}