{{#extend
"my-account-v2"
dataBreadcrumbs=track_order.breadcrumbs
pageClass="page_my-account_new"
title="Track My Order"
pageMyAcc=true
myAccV2=true
isLoggedIn=true
mainClass="track-order"
}}
{{#content "head" mode="append"}}
<link type="text/css" rel="stylesheet" href="./css/pages/page_my-order.css">
<link type="text/css" rel="stylesheet" href="./css/pages/page_track-my-order.css">
<link type="text/css" rel="stylesheet" href="./css/pages/new-usp-bar.css">
<link type="text/css" rel="stylesheet" href="./css/components/energy-efficiency.css">
{{/content}}
{{#content "main"}}

{{#content "body"}}
{{> new-usp-container}}
{{/content}}
<div class="container">
  <div class="row">
    <div class="col-12">
      <div class="track-order__wrap">
        {{> track-my-order-info track_order.info }}

        <div class="track-order__main">
          <h1 class="title">Track My Order</h1>
          {{> track-my-order-form }}
        </div>
      </div>

      <div class="my-order">
        <div class="my-order__header">
          <h2 class="my-order__title">Order {{track_order.order.number}}</h2>
          <p class="my-order__placed">Order placed on <span class="date">{{track_order.order.orderDate}}</span></p>
          {{> button
              primary="true"
              full=true
              modification="btn--print"
              text="Print"
              icon="fas fa-print icon"
          }}
        </div>
        <div class="my-order__body">
          {{#each my_order.order.products }}
            {{> my-account/order this }}
          {{/each}}
        </div>
      </div>
    </div>
  </div>
</div>

<div class="account-actions">
  <div class="container">
    <div class="row">
      <div class="col-12">
        {{> my-account/contact-us contacts=my_order.contacts }}
      </div>
    </div>
  </div>
</div>
{{/content}}
{{#content "foot" mode="append"}}
{{#extend "modal" classMod="modal-energy-efficiency" id="modal-energy-efficiency" title="" fullWidth=true showCloseBtn=true newIconCross=true}}
  {{#content "sections"}}
    <div class="modal-images"></div>
  {{/content}}
{{/extend}}
<script defer src="./js/track-my-order.min.js"></script>
<script defer src="./js/energy-efficiency.min.js"></script>
{{/content}}
{{/extend}}
