@extends('frontend.layouts.app')
@section('content')
    <section class="bg-color-white mt--50 mb--50">
        <div class="container">
            <div class="row gy-5 row--30 text align-items-center">
                <div class="col-lg-6">
                    <img class="signIn__desktop d-none d-xl-block" src="{{ asset('frontend/images/login.gif') }}"
                        class="w-100">
                </div>
                <div class="col-lg-6">
                    <div class="rbt-contact-form contact-form-style-1 max-width-auto">
                        <form action="{{ route('login') }}" method="POST" class="max-width-auto">
                            @csrf
                            <div class="row">
                                @if ($errors->has('error'))
                                    <div class="text-danger">{{ $errors->first('error') }}</div>
                                @endif
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <input type="email" name="email" />
                                        @if ($errors->has('email'))
                                            <div class="text-danger lbl_msg">{{ $errors->first('email') }}</div>
                                        @endif
                                        <label>Username or email *</label>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <div class="input-group" id="show_hide_password">
                                            <input type="password" class="form-control" name="password" id="password"
                                                autocomplete="new-password">
                                            <div class="input-group-append">
                                                <div class="input-group-text">
                                                    <a href="#"><i class="fa fa-eye-slash" aria-hidden="true"></i></a>
                                                </div>
                                            </div>
                                        </div>
                                        @if ($errors->has('password'))
                                            <div class="text-danger lbl_msg">{{ $errors->first('password') }}</div>
                                        @endif
                                        <label>Password *</label>
                                    </div>
                                </div>

                                <div class="row mb--30">
                                    <div class="col-lg-6">
                                        <div class="rbt-checkbox">
                                            <input type="checkbox" id="rememberme" name="rememberme">
                                            <label for="rememberme">Remember me</label>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="rbt-lost-password text-end">
                                            <a class="rbt-btn-link" href="{{ route('forgot.password') }}">Forgot your
                                                password ?</a>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <div class="form-submit-group rbt-btn-wrapper">
                                        <button type="submit" class="rbt-btn btn-sm radius-round radius-round w-100">
                                            Log In <i class="feather-arrow-right"></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
    </section>
    @push('js')
        <script>
            $(document).ready(function() {
                $("#show_hide_password a").on('click', function(event) {
                    event.preventDefault();
                    if ($('#show_hide_password input').attr("type") == "text") {
                        $('#show_hide_password input').attr('type', 'password');
                        $('#show_hide_password i').addClass("fa-eye-slash");
                        $('#show_hide_password i').removeClass("fa-eye");
                    } else if ($('#show_hide_password input').attr("type") == "password") {
                        $('#show_hide_password input').attr('type', 'text');
                        $('#show_hide_password i').removeClass("fa-eye-slash");
                        $('#show_hide_password i').addClass("fa-eye");
                    }
                });
            });
        </script>
    @endpush
@endsection