@extends('guest-master')

@section('content')

    <div class="w-full max-w-md bg-white rounded-lg shadow-md p-8">

        <div class="mb-4 text-sm text-gray-600">
            {{ __('If you’ve forgotten your password, there’s no need to worry. Simply provide us with the email address associated with your account, and we’ll take care of the rest. We’ll send you a secure password reset link directly to your email inbox. By clicking on the link, you’ll be able to create a brand-new password of your choice, ensuring that you regain access to your account quickly and securely. Rest assured, the process is straightforward, and we’re here to help every step of the way.') }}
        </div>

        <x-auth-session-status class="mb-4" :status="session('status')" />

        <form method="POST" action="{{ route('password.email') }}">
            @csrf

            <div class="mb-4">
                <x-input-label for="email" :value="__('Email')" :required="true"/>
                <x-text-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus />
                <x-input-error :messages="$errors->get('email')" class="mt-2" />
            </div>

            <div class="flex items-center justify-end gap-2">
                <a href="{{route('login')}}" class="bg-main-dark text-xs text-main-light hover:bg-main-light hover:text-main-dark inline-flex items-center px-6 py-2 border border-transparent rounded-md font-semibold uppercase tracking-widest active:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition ease-in-out duration-150">Back</a>
                <x-primary-button class="bg-main-dark text-xs text-main-light hover:bg-main-light hover:text-main-dark inline-flex items-center px-6 py-2 border border-transparent rounded-md font-semibold uppercase tracking-widest active:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition ease-in-out duration-150">
                    {{ __('Send Reset Link') }}
                </x-primary-button>
            </div>
        </form>
    </div>

@endsection