{% load static %}
{% load i18n %}


<!-- LOGO / APP NAME -->
<div class="px-6 py-5 border-b border-gray-800 shrink-0">
  <a href="{% url 'app_home:private' %}" class="flex items-center gap-2">
    {% if LOGO_SIZE > 0 %}
    <img src="/logo/logo.png" width="{{ LOGO_SIZE }}" class="shrink-0">
    {% else %}
    <span class="material-symbols-outlined text-2xl leading-none text-indigo-400 font-bold">home</span>
    {% endif %}
    <span class="text-white font-extrabold text-base tracking-tight truncate">
      {{ GLOBAL_APPNAME|default:"Cavaliba" }}
    </span>
    {% if SIDEBAR_ENV %}
    <span class="ml-1 rounded-full bg-red-600 text-white text-xs px-1.5 py-0.5 shrink-0 leading-none">
      {{ SIDEBAR_ENV }}
    </span>
    {% endif %}
  </a>
</div>


<!-- NAV SECTIONS -->
<nav class="flex-1 px-3 py-4 space-y-0.5 text-sm overflow-y-auto">

{% for section in sidebar %}

  <!-- Section label -->
  <div class="pt-4 pb-1 px-3 text-xs font-semibold uppercase tracking-widest text-gray-500 first:pt-1">
    {{ section.0 }}
  </div>

  {% for entry in section.1 %}
  {% if entry.is_allowed %}
  <a class="flex items-center gap-3 px-3 py-2 rounded-lg text-gray-300
             hover:bg-gray-800 hover:text-white transition"
     href="{{ entry.url }}">
    <span class="material-symbols-outlined text-xl leading-none text-gray-400">{{ entry.icon|default:"circle" }}</span>
    <span>{{ entry.displayname }}</span>
  </a>
  {% endif %}
  {% endfor %}

{% endfor %}

</nav>