{% comment %}Recursive navigation tree node.
Expects: node (NavNode), depth (int), active_path (str) from parent context.{% endcomment %}
{% load dj_design_system_gallery %}

{% if node.node_type.value == "app" %}
    {# ── App root node ───────────────────────────────────────────── #}
    <div class="gallery-nav__group">
        <a class="gallery-nav__group-label{% if active_path == node.active_path %} gallery-nav__link--active{% endif %}"
           href="{{ node.url }}"
           {% if active_path == node.active_path %}aria-current="page"{% endif %}>{{ node.label }}</a>
        {% for child in node.children %}
            {% include "dj_design_system/gallery/navtree.html" with node=child depth=1 active_path=active_path active_variant=active_variant %}
        {% endfor %}
    </div>
{% elif node.has_children %}
    {# ── Folder / expandable node ── #}
    <details class="gallery-nav__folder" {% if active_path %}{% if node.active_path in active_path or node.base_active_path in active_path %}open{% endif %}{% endif %}>
        <summary class="gallery-nav__link gallery-nav__link--folder{% if active_path == node.active_path and not active_variant %} gallery-nav__link--active{% endif %}"
                 {% if active_path == node.active_path and not active_variant %}aria-current="page"{% endif %}
                 data-depth="{{ depth }}">
            {% include "dj_design_system/gallery/nav_icon.html" with node=node %}
            <span class="gallery-nav__label">{{ node.label }}</span>
        </summary>
        {% for child in node.children %}
            {% include "dj_design_system/gallery/navtree.html" with node=child depth=depth|add:"1" active_path=active_path active_variant=active_variant %}
        {% endfor %}
    </details>
{% else %}
    {# ── Leaf node (component, variant, or document) ─────────────── #}
    {% nav_link_is_active node active_path active_variant as is_active %}
    <a class="gallery-nav__link{% if node.is_variant %} gallery-nav__link--variant{% endif %}{% if is_active %} gallery-nav__link--active{% endif %}"
       href="{{ node.url }}"
       {% if is_active %}aria-current="page"{% endif %}
       data-depth="{{ depth }}">
        {% include "dj_design_system/gallery/nav_icon.html" with node=node %}
        {{ node.label }}
    </a>
{% endif %}