@extends('layouts.app')

@section('content')
    <div class="d-flex flex-center flex-column flex-column-fluid">
        <div class="w-lg-600px p-10 p-lg-15 mx-auto">
            <form class="form w-100 fv-plugins-bootstrap5 fv-plugins-framework"
                data-kt-redirect-url="{{ route('password.email') }}" action="{{ route('password.email') }}" method="POST"
                id="kt_password_reset_form">
                @csrf
                <div class="text-center mb-10">
                <h1 class="text-blue fs-3qx mb-3 ">Olvido de contraseña</h1>

                <div class="text-gray fw-semibold fs-3">
                Por favor ingrese el correo electrónico para restablecer su contraseña.
                    </div>
                </div>
                <div class="fv-row mb-10 fv-plugins-icon-container">
                    <input class="form-control form-control-lg form-control-solid" type="email"  name="email" placeholder="Correo electrónico">
                    <div class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                    </div>
                </div>

                <div class="d-flex flex-wrap justify-content-center pb-lg-0">

                <a href="{{ route('login') }}" class="btn btn-lg btn-cancelar fw-bold flex-grow-1 me-4">Cancelar</a>


                    <button type="button" id="kt_password_reset_submit" class="btn btn-lg btn-iniciar fw-bold flex-grow-1">
                        <span class="indicator-label">
                            Enviar
                        </span>
                        <span class="indicator-progress">
                            Enviando...
                            <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
                        </span>
                    </button>

                </div>
            </form>

            <div>
                <br>
                <hr>
            </div>

            <div>
            <div class="mt-4 text-end border p-3 rounded border-2 border-gray mt-8"><span class="fs-4">Volver al </span><a href="{{route('login')}}" class="text-link-blue fs-4 ">inicio de sesión
                        </a></div>
            </div>

        </div>
    </div>
@endsection

@section('js')
    <script src="{{ asset('assets/js/custom/authentication/reset-password/reset-password.js') }}"></script>
@endsection