{{#extend "my-account-v2"
  title="Address Book"
  dataBreadcrumbs=address_book.breadcrumbs
  pageClass="page_my-account_new"
  pageMyAcc=true
  myAccV2=true
  isLoggedIn=true
  mainClass="address-book"
}}
{{#content "head" mode="append"}}
<link type="text/css" rel="stylesheet" href="./css/pages/page_address-book.css">
{{/content}}
{{#content "main"}}
<div class="globalMessages">
  <div class="container">
    {{> notifications notification-page.error text="Please correct the errors below."}}
  </div>
</div>
<div class="container">
  <div class="row">
    <div class="col-12">
      {{> my-account/mobile-nav
      mod
      menu=my_account.diy.menu
      active-index=3
      page-name="Address Book"
      }}
    </div>
    <div class="col-12">
      <div class="address-book__header">
        <h1 class="title">Add Delivery Address</h1>
      </div>
    </div>
    <div class="col-12 col-md-7 col-lg-6">
      <form action="#" class="address-book__form">
        <label class="form-row__label form-row__label_required form-row--required">Required Field</label>
        {{#each address_book.addressFields}}
          {{#if (eq id "address-lookup-query")}}
            <div class="close-block">
            <div data-finder>
              {{> form-row
              id="address-lookup-query"
              label="Type first line of the address"
              required="true"
              }}
            </div>

            <div data-manually style="display: none;">
              {{#each ../address_book.hideFields}}
                {{> form-row
                    id=this.id
                    label=this.label
                    value=this.value
                    required=this.required
                }}
              {{/each}}
            </div>
          </div>
          {{else}}
            {{> form-row
              row-mod=this.rowMod
              type=this.type
              id=this.id
              label=this.label
              value=this.value
              placeholder=this.placeholder
              input-mod=this.modificator
              required=this.required
              showContent=this.showPassword
              }}
          {{/if}}
        {{/each}}
        {{> checkbox id="defaultAddress" label="Make this my default address" }}
        <div class="address-book__form-ctas">
          <button class="btn btn-primary btn_full" id="saveUpdates" type="submit" data-action="save-form">
            Save changes
          </button>
          <a href="/page_my-account_address-book.html" class="btn btn-secondary btn_full" data-action="cancel-form">
            Cancel
          </a>
        </div>
      </form>
    </div>
  </div>
</div>
{{/content}}
{{#content "foot" mode="append"}}
{{> my-account/leave-modal
    address_book.leave-popup
    id="leave-popup"
}}
<script defer src="./js/address-book.min.js"></script>
{{/content}}
{{/extend}}