{{#extend
"my-account-v2"
dataBreadcrumbs=my_order.breadcrumbs
pageClass="page_my-account_new"
title="My Order"
pageMyAcc=true
myAccV2=true
isLoggedIn=true
mainClass="my-order"
}}
{{#content "head" mode="append"}}
<link type="text/css" rel="stylesheet" href="./css/pages/page_my-order.css">
{{/content}}
{{#content "main"}}
<div class="container">
  <div class="row">
    <div class="col-12">
      {{> my-account/mobile-nav
      menu=my_order.menu
      active-index=1
      page-name=my_order.menu.[1].title
      }}
    </div>
  </div>
</div>

<div class="container">
  <div class="row">
    <div class="col-12">
      <div class="my-order__header">
        <h1 class="my-order__title">Order {{my_order.order.number}}</h1>
        <nav class="linked-order">
          <p class="linked-order__title">Linked to order:</p>
          <ul class="linked-order__list">
            {{#each my_order.order.linkedToOrder}}
            <li class="linked-order__item">
              <a class="link" href="{{link}}">{{number}}</a>
              {{#ifCond @index '<' (math ../my_order.order.linkedToOrder.length '-' 1)}},{{/ifCond}}
            </li>
            {{/each}}
          </ul>
        </nav>
        <p class="my-order__placed">Order placed on <span class="date">{{my_order.order.orderDate}}</span></p>
        <button class="btn btn-primary btn_full btn--resend-confirmation" disabled>Confirmation resent</button>
      </div>
    </div>
    <div class="col-12 col-lg-9">
      <div class="my-order__body">
        {{> notifications notification-page.error title=my_order.notifications.error.title text=my_order.notifications.error.description}}
      </div>
    </div>
    <div class="col-12 col-lg-3">
      <div class="wismo">
        {{> my-account/wismo_order-summary my_order.wismo-order-summary }}
        {{> wismo-payment }}
      </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  }}
        <a href="#" class="link-to-orders">
          <span class="icon-wrap">
            <i class="far fa-arrow-left icon icon-back"></i>
          </span>
          Back to My Orders
        </a>
      </div>
    </div>
  </div>
</div>
{{/content}}
{{#content "foot" mode="append"}}
<script defer src="./js/my-account.min.js"></script>
{{/content}}
{{/extend}}