@extends('layouts.access')
@section('content')
    <div class="flex min-h-full">
        <div class="relative flex-1 hidden w-0 lg:block"
            style="background:linear-gradient(to top, #a5cbe5, #c1d6ec, #d9e1f2, #edeef7, #fcfcfc)">
            <img class="absolute inset-0 object-cover m-auto max-w-80" src="{{ asset('assets/panobiz_logo_large.webp') }}"
                alt="PANOBIZ HR">
        </div>
        <div class="flex flex-col justify-center flex-1 px-4 py-12 sm:px-6 lg:flex-none lg:px-20 xl:px-24">
            <div class="w-full max-w-sm mx-auto lg:w-96">
                <div>

                    {{-- <img class="w-auto h-10" src="https://tailwindui.com/img/logos/mark.svg?color=indigo&shade=600" alt="Your Company"> --}}
                    <h1 class="mt-8 text-2xl font-bold leading-9 tracking-tight text-gray-900">Find your account</h1>

                </div>
                <div class="mt-10">

                    <form id="forgot-password-form" method="POST" action="{{ route('password.email') }}" class="space-y-6">
                        @csrf
                        <div class="mb-10">
                            <div class="relative pb-4 field-group group">
                                <div class="relative mt-2">
                                    <input type="email" name="email" id="email"
                                        class="peer block w-full pr-10 border-0 bg-gray-50 py-1.5 text-gray-900 focus:ring-0 sm:text-sm sm:leading-6"
                                        placeholder="Email">
                                    <div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
                                        <svg class="w-5 h-5 text-gray-400" viewBox="0 0 20 20" fill="currentColor"
                                            aria-hidden="true">
                                            <path
                                                d="M3 4a2 2 0 00-2 2v1.161l8.441 4.221a1.25 1.25 0 001.118 0L19 7.162V6a2 2 0 00-2-2H3z" />
                                            <path
                                                d="M19 8.839l-7.77 3.885a2.75 2.75 0 01-2.46 0L1 8.839V14a2 2 0 002 2h14a2 2 0 002-2V8.839z" />
                                        </svg>
                                    </div>
                                    <div class="absolute inset-x-0 bottom-0 border-t border-gray-300 group-[.error]:border-red-600 peer-focus:border-t-2 peer-focus:border-indigo-600"
                                        aria-hidden="true"></div>
                                </div>
                                @error('email')
                                    <p class="mt-2 text-sm text-red-600" id="email-error">{{ $message }}</p>
                                @enderror
                            </div>


                            <div class="flex items-center justify-between ">
                                <div class="text-sm leading-6">
                                    Requires your primary verified email address.
                                </div>
                            </div>
                        </div>
                        <div class="mt-10">
                            <button type="submit"
                                class="flex w-full justify-center rounded-md bg-indigo-600 px-3 py-2.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
                                Reset Password
                            </button>
                        </div>
                </div>
                </form>

            </div>
        </div>
    </div>

    </div>
@stop