{# Shared persona login picker, used by login.html, authorize.html and
   device.html so the markup (and any future fix to it, e.g. the device
   flow's implicit-submission fix) exists in one place instead of three.

   ``users`` is a list of ``(username, description)`` pairs (see
   ``ConfigManager.persona_picker_entries()``), so every surface shows the
   same display-only context next to the name. ``description`` is plain
   text only - it goes through Jinja's autoescaping like any other value,
   never raw HTML.

   js_submit=True renders non-submit buttons with a `persona-user-btn` class
   instead, for surfaces (device.html) where a text input shares the form
   and implicit Enter-submission must not silently pick a user; the caller
   is then responsible for the click handler that actually submits. #}
{# The declarative TOTP second factor's code screen (#348), shared by the
   same three templates for the same reason. Stateless like two-step: the
   username AND the password travel forward as hidden fields (nothing is
   stored server-side; the route re-checks the password and marks the
   response no-store), and the submit button stays with the caller, since
   each surface labels and groups it differently. #}
{% macro totp_code_fields(login_username, login_password) %}
<input type="hidden" name="username" value="{{ login_username }}">
<input type="hidden" name="password" value="{{ login_password }}">
<div class="form-floating mb-4">
    <input type="text" class="form-control" id="totp_code" name="totp_code"
           placeholder="Code" required autofocus inputmode="numeric"
           pattern="[0-9]{6}" autocomplete="one-time-code" maxlength="6">
    <label for="totp_code"><i class="bi bi-shield-check me-2"></i>Authenticator code</label>
</div>
{% endmacro %}

{% macro persona_picker(users, prompt, js_submit=false) %}
<p class="text-muted small mb-3">
    <i class="bi bi-people me-1"></i>{{ prompt }}
    No password required (local development convenience).
</p>
{% if users %}
<div class="list-group mb-3">
    {% for username, description in users %}
    {% if js_submit %}
    <button type="button" value="{{ username }}" class="list-group-item list-group-item-action d-flex align-items-center persona-user-btn">
        <i class="bi bi-person-circle me-2"></i>
        <span>
            {{ username }}
            {% if description %}<small class="text-muted d-block">{{ description }}</small>{% endif %}
        </span>
    </button>
    {% else %}
    <button type="submit" name="username" value="{{ username }}" class="list-group-item list-group-item-action d-flex align-items-center">
        <i class="bi bi-person-circle me-2"></i>
        <span>
            {{ username }}
            {% if description %}<small class="text-muted d-block">{{ description }}</small>{% endif %}
        </span>
    </button>
    {% endif %}
    {% endfor %}
</div>
{% else %}
<p class="text-muted text-center">No users configured.</p>
{% endif %}
{% endmacro %}