@extends('auth.auth_layout')

@section('content')
@include('auth.page_title', ['pageTitleMessage'=>'Forgot your password?'])


    <!-- /.login-logo -->
    <div class="card">
        <div class="card-body login-card-body">
            <p class="login-box-msg">Here you can easily retrieve a new password.</p>

            @if (session('status'))
                <div class="alert alert-success">
                    {{ session('status') }}
                </div>
            @endif

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

                <div class="input-group mb-3">
                    <input type="email"
                           name="email"
                           required
                           class="form-control{{ $errors->has('email') ? ' is-invalid' : '' }}"
                           placeholder="Email">
                    <div class="input-group-append">
                        <div class="input-group-text"><span class="fas fa-envelope"></span></div>
                    </div>
                    @if ($errors->has('email'))
                        <span class="error invalid-feedback">{{ $errors->first('email') }}</span>
                    @endif
                </div>

                <div class="row mx-auto">
                    <button type="submit" class="btn btn-primary col-md-6">
                        Send Reset Link
                    </button>
                    <!-- /.col -->
                </div>
            </form>

           <p class="mt-3 mb-1 mx-auto">
               <a href="{{ route('login') }}">
                   <i class="fas fa-sign-in-alt"></i> Login
               </a>
           </p>
           <p class="mb-5 mx-auto">
               <a href="{{ route('register') }}" class="text-center">
                   <i class="fas fa-user-plus"></i> Register
               </a>
           </p>


           @include('whatsapp',['message'=>'Contact admin below if problem persists'])
        </div>
        <!-- /.login-card-body -->
    </div>        @endsection