<%
const contacts = _.cms('contacts') || {}
const footer = _.cms('footer') || {}
const logo = _.settings.logo
  ? { url: (_.assetsPrefix || '') + _.settings.logo, alt: _.settings.name }
  : _.store.logo
%>

<!doctype html>
<html lang="<%= _.lang.replace('_', '-') %>" dir="ltr">

<head>
  <%- await include('@/head') %>
</head>

<body class="app">
  <header class="app__header">
    <div class="container-fluid">
      <div class="row">
        <div class="col-12 col-sm-auto mb-2 mb-sm-0">
          <a href="/">
            <% if (logo && logo.url) { %>
              <img class="app__logo" src="<%= logo.url %>" alt="<%= logo.alt %>">
            <% } else { %>
              <%= _.settings.name || _.store.name %>
            <% } %>
          </a>
        </div>

        <div class="col">
          <div class="app__contact">
            <span class="d-none d-md-inline">
              <%= _.dictionary('needHelpQn') %> <%= _.dictionary('callTo') %>
            </span>
            <% if (contacts.whatsapp) { %>
              <span><%= contacts.whatsapp %></span>
            <% } %>
            <% if (contacts.phone) { %>
              <span><%= contacts.phone %></span>
            <% } %>
          </div>

          <div class="app__safe">
            <span class="app__safe-icon">
              <i class="i-shield"></i>
            </span>
            <%= _.dictionary('safeEnvMsg') %>
          </div>
        </div>
      </div>
    </div>
  </header>

  <main id="spa">
    <div id="storefront-app">
      <%- await include('@/sections/inc/loading') %>
    </div>
  </main>

  <footer>
    <div class="app__footer">
      <div class="container-fluid">
        <div class="app__stamps">
          <%- await include(`@/sections/stamps`, { _, opt: { stamps: footer.stamps } }) %>
        </div>
      </div>
    </div>

    <div class="app__credits container">
      <div>
        <% if (footer.credits) { %>
          <span><%= footer.credits %></span>
        <% } else { %>
          <span class="app__credits-name">© <%= _.settings.name %> </span>
          <span class="app__credits-address"> - <%= contacts.address %> - </span>
          <span class="app__credits-number"> <%= contacts.doc_number %></span>
        <% } %>
      </div>

      <%- await include('@/layout/inc/ecom-credits') %>
    </div>
  </footer>

  <%- await include('@/json', { _ }) %>
  <%- await include('@/scripts') %>
</body>

</html>
