{% extends get_theme_base_template() %}

{% block base_title %}Passwort vergessen{% endblock %}

{% block base_content %}
    {{ parent() }}
    {% set loginMode = settings.loginIdentifierMode %}
    {% set identifierLabel = loginMode == 'email' ? 'E-Mail' : (loginMode == 'username' ? 'Benutzername' : 'Benutzername oder E-Mail') %}
    {% set identifierPlaceholder = loginMode == 'email' ? 'ihre@email.de' : (loginMode == 'username' ? 'Ihr Benutzername' : 'Benutzername oder E-Mail') %}
    <div class="container mt-5">
        <div class="row justify-content-center">
            <div class="col-md-6">
                <h2 class="text-center mb-4">{{ 'storefront.auth.forgot_password_title'|trans }}</h2>
                <p class="text-muted text-center mb-4">{{ 'storefront.auth.forgot_password_description'|trans }}</p>

                {{ form_start(forgotPasswordForm, {'attr': {'class': 'form-horizontal'}}) }}
                <div class="mb-3">
                    {{ form_label(forgotPasswordForm.identifier, identifierLabel, {'label_attr': {'class': 'form-label'}}) }}
                    {{ form_widget(forgotPasswordForm.identifier, {'attr': {'class': 'form-control', 'placeholder': identifierPlaceholder}}) }}
                    {{ form_errors(forgotPasswordForm.identifier) }}
                </div>

                {% include '@TerraFlowCMS/partials/friendly_captcha_widget.html.twig' with { captcha_context: 'forgot_password' } %}

                <button type="submit" class="btn btn-primary w-100">
                    {{ 'storefront.auth.send_reset_link'|trans }}
                </button>
                {{ form_end(forgotPasswordForm) }}

                <div class="mt-3 text-center">
                    <a href="{{ path('app_storefront_login') }}">{{ 'storefront.auth.back_to_login'|trans }}</a>
                </div>
            </div>
        </div>
    </div>
{% endblock %}