<xf:title>{{ phrase('two_step_verification_required') }}</xf:title>

<xf:page option="loginWide" value="{{ true }}" />

<xf:form action="{{ link('login/two-step') }}" ajax="true" class="block">
	<div class="block-container">
		<h2 class="block-tabHeader tabs hScroller" data-xf-init="h-scroller">
			<span class="hScroller-scroll">
			<xf:foreach loop="$providers" value="$tabProvider">
				<a href="{{ link('login/two-step', null, {'provider': $tabProvider.provider_id, 'remember': $remember ? 1 : null, '_xfRedirect': $redirect}) }}"
					class="tabs-tab {{ $tabProvider.provider_id == $providerId ? 'is-active' : '' }}">{$tabProvider.title}</a>
			</xf:foreach>
			</span>
		</h2>

		<div class="block-body">
			<xf:formrow label="{{ phrase('logging_in_as') }}">{$user.username}</xf:formrow>

			{{ $provider.render('login', $user, $providerData, $triggerData)|raw }}

			<xf:checkboxrow>
				<xf:option name="trust" value="1" hint="{{ phrase('trust_device_desc') }}" checked="{$trustChecked}">
					{{ phrase('trust_this_device_for_30_days') }}
				</xf:option>
			</xf:checkboxrow>
		</div>

		<xf:submitrow submit="{{ phrase('confirm') }}" />
	</div>

	<xf:hiddenval name="confirm">1</xf:hiddenval>
	<xf:hiddenval name="provider">{$providerId}</xf:hiddenval>
	<xf:hiddenval name="_xfRedirect">{$redirect}</xf:hiddenval>

</xf:form>