{% block navigation %}
    <nav class="header__primary_nav -logo_header">
        <div class="primary_nav__toggle">
            <svg viewBox="0 0 100 80" width="32" height="32">
              <rect width="100" height="15"></rect>
              <rect y="30" width="100" height="15"></rect>
              <rect y="60" width="100" height="15"></rect>
            </svg>
            <p>menu</p>
        </div>

        <ul class="primary_nav__navlist">
                {% for title, mapping in bag("navigation").items() %}
                  {% if mapping.visible|default(true) %}
                    <li id="{{ mapping.slug }}" class="primary_nav__navitem">
                        {%if not mapping.list_childs %}
                            <a class="primary_nav__navlink 
                                {% if this._path == mapping.href
                                    or this._path in mapping['items'].values()
                                -%}-active{% endif %}" href="{{ mapping.href|url }}">
                                {{ title }}
                            </a>
                        {% elif mapping.list_childs %}
                            <span class="primary_nav__navlink 
                                {% if this._path == mapping.href
                                    or this._path in mapping['items'].values()
                                    or this._path in mapping.href
                                    or mapping.href == '/aktuelles' and ('blog' in this._path or 'podcast' in this._path)
                                -%}-active{% endif %}">
                                {{ title }}
                            </span>
                            <ul class="primary_nav__sub_navlist -closed">
                                <li class="primary_nav__sub_navitem">
                                    <a class="primary_nav__sub_navlink " href="{{ mapping.href|url }}">
                                        {{ title }}
                                    </a>
                                </li>
                                {% set sub_menu = mapping['items'].items() %}
                                {% for sub_title, href in sub_menu %}
                                    <li class="primary_nav__sub_navitem">
                                        <a class="primary_nav__sub_navlink {% if this._path == href %}-active{% endif %}" href="{{ href|url }}">
                                            {{ sub_title }}
                                        </a>
                                    </li>
                                    {% if sub_title == 'Blog' or sub_title == 'Podcast' %}
                                        {% set children = site.get(href).children %}
                                        <ul>
                                            {% for child in children %}
                                                {% if loop.index <= 3 %}
                                                    <li class="primary_nav__sub_navitem">
                                                        <a class="primary_nav__sub_navlink {% if this._path + '/' == child.url_path %}-active{% endif %}" href="{{ child.url_path }}">
                                                            {{ child.title }}
                                                        </a>
                                                    </li>
                                                {% endif %}
                                            {% endfor %}
                                        </ul>
                                    {% endif %}
                                {% endfor %}
                            </ul>
                        {% endif %}
                    </li>
                  {% endif %}
                {% endfor %}
            </ul>
        </nav>

        <ul class="primary_nav__mobile_navlist">
            {% for title, mapping in bag("navigation").items() %}
              {% if mapping.visible|default(true) %}
                <li id="{{ mapping.slug }}" class="primary_nav__navitem">
                    <a class="primary_nav__navlink {% if this._path == mapping.href -%}-active{% endif %}" href="{{ mapping.href|url }}">
                        {{ title }}
                    </a>
                    {% if mapping.list_childs %}
                        <ul class="primary_nav__sub_navlist">
                            {% set sub_menu = mapping['items'].items() %}
                            {% for sub_title, href in sub_menu %}
                                <li class="primary_nav__sub_navitem">
                                    <a class="primary_nav__sub_navlink {% if this._path == href %}-active{% endif %}" href="{{ href|url }}">
                                        {{ sub_title }}
                                    </a>
                                </li>
                                {% if sub_title == 'Blog' or sub_title == 'Podcast' %}
                                    {% set children = site.get(href).children %}
                                    <ul>
                                        {% for child in children %}
                                            {% if loop.index <= 3 %}
                                                <li class="primary_nav__sub_navitem">
                                                    <a class="primary_nav__sub_navlink {% if this._path + '/' == child.url_path %}-active{% endif %}" href="{{ child.url_path }}">
                                                        {{ child.title }}
                                                    </a>
                                                </li>
                                            {% endif %}
                                        {% endfor %}
                                    </ul>
                                {% endif %}
                            {% endfor %}
                        </ul>
                    {% endif %}
                </li>
              {% endif %}
            {% endfor %}
        </ul>
    </nav>
{% endblock %}