@extends('auth.user-auth')
@section('auth-content')
<div class="d-flex flex-wrap h-100 login-container">
    <div class="flex-fill h-100">
        <h1 style="font-family:'Poppins'; font-weight: 100 !important">Forgot Password</h1>
        <ul>
            <li class="my-2"><small>Never share your email and password to anyone.</small></li>
            <li class="my-2"><small>Protect yourself from malicious user by changing password regularly.</small></li>
            <li class="my-2"><small>Beware of social engineering.</small></li>
        </ul>
        <img src="{{asset('/assets/images/authentication.svg')}}" alt="image1" class="img-fluid">
    </div>
    <div class="flex-fill h-100">
        <h3 class="text-center" style="padding: 30px 0px;font-family: 'Poppins';font-weight: 100 !important;">Recover Your Account</h3>
        <form method="POST" action="{{ route('user.password.email') }}">

            @csrf

            <div class="input-group gap-2 my-4">
                <div class="icon-container border-0 input-group-text">
                    <i class="fa-solid fa-envelope"></i>
                </div>
                <input id="email" type="email" class="form-control border-top-0 border-end-0 border-start-0 bg-white n-bg @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" autocomplete="email" autofocus placeholder="Email">
            </div>

            <div class="form-group d-flex justify-content-center align-items-center flex-column my-2">
                <button type="submit" class="btn btn-outline-success text-nowrap px-4 d-block" style="border-radius: 3rem !important;">
                    {{ __('Send Reset Password Link') }}
                </button>
            </div>
            <p class="text-center mb-0"><small> --Or-- </small></p>
            <a class="btn btn-link d-block mb-2" style="color: #00c988; font-size:12px;" href="{{ route('user.login') }}">
                {{ __('Want to login to your account?') }}
            </a>
        </form>
    </div>
</div>
@endsection