{% extends 'Layouts/login.html.twig' %}

{% block title %}
	{{ 'app.global.user.password.reset.form.title'|trans }}
{% endblock %}

{% block body %}
	{{ form_start(requestForm,{
			'attr': {
				'id': 'kt_modal_' ~ requestForm.vars.id ~ '_form' ,
				'class': 'kt-fx-form mx-auto w-100 py-10','novalidate':'novalidate'}
	}) }}
	<div class="text-center mb-11">
		<a href="{{ path('foxorders_dashboard') }}">
			<img alt="Logo" src="{{asset('foxorders/media/logos/popina-order-icon.png')}}" class="h-100px"/>
		</a>
		<h1 class="text-dark fw-bolder mb-3" style="padding-top: 30px !important;">{{ 'app.global.user.password.forgot_password'|trans }}</h1>
		<div class="text-gray-500 fw-semibold fs-6">{{ 'app.global.user.password.reset.hint'|trans }}</div>
	</div>
	<div class="row g-3 mb-9">
		<div class="col-md-12">
			{% for flash_error in app.flashes('reset_password_error') %}
				<div class="alert alert-danger text-center" role="alert">{{ flash_error }}</div>
			{% endfor %}
		</div>
	</div>
	<div class="fv-row mb-8">
		{{ requestForm.email|form_row('app.global.fields.email'|trans, {'class': 'form-control bg-transparent', 'label': false}) }}
	</div>
	<div class="d-grid mb-10">
		{% include 'Includes/Form/submit.html.twig'  with { 'text' : 'app.global.buttons.reset'|trans, 'icon' : 'key' } %}
	</div>
	<div class="text-gray-500 text-center fw-semibold fs-6">{{ 'app.global.user.password.already_have_account'|trans }}
		<a href="{{ path('security_login') }}" class="link-primary">{{ 'app.global.buttons.login'|trans }}</a>
	</div>
	{{ form_end(requestForm) }}
{% endblock %}

{% block javascripts %}
	{{ parent() }}
	<script>
		var translations = {
			'empty': '{{ 'app.global.validation.user.email.empty' | trans }}',
			'email': '{{ 'app.global.validation.user.email.invalid' | trans }}',
		}
	</script>
	<script src="{{ asset('foxorders/js/validation/rules/security/request-password.js') }}"></script>
{% endblock %}