- var page_Title = 'Login with Image Three';
- var sidebar               = false

doctype html
html(lang='en')
  include ../../components/header-files
  body
    // login page start
    .container
      .grid.grid-cols-12 
        div(class="col-span-7 xl:col-span-12 order-1")
          img.bg-img-cover.bg-center(src="../assets/images/login/1.jpg" alt="looginpage" )
        div(class="col-span-5 xl:col-span-12")
          .login-card.login-dark
            div
              div
                a.logo(href="index.html" class="!text-start")
                  img.max-w-full.h-auto.for-light(src="../assets/images/logo/logo.png" alt="looginpage" )
                  img.max-w-full.h-auto.for-dark(src="../assets/images/logo/logo_dark.png" alt="looginpage" )
              .login-main 
                form.theme-form
                  h4 Sign in to account
                  p Enter your email & password to login
                  .form-group
                    label.col-form-label Email Address
                    input.form-control(type='email', required='' placeholder='test@gmail.com')
                  .form-group
                    label.col-form-label Password
                    .form-input.relative
                      input.form-control(type='password', name='login[password]', required='' placeholder="*********")
                      .show-hide
                        span.show                          
                  .form-group.mb-0
                    .form-check.flex.gap-1.items-center
                      input#checkbox1.checkbox-primary.form-check-input.custom-checkbox(type='checkbox')
                      label.text-muted.form-check-label(for='checkbox1' class="!mb-0") Remember password
                    a.link(href='forgot-password.html') Forgot password?
                    .text-end.mt-3
                      button.btn.btn-primary.btn-block.w-full.text-white(type='submit' class="!mt-[24px]") Sign in
                  h6.text-muted.or(class="mt-[24px]") Or Sign in with
                  .social(class="mt-[24px]")
                    .btn-showcase
                      a.btn.btn-light.inline-block(href='https://www.linkedin.com/login' target='_blank')
                        i.fa-brands.fa-linkedin-in
                      a.btn.btn-light.inline-block(href='https://twitter.com/login?lang=en' target='_blank')
                        i.fa-brands.fa-x-twitter
                      a.btn.btn-light.inline-block(href='https://www.facebook.com/' target='_blank')
                        i.fa-brands.fa-facebook-f
                      a.btn.btn-light.inline-block(href='https://www.google.com/' target='_blank')
                        i.fa-brands.fa-google
                  p.text-center(class="mt-[24px] !mb-0") Don't have account?
                    a.ms-2(href="sign-up.html") Create Account

                  script.
                    (function() {
                    'use strict';
                    window.addEventListener('load', function() {
                    // Fetch all the forms we want to apply custom Bootstrap validation styles to
                    var forms = document.getElementsByClassName('needs-validation');
                    // Loop over them and prevent submission
                    var validation = Array.prototype.filter.call(forms, function(form) {
                    form.addEventListener('submit', function(event) {
                    if (form.checkValidity() === false) {
                    event.preventDefault();
                    event.stopPropagation();
                    }
                    form.classList.add('was-validated');
                    }, false);
                    });
                    }, false);
                    })();

      include ../../components/footer-files