{{#extend "checkout" pageClass="page_checkout page_checkout-confirmation" title="Checkout - Confirmation - Guest"}}
  {{#content "steps"}}
    <div class="page-header">
      <h1 class="page-header__title">Thank You, Your Order Has Been Placed</h1>
      <p class="page-header__order-number">Order number: <span class="page-header__order-number_strong">143402004</span></p>
      <p class="page-header__intro">We have emailed your order confirmation to <a href="#">michael.michael@gmail.com</a>
        with details of when your order will be delivered.
        This email will also contain our contact details should you wish to get in touch with us.</p>
    </div>
  {{/content}}
  {{#content "main"}}
    <div class="header-descr col-12">
      <h3>Products delivered by Wickes</h3>
      <p>The product listed below will be delivered to you by Wickes. The date, time slot and address for this delivery are
        listed below:</p>
    </div>
  <div class="checkout-confirmation-wrapper">
    <div class="product-delivery-table">
      <div class="product-delivery-table__delivery-info">
      <div class="row">
        <div class="product-delivery-table__date">
          <h4>Delivery date</h4>
          <div class="product-delivery-table__date-inner">
            <div class="checkout-address-time__time-regular">MAR</div>
            <div class="checkout-address-time__time-primary">15</div>
            <div class="checkout-address-time__time-additional">8:00am - 6:00pm</div>
          </div>
        </div>
        <div class="product-delivery-table__time">
          <h4>Delivery time</h4>
          <div class="product-delivery-table__content">
            8:00am - 6:00pm
          </div>
        </div>
        <div class="product-delivery-table__address">
          <h4>Delivery address</h4>
          <div class="product-delivery-table__content">
            459 Acasia way<br/>
            Wimbledon<br/>
            London<br/>
            S7 7ET
          </div>
        </div>
      </div>
      </div>

      <div class="shopping-card-container">
        {{#each page_confirmation.linesCollection}}
         {{>order-line mod="order-line_shrink" calculator-notification=true}}
        {{/each}}
      </div>
    </div>
    {{>checkout-supply-info checkout-components.supply-info.[2]}}
    <div class="checkout-confirmation-shopping-cards">
  {{#each page_confirmation.linesCollection}}
  <div class="checkout-confirmation-shopping-card">
    <h4>Collection from Oldham store <span class="checkout__text-highlighted">1 Item</span></h4>
    <span class="checkout__text-highlighted">Your order will be ready for collection within 1 store hour.</span>
    <div class="shopping-card-container shopping-card-container_bordered">
      <div class="delivery-details-option__delivery-info">
        <div class="delivery-details-option__delivery-info-left">
          {{>checkout-address-time  time=true within=true}}
        </div>
        <div class="delivery-details-option__delivery-info-right">
          {{>schedule}}
        </div>
      </div>
      {{>order-line mod="order-line_shrink"}}
    </div>
  </div>
  {{/each}}
</div>
  </div>
    <form class="checkout-register form-bg">
      <div class="checkout-register__row">
        <div class="checkout-register__descr">
          <h3>Ready to register?</h3>
          <p class="checkout-register__paragraph">Registering to Wickes comes with many benefits, it will also make checkout much faster if you choose to shop with us again. Feel free to setup your password below:</p>
          <h4 class="checkout-register__title">Create your password</h4>
          <div class="warning-required">Required fields</div>
          {{> form-row type="password" id="password" label="Password"  info="Minimum length is 6 characters" required="true"}}
          {{> form-row type="password" id="confirm-password" label="Confirm password" required="true"}}
        </div>
      </div>
      <div class="checkout-register__row">
        <div class="checkout-register__descr">
          <h4 class="checkout-register__card-title">Save your card</h4>
          <div class="checkout-register__card">
            <dl class="checkout-register__card-info">
              <dt>Card type:</dt>
              <dd><span>Visa</span></dd>
              <dt>Card number:</dt>
              <dd><span>41114111*****111</span></dd>
              <dt>Name on card:</dt>
              <dd><span>Konstantin Konstantinopolsky</span></dd>
            </dl>
          </div>
          <div class="form-row">
            <div class="form-row__field">
              {{> checkbox id="check-card-save" label="Save this card to my account"}}
            </div>
          </div>
          {{> form-row dropdown="true" id="card-type" label="Additional infomation" placeholder="Please select" info="How would you describe yourself or main trade"}}
        </div>
      </div>
      <div class="form-row form-row__action form-row__action_custom">
        <div class="form-row__col-btn">
          <a href="./" class="btn btn-secondary btn_full">
            <span class="btn__text">Return to shopping</span>
          </a>
        </div>
        <div class="form-row__col-btn">
          <button class="btn btn-primary btn_full" type="submit">
            <span class="btn__text">Create account</span>
          </button>
        </div>
      </div>
    </form>
  {{/content}}
  {{#content "aside"}}
    {{> checkout_order-summary label="Total: "}}
    {{> checkout_payment }}
    {{> checkout_information }}
    <div class="form-row form-row__action form-row__action_custom">
      <div class="form-row__col-btn">
        <a href="./" class="btn btn-secondary btn_full">
          <span class="btn__text">Return to shopping</span>
        </a>
      </div>
      <div class="form-row__col-btn">
        <button class="btn btn-primary btn_full" id="checkout-register-submit">
          <span class="btn__text">Create account</span>
        </button>
      </div>
    </div>
  {{/content}}
{{#content "foot" mode="append"}}
  <script defer src="js/page/checkout-confirmation.js"></script>
{{/content}}
{{/extend}}
