@extends('layouts.app')

@section('title', 'Recuperar Contraseña')

@section('content')
    <div class="flex flex-col sm:flex-row h-custom bg-custom-back-login bg-cover">
        <div class="w-full sm:w-1/2">
        </div>
        <div class="w-full sm:w-1/2 my-auto text-center">
            <div class="bg-white p-5 rounded-3xl shadow-lg mx-5 sm:mx-32 2xl:mx-64">
                <img src="{{ asset(config('constants.logo_image_path')) }}" width="200" class="mx-auto mb-5" alt="Logo">

                <form action="{{ route('password.request') }}" class="form-horizontal" method="POST">
                    {!! csrf_field() !!}
                    <input type="hidden" name="token" value="{{ $token }}">
                    <h3 class="text-center mt-5 mb-2">Cambiar Contraseña</h3>
                    @include('partials.alerts')
                    <div class="flex flex-col mb-2">
                        <label for="email">Correo electronico</label>
                        <input type="email" class="input-custom w-72 mx-auto" id="email" aria-describedby="emailHelp"
                            name="email" required value="{{ request('email') }}">
                    </div>
                    <div class="flex flex-col mb-2">
                        <label for="password">Nueva Contraseña</label>
                        <input type="password" class="input-custom w-72 mx-auto" name="password" id="password" required>
                    </div>
                    <div class="flex flex-col mb-4">
                        <label for="password">Confirmar Contraseña</label>
                        <input type="password" class="input-custom w-72 mx-auto mt-2" name="password_confirmation"
                            id="password" required>
                    </div>
                    <button type="submit" class="btn-custom">Guardar Contraseña</button>
                </form>
            </div>
        </div>
    </div>
@endsection