<?php $this->load->view('home/header');?>
  <section class="page-body p-0">
        <div class="row g-0 ratio_asos">
          <div class="order-2 order-lg-1 col-lg-5">
            <div class="content-box">
              <div>
                <h5>LOGIN <span class="bg-theme-blue"></span></h5>
                <p class="font-md content-color">How do i get access order,wishlist and recomendation ?</p>

                <form action="<?=base_url('home/user_login_process');?>" method="post" class="custom-form form-pill">
                  <div class="input-box">
                    <label for="email">Email</label>
                    <input class="form-control" type="email" required name="userName" id="email" />
                  </div>

                  <div class="input-box">
                    <label for="password">Password</label>
                    <div class="icon-input">
                      <input class="form-control" type="password" required name="userPwd" id="password" />
                      <img class="showHidePassword" src="<?=base_url();?>assets/svg/eye-1.svg" alt="eye" />
                    </div>
                  </div>

                  <a class="forgot-link" href="<?=base_url('home/forgot_password');?>">Forgot Password?</a>

                  <button type="submit" name="submit" class="btn-solid rounded-pill line-none">Signin <i class="arrow"></i></button>
                </form>

                <span class="backto-link font-default content-color text-decoration-none">If you are new, <a class="text-decoration-underline theme-color" href="<?=base_url('home/register');?>"> Signup </a> </span>
                
              </div>
            </div>
          </div>

          <div class="order-1 order-lg-2 col-lg-7">
            <div class="img-box">
              <img class="bg-img" src="<?=base_url();?>assets/images/inner-page/banner.jpg" alt="banner" />
            </div>
          </div>
        </div>
      </section>
<?php $this->load->view('home/footer');?>
 <script>
const showHideBtn = document.querySelectorAll(".showHidePassword");
let = activeEye = 1;
for (let i = 0; i < showHideBtn.length; ++i) {
    showHideBtn[i].addEventListener("click", function () {
        let inputEl = showHideBtn[i].parentNode.querySelector("input");
        if (inputEl.type === "password") {
            inputEl.type = "text"
            activeEye = 2
        } else {
            inputEl.type = "password"
            activeEye = 1
        }
        showHideBtn[i].src = `<?=base_url();?>/assets/svg/eye-${activeEye}.svg`;
    });
}

</script>