{% macro render_nodes(nodes) %}
<ul class="theme-tree-list list-unstyled mb-0 ps-0">
    {% for node in nodes %}
        {% if node.type == 'dir' %}
            <li class="mb-0">
                <details class="theme-tree-details" open>
                    <summary class="theme-tree-folder">
                        <i class="bi bi-folder2"></i>
                        <span>{{ node.name }}</span>
                    </summary>
                    <div class="theme-tree-nested">
                        {{ _self.render_nodes(node.children) }}
                    </div>
                </details>
            </li>
        {% else %}
            <li class="mb-1">
                <div class="file-item theme-tree-file-item{% if node.hasOverride %} file-item--override{% endif %}"
                     data-file="{{ node.path|e('html_attr') }}"
                     data-has-override="{{ node.hasOverride ? '1' : '0' }}"
                     onclick="selectFileFromEl(this)">
                    <i class="bi file-item-icon {% if node.hasOverride %}bi-pencil-square{% else %}bi-file-earmark-text{% endif %}"></i>
                    <span class="theme-tree-file-label text-truncate">{{ node.name }}</span>
                </div>
            </li>
        {% endif %}
    {% endfor %}
</ul>
{% endmacro %}