{% include 'overall_header.html' %}

{% INCLUDEJS '@paul999_tfa/js/login.js' %}

{% if S_ERROR %}
  <div class="text-sm text-red-700 bg-red-50 border border-red-300 rounded-lg p-4 dark:text-red-400 dark:bg-red-800/10 dark:border-red-500 my-4" role="alert">
		<p class="error">{{ S_ERROR }}</p>
	</div>
{% endif %}

<div class="tfa_center">
    <div class="forabg tfa_login">

        <div class="inner">
            <h1 class="tfa_login_type">{{ lang('TFA_SELECT_KEY') }}</h1>
            <ul class="topiclist forums">
            {% for tfa_option in tfa_options %}
                <li class="row">
                    <dl>
                        <dt><a class="text-sm text-secondary" href="javascript:openAuth('#auth_{{ tfa_option.ID|e('js') }}');">{{ tfa_option.NAME }}</a></dt>
                    </dl>
                </li>
            {% endfor %}
            </ul>
        </div>
    </div>
</div>

{% for tfa_option in tfa_options if tfa_option.S_TFA_INCLUDE_HTML %}
    <div id="auth_{{ tfa_option.ID }}"{% if not tfa_option.S_FIRST_ROW %} style="display: none;"{% endif %}>
        <form id="submit_auth" method="post" action="{{ tfa_option.U_SUBMIT_AUTH }}">
            {{ S_FORM_TOKEN }}
            {{ tfa_option.S_HIDDEN_FIELDS }}
            <input type="hidden" name="random" value="{{ RANDOM }}">
            <input type="hidden" name="redirect" value="{{ REDIRECT }}">
            {% include tfa_option.S_TFA_INCLUDE_HTML %}
        </form>
    </div>
{% endfor %}

{% include 'overall_footer.html' %}