{#
    organizations/invitation_complete.twig - Страница завершения регистрации нового пользователя
#}
{% extends 'layouts/landing.twig' %}

{% block title %}{{ title }}{% endblock %}

{% block content %}
<div class="min-vh-100 d-flex align-items-center justify-content-center py-5" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-6 col-lg-5">
                <div class="card shadow-lg border-0">
                    <div class="card-body p-5">
                        {# Логотип организации #}
                        <div class="text-center mb-4">
                            {% if organization.logo %}
                            <img src="{{ organization.logo }}" alt="{{ organization.name }}" style="max-height: 60px;">
                            {% else %}
                            <div class="bg-primary text-white rounded-3 d-inline-flex align-items-center justify-content-center" style="width: 60px; height: 60px;">
                                <i class="fa-solid fa-building fs-3"></i>
                            </div>
                            {% endif %}
                        </div>

                        <h2 class="text-center mb-3">Завершение регистрации</h2>

                        <p class="text-center text-muted mb-4">
                            Вы приняли приглашение в организацию "{{ organization.name }}"
                            <br>
                            в роли <span class="badge bg-primary">{{ role_label }}</span>
                        </p>

                        <p class="text-center text-muted mb-4">
                            Пожалуйста, создайте пароль для вашего аккаунта
                        </p>

                        {# Ошибки валидации #}
                        {% if get_alerts()|filter(a => a.type == 'error')|length > 0 %}
                        <div class="alert alert-danger">
                            {% for alert in get_alerts() %}
                                {% if alert.type == 'error' %}
                                <div>{{ alert.message }}</div>
                                {% endif %}
                            {% endfor %}
                        </div>
                        {% endif %}

                        {# Форма регистрации #}
                        <form action="/invitation/complete/{{ token }}" method="POST" data-ajax="true">
                            {{ csrf_field()|raw }}

                            <div class="mb-3">
                                <label for="completeName" class="form-label">Ваше имя</label>
                                <input type="text"
                                       class="form-control {% if old.name is defined and old.name is empty %}is-invalid{% endif %}"
                                       id="completeName"
                                       name="name"
                                       value="{{ old.name|default('') }}"
                                       placeholder="Иван Иванов"
                                       required>
                                {% if old.name is defined and old.name is empty %}
                                <div class="invalid-feedback">Имя обязательно</div>
                                {% endif %}
                            </div>

                            <div class="mb-3">
                                <label for="completeEmail" class="form-label">Email</label>
                                <input type="email"
                                       class="form-control"
                                       id="completeEmail"
                                       value="{{ email }}"
                                       disabled>
                                <div class="form-text">Email подтверждён через приглашение</div>
                            </div>

                            <div class="mb-3">
                                <label for="completePassword" class="form-label">Пароль</label>
                                <input type="password"
                                       class="form-control"
                                       id="completePassword"
                                       name="password"
                                       minlength="8"
                                       required>
                                <div class="form-text">Минимум 8 символов</div>
                            </div>

                            <div class="mb-4">
                                <label for="completePasswordConfirm" class="form-label">Подтвердите пароль</label>
                                <input type="password"
                                       class="form-control"
                                       id="completePasswordConfirm"
                                       name="password_confirm"
                                       required>
                            </div>

                            <div class="d-grid">
                                <button type="submit" class="btn btn-primary btn-lg">
                                    <i class="fa-solid fa-check me-2"></i>Завершить регистрацию
                                </button>
                            </div>
                        </form>
                    </div>
                </div>

                {# Футер #}
                <div class="text-center mt-4 text-white-50 small">
                    &copy; {{ "now"|date("Y") }} Бизнес.Точка
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}