{% load i18n %}
<c-vars link="/" bg="bg-base-200" :title="mvp_config.layout.sidebar.title" />
<div class="{{ bg }} mvp-sidebar-header sticky top-0 z-20 flex w-full items-center justify-between gap-2 px-3 py-2">
  <a href="{{ link }}"
     aria-label="{% trans "Home" %}"
     class="mvp-sidebar-brand flex min-w-0 items-center gap-2">
    <span class="flex size-10 shrink-0 items-center justify-center">
      <c-brand.icon max-height="1.5rem" class="max-h-9 max-w-9" />
    </span>
    {% if title %}<span class="mvp-sidebar-title mvp-rail-hide truncate font-semibold">{{ title }}</span>{% endif %}
  </a>
  <label for="mvp-app-toggle"
         aria-label="{% trans "Toggle sidebar" %}"
         class="mvp-sidebar-toggle btn btn-ghost btn-square">
    <c-icon name="sidebar-left" />
  </label>
</div>