{% extends "base.html" %}
{% block title %}Security - RadiusForge{% endblock %}
{% block content %}
    <div class="rf-page-head">
        <div>
            <h1>Security</h1>
            <p class="rf-lede">Settings for your own login</p>
        </div>
    </div>

    <section class="rf-form-card">
        <h2 class="rf-card-title">Two-factor authentication
            {% if totp and totp.confirmed %}<span class="rf-pill rf-pill-active">On</span>{% else %}<span class="rf-pill rf-pill-suspended">Off</span>{% endif %}</h2>
        {% if totp and totp.confirmed %}
            <p>You're asked for a code from your authenticator app every time you log in.</p>
            <p class="hint">Recovery codes let you log in if you lose your authenticator app. You have
               <strong>{{ codes_left }}</strong> unused.</p>
            <form method="post" action="{% url 'recovery-codes-regenerate' %}" class="rf-inline-form"
                  onsubmit="return confirm('Generate new recovery codes? Your current codes stop working.');">
                {% csrf_token %}
                <button type="submit" class="small-button">Regenerate recovery codes</button>
            </form>
            {% if enforced %}
                <p class="hint">Your organization requires two-factor authentication, so it can't be turned
                   off. An Owner can reset it for you.</p>
            {% else %}
            <form method="post" action="{% url 'totp-disable' %}"
                  onsubmit="return confirm('Turn off two-factor authentication for your account?');">
                {% csrf_token %}
                <button type="submit" class="small-button">Turn off two-factor authentication</button>
            </form>
            {% endif %}
        {% else %}
            <p>With it on, logging in needs a code from an authenticator app as well as your password.
               If someone learns your password, they still cannot log in.</p>
            {% if enforced %}<p class="rf-message rf-message-error">Your organization requires two-factor
               authentication. Set it up now to keep using the console.</p>{% endif %}
            <a class="button" href="{% url 'totp-setup' %}">Turn on two-factor authentication</a>
        {% endif %}
    </section>
{% endblock %}