{% extends 'base.html.twig' %}

{% block title %}{{ 'sign.guest.authTitle'|trans }}{% endblock %}
{% block footer %}{% endblock %}

{% block body %}
<div class="container py-5" style="max-width: 520px;">
    <h1 style="font-size: 26px; margin-bottom: 8px;">{{ document.title }}</h1>
    <p class="mb-4" style="color:#6b778c;">{{ 'sign.guest.authHelp'|trans({'%email%': signer.email}) }}</p>

    <form method="post" class="mb-3">
        <input type="hidden" name="action" value="send">
        <button type="submit" class="button button-orange w-100">{{ 'sign.guest.sendCode'|trans }}</button>
    </form>

    {% if codeRequested %}
    <form method="post">
        <input type="hidden" name="action" value="verify">
        <label class="sign-label" for="authCode">{{ 'sign.guest.enterCode'|trans }}</label>
        <input class="form-control sign-input mb-3" id="authCode" name="code" inputmode="numeric" autocomplete="one-time-code" required maxlength="6" placeholder="123456">
        <button type="submit" class="button button-blue w-100">{{ 'sign.guest.verifyCode'|trans }}</button>
    </form>
    {% endif %}
</div>
{% endblock %}