<link rel="stylesheet" href="<?php echo base_url(); ?>files/assets/css/style.jw11.css">

<style>
    body {
        background: url("<?php echo base_url(); ?>files/assets/images/thumb/log-reg-bg-wood.jpg");
        background-position: center;
        background-size: cover;
        background-attachment: fixed;
        background-repeat: no-repeat;
    }

    .form-control {
        background: #f5f5f5 !important;
    }

    .label {
        color: #BEDD5C;
    }

    @media screen and (max-width: 576px) {
        body {
            background: url("<?php echo base_url(); ?>files/assets/images/thumb/log-reg-bg-mobile.png");
            background-position: center;
            background-size: cover;
            background-attachment: fixed;
        }

        input.form-control {
            background: white !important;
        }
    }

    .legal-bar {
        position: absolute;
        bottom: 10px;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 30px;
        background: url('<?= base_url() ?>files/assets/images/thumb/bottom-legal-bar.png');
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
    }
</style>

<div class="overlay"></div>
<a href="javascript::void(0)" class="scrollToTop"><i class="las la-chevron-up"></i></a>
<div class="login-section">
    <div class="login-thumb">
        <!-- <img src="<?php echo base_url(); ?>files/assets/images/thumb/log-reg-bg.png" alt="thumb" class="object-point-none"> -->
    </div>

    <div class="container font-poppins">
        <div class="flex justify-center items-center mt-10">
            <a href="<?= base_url() ?>" class="login-logo d-none d-lg-block"><img src="<?php echo base_url(); ?>files/assets/images/thumb/log-reg-logo.png" alt="thumb"></a>
            <a href="<?= base_url() ?>" class="login-logo-two d-lg-none d-block text-center"><img src="<?php echo base_url(); ?>files/assets/images/thumb/log-reg-logo.png" alt="thumb"></a>
        </div>

        <div class="login-area d-flex justify-content-center align-items-center">
            <div class="login-wrapper border-none">

                <?php $this->load->view('template/message.php'); ?>

                <form action="" method="post" class="login-form">

                    <!--   <div class="form-group mb-3 mb-xxl-4">
                            <label class="label" for="">Email</label>
                            <input x-model="email" type="text" class="form-control form--control"
                                placeholder="Enter your email" autocomplete="off" name="useremail">
                        </div>
                        <div class="form-group mb-3 mb-xxl-3">
                            <label class="label" for="">Password</label>
                            <input x-model="password" type="Password" class="form-control form--control"
                                placeholder="Enter your password" autocomplete="off" name="userpassword">
                        </div>
 -->

                    <div class="form-group mb-3 mb-xxl-4">
                        <label class="label" style="color: white;" for="">Email</label>
                        <input type="text" class="form-control form--control focus-register useremail rounded" name="useremail" required placeholder="Enter your email">
                    </div>
                    <div class="form-group mb-3 mb-xxl-3">
                        <label class="label" style="color: white;" for="">Password</label>
                        <input type="Password" class="form-control form--control focus-register userpassword rounded" name="userpassword" required placeholder="Enter your password">
                    </div>

                    <div class="form-group pb-2">
                        <div class="d-flex flex-wrap justify-content-between">
                            <div class="checkbox-left">
                                <!--  <input type="checkbox" class="form-check-input" id="remember-me">
                                <label for="remember-me" class="ps-xxl-2 ps-1">Remember Me</label> -->
                            </div>
                            <div class="text-right">
                                <a href="<?php echo base_url('recoverpw'); ?>" class="text--base" style="color: #BEDD5C !important;">Forgot Password?</a>
                            </div>
                        </div>
                    </div>


                    <div class="form-group">

                        <button class="cmn--btn login-btn w-100 btn--lg btn-register btn-login-show btn-effect" style="background-color: #BEDD5C; color: white; display: none;" type="submit" name="login_btn" value="ok">Login</button>

                        <button disabled class="cmn--btn login-btn w-100 btn--lg btn-register btn-login-hide cursor-no-drop btn-effect" style="background: #BEDD5C;" type="button">Login</button>
                    </div>


                    <!--  <div class="form-group">
                          
                            <button x-show="email.length >= 1 & password.length >= 1"
                                class="cmn--btn login-btn w-100 btn--lg btn-register"
                                style="background-color: #174078; color: white" type="submit"  name="login_btn" value="ok">Login</button>

                          
                            <button disabled x-show="email.length < 1 | password.length < 1"
                                class="cmn--btn login-btn w-100 btn--lg btn-register" type="button">Login</button>
                        </div> -->



                    <!-- 
                    <div class="form-group">
                        <button class="cmn--btn login-btn w-100 btn--lg btn-register" name="login_btn"  value="ok">Login</button>
                    </div> -->
                </form>
                <div class="bottom-text text-center fs-sm-12">
                    <p style="font-size: 16px; color: #fff;">Don’t have an Account? <a href="<?php echo base_url('register'); ?>" style="color: #BEDD5C;">Register</a></p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="legal-bar"></div>


<script src="<?php echo base_url(); ?>files/assets/js/lib/jquery-3.6.0.min.js"></script>

<script type="text/javascript">
    $('body').delegate('.focus-register', 'keyup keydown blur change', function() {
        console.log('hi');
        var useremail = $('.useremail').val();
        var userpassword = $('.userpassword').val();

        var check = 1;



        if (useremail == '') {
            check = 0;
        }

        if (userpassword == '') {
            check = 0;
        }

        if (check == 1) {
            $('.btn-login-hide').hide();
            $('.btn-login-show').show();
        } else {
            $('.btn-login-show').hide();
            $('.btn-login-hide').show();
        }



    });
</script>