{% load i18n mvp %}
<c-vars :breakpoint="mvp_config.layout.sidebar.breakpoint"
        :collapse="mvp_config.layout.sidebar.collapse" />
<div class="navbar px-3 w-full backdrop-blur transition-shadow duration-100 print:hidden">
  <div class="navbar-start gap-1 ">
    <label for="mvp-app-toggle"
           aria-label="{% trans "Open sidebar" %}"
           class="btn btn-ghost btn-square {% sidebar_navbar_toggle_class breakpoint collapse %}">
      <c-icon name="menu" />
    </label>
    <a href="/">
      {% comment %} <c-brand.icon size="sm" /> {% endcomment %}
      <div class="text-2xl hidden lg:flex items-center">{{ request.site.name }}</div>
      {% comment %} <div class="lg:hidden">
        <c-brand.logo max-height="1rem" />
      </div> {% endcomment %}
    </a>
  </div>
  <div class="navbar-end gap-1">
    {{ right }}
    {% for widget in mvp_config.layout.navbar.end %}
      <c-component :is="widget" />
    {% endfor %}
  </div>
</div>