{{#extend "checkout-new" pageClass="new-checkout-login-guest" title="Checkout - Guest Login Wickes" fullWidth=true}}
 {{#content "steps"}}
   {{> steps-three-steps active-step-index="0"}}
 {{/content}}

{{#content "main"}}


<div class="container">
    <div class="form-wrapper">
      <div class="form-wrapper__block">
          <form class="new-checkout-form">
              <h3 class="new-checkout-form__header">Wickes Login</h3>
  
              <div class="new-checkout-form__info">
                Please enter your Wickes account email and password to login.                
              </div>
  
              {{> form-row type="email" id="email" label="Email address" required=true }}

              {{> form-row type="password" id="password" label="Password" required="true"}}
  
              <div class="new-checkout-form__submit-block">
                <button class="btn btn-primary btn_full">
                  <span class="btn__text">
                    Continue
                  </span>
                </button>
              </div>

              <div class="question-block">
                <div class="warning-required">
                    Required Field
                </div>

                <a href="#" class="link-secondary forgot-link" data-toggle="modal" data-target="#modal-fogot-pass">
                  Forgotten password
                </a>                  
              </div>
  
              <div class="btn-guest-checkout-back">
                <a href="page_new-checkout-form-login-wickes.html" class="btn btn-secondary btn_full">
                  <i class="fas fa-angle-left"></i>
                  <span class="btn__text">
                      Checkout as guest instead
                  </span>
                </a>
              </div>
  
          </form>
      </div>
    </div>
</div>
  


{{/content}}

{{#content "foot" mode="append"}}
<script defer src="./js/page/checkout-sign-in.js"></script>

{{#extend "modal" id="modal-fogot-pass" title="Forgotten password" fullWidth=true}}
  {{#content "body"}}

  <form class="request-pass" action="#" id="checkout-form-forgotten-password-popup">
    <div class="component">
      <div class="request-pass__info">
        Please add your email address, to either login if you have an existing Wickes account or checkout as a Wickes guest.</div>
        <div class="form-row" data-row-required="" data-form-field="">
          <label class="form-row__label form-row__label_required" for="email">Email address</label>
          <div class="form-row__field">
            <input type="email" class="tbx" value="" id="email" name="email">
          </div>
        </div>
        <div class="form-row form-row__action">
          <div class="form-row__col-btn">
            <button class="btn btn-primary btn_full">
              <span class="btn__text">Request your new password</span>
            </button>
          </div>
        </div>
      </div>
    </form>

    <div class="modal-reset-wrap">
      <div class="modal-reset-block">
          <div class="modal-reset-icon">
              <div class="modal-reset-icon__wrap">
                  <i class="fas fa-check"></i>          
              </div>
          </div>
          <div class="modal-reset-text">
            If an account with your e-mail address exists, we'll send you an email containing your new password in the next few minutes
          </div>
      </div>
    </div>


  {{/content}}
{{/extend}}


{{/content}}

{{/extend}}
