{% extends "base.html" %}

{#
  Admin base layout.
  Child templates can set `active_page` to one of: 'admin', 'banner', 'confused'
  to highlight the correct nav link.
#}

{% block body %}
  {% block admin_nav %}
  <nav class="bg-white border-gray-200 dark:bg-gray-900">
    <div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">

      {# Left side: logo + optional course switcher #}
      <div class="flex items-center space-x-6 rtl:space-x-reverse">
        <a href="{{ url_for('main.index') }}" class="flex items-center">
          <span class="self-center text-2xl font-semibold whitespace-nowrap dark:text-white">Tutortool</span>
        </a>

        {% block nav_left_extra %}{% endblock %}
      </div>

      {# Right side: nav links #}
      <div class="w-auto" id="navbar-default">
        <ul class="flex flex-row space-x-8 rtl:space-x-reverse font-medium p-0 border-0 bg-white dark:bg-gray-900">
          {% set nav_links = [
            ('admin.admin',                 'Deck Admin', 'admin'),
            ('admin.banner',                'Banner',     'banner'),
            ('admin.confused_notifications','Confused',   'confused'),
            ('admin.dashboard',             'Dashboard',  'dashboard')
          ] %}
          {% for endpoint, label, page_id in nav_links %}
            {% if active_page == page_id %}
              <li>
                <a href="{{ url_for(endpoint) }}"
                   class="rounded-sm text-blue-700 dark:text-blue-500 font-semibold"
                   aria-current="page">{{ label }}</a>
              </li>
            {% else %}
              <li>
                <a href="{{ url_for(endpoint) }}"
                   class="text-gray-900 dark:text-white hover:text-blue-700 dark:hover:text-blue-500">{{ label }}</a>
              </li>
            {% endif %}
          {% endfor %}
        </ul>
      </div>

    </div>
  </nav>
  {% endblock admin_nav %}

  {% block admin_content %}{% endblock %}
{% endblock body %}