@extends('auth.layout.auth-main')

@section('content')
    <div class="w-full bg-white rounded shadow-lg p-8 m-4 md:max-w-sm md:mx-auto">
        @include('auth.items.header', ['title' => 'Reset Password'])
        <form action="{{ route('reset.password.post') }}" method="POST">
            @csrf
            <input type="hidden" name="token" value="{{ $token }}">

            <div class="mb-4 md:w-full">
                <label for="email" class="block text-md text-slate-500 mb-1"> Email</label>
                <input class="w-full border rounded p-2 outline-none focus:shadow-outline" type="email" name="email"
                    id="email" value="{{ old('email') }}" placeholder="Ex. jhone@due.com" required>
            </div>
            @error('email')
                @include('backend.share.error-message', ['message' => $message])
            @enderror

            <div class="mb-4 md:w-full">
                <label for="password" class="block text-md text-slate-500 mb-1">Password</label>
                <input class="w-full border rounded p-2 outline-none focus:shadow-outline" type="password" name="password"
                    id="password" value="{{ old('email') }}" placeholder="******" required>
            </div>
            @error('password')
                @include('backend.share.error-message', ['message' => $message])
            @enderror

            <div class="mb-6 md:w-full">
                <label for="password_confirmation" class="block text-md text-slate-500 mb-1">Confirm
                    Password</label>
                <input class="w-full border rounded p-2 outline-none focus:shadow-outline" type="password"
                    name="password_confirmation" id="password_confirmation" placeholder="******" required>
            </div>
            @error('password_confirmation')
                @include('backend.share.error-message', ['message' => $message])
            @enderror

            @include('backend.share.add-button', ['name' => ' Reset Password'])
        </form>

        <div class="flex justify-end mt-5">
            <a class="text-blue-700 text-center underline text-sm" href="{{ route('login') }}">Back</a>
        </div>

        @error('message')
            <div class="mt-5">
                @include('backend.share.error-message', ['message' => $message])
            </div>
        @enderror
    </div>
@endsection