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

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

{% block styles %}
    {{ parent() }}
    {{ encore_entry_link_tags('sign') }}
{% endblock %}

{% block body %}
<div class="sign-page">
    <div class="container sign-container sign-review">
        <a class="sign-link-btn" href="{{ path('app_sign_prepare', {id: document.id, step: 3}) }}">← {{ 'sign.back'|trans }}</a>
        <h1 class="sign-header__title mt-3">{{ 'sign.readyToSend'|trans }}</h1>
        <p class="sign-help">{{ 'sign.readyToSendHelp'|trans }}</p>

        {% if errors is not empty %}
            <div class="alert alert-warning">
                <ul class="mb-0">
                    {% for error in errors %}
                        <li>{{ error|trans }}</li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}

        <form method="post" class="sign-review-card">
            <label class="sign-label" for="title">{{ 'sign.documentTitle'|trans }}</label>
            <input class="form-control sign-input" id="title" name="title" value="{{ document.title }}">

            <div class="mt-3">
                <div class="sign-label">{{ 'sign.signers'|trans }}</div>
                <ul class="sign-signer-chips">
                    {% for signer in document.signers %}
                        <li class="sign-chip" style="--signer-color: {{ signer.color }}">
                            <span class="sign-chip__dot"></span>
                            {{ signer.displayName }} &lt;{{ signer.email }}&gt;
                        </li>
                    {% endfor %}
                </ul>
            </div>

            <label class="sign-label mt-3" for="emailSubject">{{ 'sign.subject'|trans }}</label>
            <input class="form-control sign-input" id="emailSubject" name="emailSubject" value="{{ document.emailSubject }}">

            <label class="sign-label mt-3" for="message">{{ 'sign.message'|trans }}</label>
            <textarea class="form-control sign-input" id="message" name="message" rows="3">{{ document.message }}</textarea>

            <label class="sign-label mt-3" for="expiresAt">{{ 'lang.validUntil'|trans }}</label>
            <input class="form-control sign-input" type="date" id="expiresAt" name="expiresAt"
                   value="{{ document.expiresAt ? document.expiresAt|date('Y-m-d') : '' }}">

            <div class="form-check mt-3">
                <input class="form-check-input" type="checkbox" name="requireEmailCode" value="1" id="requireEmailCode" {% if document.requireEmailCode %}checked{% endif %}>
                <label class="form-check-label" for="requireEmailCode">{{ 'sign.authEmailCode'|trans }}</label>
            </div>

            <details class="mt-4">
                <summary>{{ 'sign.moreSettings'|trans }}</summary>
                <div class="form-check mt-2">
                    <input class="form-check-input" type="checkbox" name="requireSmsCode" value="1" id="requireSmsCode" {% if document.requireSmsCode %}checked{% endif %}>
                    <label class="form-check-label" for="requireSmsCode">{{ 'sign.authSmsCode'|trans }}</label>
                </div>
                <div class="form-check mt-2">
                    <input class="form-check-input" type="checkbox" name="sequentialSigning" value="1" id="sequentialSigning" {% if document.sequentialSigning %}checked{% endif %}>
                    <label class="form-check-label" for="sequentialSigning">{{ 'sign.sequential'|trans }}</label>
                </div>
            </details>

            <div class="sign-review-actions mt-4">
                <button type="submit" name="action" value="save" class="button">{{ 'sign.save'|trans }}</button>
                <button type="submit" name="action" value="send" class="button button-blue" {% if errors is not empty %}disabled{% endif %}>
                    {{ 'sign.sendNow'|trans }}
                </button>
            </div>
        </form>
    </div>
</div>
{% endblock %}