<%= render "layouts/shared/htmldoc" do %>
  <div class="flex flex-col h-full bg-container pt-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)]">
    <header class="flex items-center justify-between p-8">
      <%= render DS::Link.new(
        variant: "icon",
        icon: "arrow-left",
        href: content_for(:previous_path) || imports_path
      ) %>

      <nav>
        <%= yield :header_nav %>
      </nav>

      <%= render DS::Link.new(
        variant: "icon",
        icon: "x",
        href: imports_path
      ) %>
    </header>

    <main class="grow px-8 md:pt-12 pb-32 overflow-y-auto">
      <div class="flex md:hidden justify-center w-full">
        <%= yield :mobile_import_progress %>
      </div>

      <%= yield %>
    </main>
  </div>
<% end %>
