{% set nav_items = [
  ("dashboard", "/", "icon-home", "Home"),
  ("projects", "/projects", "icon-projects", "Projects"),
  ("releases", "/releases", "icon-releases", "Releases"),
  ("calendar", "/calendar", "icon-calendar", "Calendar"),
] %}
{% set more_items = [
  ("marketing", "/marketing", "icon-marketing", "Marketing"),
  ("scanner", "/scanner", "icon-scanner", "Scanner"),
  ("delivery", "/delivery", "icon-deliveries", "Deliveries"),
  ("analytics", "/analytics", "icon-analytics", "Analytics"),
  ("settings", "/settings", "icon-settings", "Settings"),
] %}

<nav class="sidebar" aria-label="Primary">
  <div class="sidebar-brand">
    <img src="/static/icons/icon-192.png" alt="" width="32" height="32">
    ProducerOS
  </div>
  {% for key, href, icon, label in nav_items %}
  <a class="nav-link{% if active_nav == key %} active{% endif %}" href="{{ href }}" {% if active_nav == key %}aria-current="page"{% endif %}>
    <svg class="icon" aria-hidden="true"><use href="/static/svg/icons.svg#{{ icon }}"/></svg>
    {{ label }}
  </a>
  {% endfor %}
  <hr class="layout-35">
  {% for key, href, icon, label in more_items %}
  <a class="nav-link{% if active_nav == key %} active{% endif %}" href="{{ href }}" {% if active_nav == key %}aria-current="page"{% endif %}>
    <svg class="icon" aria-hidden="true"><use href="/static/svg/icons.svg#{{ icon }}"/></svg>
    {{ label }}
  </a>
  {% endfor %}
  <div class="sidebar-footer">
    <span class="user-avatar">{{ current_user.display_name[:1]|upper if current_user else 'P' }}</span>
    <div>{{ current_user.display_name if current_user else "" }}<span class="local-note">Local workspace</span><a href="/logout">Sign out</a></div>
  </div>
</nav>

<nav class="bottom-nav" aria-label="Primary (mobile)">
  {% for key, href, icon, label in nav_items %}
  <a href="{{ href }}" class="{% if active_nav == key %}active{% endif %}" aria-current="{{ 'page' if active_nav == key else 'false' }}">
    <svg class="icon" aria-hidden="true"><use href="/static/svg/icons.svg#{{ icon }}"/></svg>
    <span>{{ label }}</span>
  </a>
  {% endfor %}
  <a href="/more" class="{% if active_nav == 'more' %}active{% endif %}">
    <svg class="icon" aria-hidden="true"><use href="/static/svg/icons.svg#icon-more"/></svg>
    <span>More</span>
  </a>
</nav>