<nav class="navbar navbar-expand-lg {{ site.data.theme.navbar-color | default: 'navbar-dark' }} {{ site.data.theme.navbar-background | default: 'bg-dark' }}">
    <div class="container">
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#page-nav" aria-controls="page-nav" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        {% if site.organization-logo-nav %}<span class="d-lg-none text-end">
            <a href="{{ site.organization-link }}">
                <img class="img-fluid" id="mobile-nav-image" src="{{ site.organization-logo-nav | relative_url }}" title="{{ site.organization-name }}" alt="{{ site.organization-name | escape }} home" >
            </a>
        </span>{% endif %}
        
        <div class="collapse navbar-collapse" id="page-nav">
            <ul class="navbar-nav me-auto">
                {%- assign navItems = site.data.config-nav | where_exp: 'item', 'item.display_name and item.dropdown_parent == nil' -%} 
                {% for nav in navItems %}
                {% if nav.stub %}
                <li class="nav-item">
<a class="nav-link{% if page.url == nav.stub %} active{% endif %}{% if nav.display_name == 'DONATE' %} donate-link{% endif %}"
   href="{{ nav.stub | relative_url }}">
   {{ nav.display_name }}
</a>
                </li>
                {%- else -%}
                <li class="nav-item dropdown">
                    {% assign navChildren = site.data.config-nav | where_exp: 'item', 'item.dropdown_parent == nav.display_name' %}
                    {%- assign childStubs = navChildren | map: 'stub' -%}
                    <a class="nav-link  dropdown-toggle{% if childStubs contains page.url %} active{% endif %}" data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">{{ nav.display_name }}</a>
                    <div class="dropdown-menu">
                       {% for c in navChildren %}
                        {% if c.stub %}
                            <a class="dropdown-item {% if page.url == c.stub %}active{% endif %}"
                            href="{{ c.stub | relative_url }}">
                            {{ c.display_name }}
                            </a>
                        {% else %}
                            <div class="dropdown-header nav-section-label">
                            {{ c.display_name }}
                            </div>
                        {% endif %}
                        {% endfor %}
                    </div>
                </li>
                {% endif %}
                {%- endfor -%}
            </ul>
            
            {% include nav-search-lunr.html %}
            
        </div>
    </div>
</nav>
