@extends('layouts.auth_app')

@section('content')
<div class="login-card">
            <div>
              <div class="center"><a class="logo text-start" href="#"><img class="center"  src="{{asset('assets/images/logo-white-2.png')}}" alt="looginpage"><img class="img-fluid for-dark" src="{{asset('assets/images/logo-white-2.png')}}" alt="looginpage"></a></div>
              <div class="login-main"> 
                <form class="theme-form" method="POST" action="{{ route('login') }}">
                @csrf
                  <p class="text-center" style="color:black; font-weight: bold;font-size:20px">Welcome</p>
                  {{-- <p>Enter your email & password to login</p> --}}
                  <div class="form-group">
                    <label class="col-form-label">Email Address</label>
                    <input autocomplete="off" class="form-control @error('email') is-invalid @enderror" type="email" placeholder="Please enter your email address" name="email" value="{{ old('email') }}" required>
                     @error('email')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                      @enderror
                  </div>


                  <div class="form-group">
                    <label class="col-form-label">Password</label>
                    <div class="form-input position-relative">
                      <input autocomplete="off" id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" placeholder="Please enter your password"  required autocomplete="current-password">
                  
                      <div class="show-hide"><span class="show"></span></div>
                    </div>
                  </div>

                  <div class="form-group mb-0">
                    <div class="checkbox p-0">
                     <input type="checkbox" name="remember" id="remember" {{ old('remember') ? 'checked' : '' }}>

                      <label class="text-muted" for="remember">Remember Me</label>

                      @if (Route::has('password.request'))
                      <a class="link" href="{{ route('password.request') }}">
                          {{ __('Forgot Password?') }}
                      </a>
                     @endif

                    </div> 
                    <div class="text-end mt-3">
                      <button class="btn btn-primary btn-block w-100" type="submit">Sign in</button>
                    </div>
                  </div>
                    </form>
              </div>
            </div>
          </div>
          <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

          <script>
            $(document).ready(function() {
              $('.show-hide').click(function() {
                var passwordInput = $('#password');
                var showHideSpan = $('.show-hide span');
            
                if (passwordInput.attr('type') === 'password') {
                  passwordInput.attr('type', 'text');
                 
                } else {
                  passwordInput.attr('type', 'password');
                  
                }
              });
            });
            </script>
            
@endsection