@extends('layouts.auth')
@section('content')
<div class="content">
  <div class="container">
    <div class="card card-auth">
      <div class="card-body text-center">

        <div class="mb-5">
          <object type="image/svg+xml" data="{{ asset('assets/svg/forgot_password.svg') }}" class="w-50"></object>
        </div>

        @if (session('status'))
          <div class="alert alert-outline alert-info d-flex align-items-center" role="alert">
            <i class="ri-information-line"></i> {{ session('status') }}
          </div>
        @endif

        <form id="form_password_email" method="POST" action="{{ route('password.email') }}" onsubmit="spinbtn()">
        @csrf
          <h3 class="card-title">Reset your password</h3>
          <p class="card-text mb-5">Enter your username or email address and we will send you a link to reset your password.</p>
          <div class="row g-2">
            <div class="col-sm-12">
              <input id="email" type="email" placeholder="Enter email address" class="form-control  @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
              @error('email')
                <ul class="parsley-errors-list filled" aria-hidden="false"><li class="parsley-required">{{ $message }}</li></ul>
              @enderror
            </div>
            <div class="col-sm-12">
              <button id="btnSubmit" type="submit" class="btn btn-primary">
                {{ __('Send Password Reset Link') }}
              </button>
            </div>
          </div><!-- row -->
        </form>
      </div><!-- card-body -->
    </div><!-- card -->
  </div><!-- container -->
</div><!-- content -->
@endsection


<script type="text/javascript">
  function spinbtn()
  {
    document.getElementById("btnSubmit").innerHTML = '<span id="ShowSpinner" class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Sending Password Reset Link to Email....';
    document.getElementById("btnSubmit").disabled = true;
    document.getElementById('form_password_email').submit();
  }
</script>