{% extends "two_factor/_base_focus.html" %}
{% load i18n %}

{% block browser_title %}
  {% trans "Two-Factor Authentication successfully enabled" %}
{% endblock %}

{% block content %}
  <h1>{% block title %}{% trans "Two-Factor Authentication successfully enabled" %}{% endblock %}</h1>

  <div class="alert success">
    <p>
      <i class="material-icons iconify left" data-icon="mdi:check-circle-outline"></i>
      {% blocktrans %}
        Congratulations, you've successfully enabled two-factor authentication.
      {% endblocktrans %}
    </p>
  </div>

  {% if not phone_methods %}
    <a href="{% url 'two_factor:profile' %}"
       class="btn btn-primary waves-effect waves-light">
      <i class="material-icons iconify left" data-icon="mdi:arrow-left"></i>
      {% trans "Back to Profile" %}
    </a>
    <a href="{% url 'two_factor:backup_tokens' %}" class="btn green waves-effect waves-light">
      <i class="material-icons iconify left" data-icon="mdi:key-outline"></i>
      {% trans "Generate backup codes" %}
    </a>
  {% else %}
    <div class="warning">
      <p>
        <i class="material-icons iconify left" data-icon="mdi:alert-outline"></i>
        {% blocktrans %}
          However, it might happen that you don't have access to
          your primary token device. To enable account recovery, generate backup codes
          or add a phone number.
        {% endblocktrans %}
      </p>
    </div>
    <a href="{% url 'two_factor:profile' %}"
       class="btn btn-primary waves-effect waves-light">
      <i class="material-icons iconify left" data-icon="mdi:arrow-left"></i>
      {% trans "Back to Profile" %}
    </a>
    <a href="{% url 'two_factor:backup_tokens' %}" class="btn green waves-effect waves-light">
      <i class="material-icons iconify left" data-icon="mdi:key-outline"></i>
      {% trans "Generate backup codes" %}
    </a>
    <a href="{% url 'two_factor:phone_create' %}" class="btn green waves-effect waves-light">
      <i class="material-icons iconify left" data-icon="mdi:phone-plus"></i>
      {% trans "Add Phone Number" %}
    </a>
  {% endif %}

{% endblock %}
