{% if results is not none and not results.empty %}
{% if view_mode == 'table' %}
<div class="table-responsive shadow-sm rounded">
    <table class="table table-hover table-sm align-middle mb-0 bg-white">
        <thead class="table-light">
            <tr>
                <th class="ps-3">Tag</th>
                <th>Author</th>
                <th>Title</th>
                <th>Source</th>
            </tr>
        </thead>
        <tbody>
            {% for _, row in results.iterrows() %}
            <tr class="{{ 'table-info-subtle' if row.is_book else '' }}">
                <td class="ps-3 py-2">
                    <div class="d-flex align-items-center">
                        <a href="{{ url_for('main.view', tag=row.tag) }}" class="tag text-decoration-none fw-bold" target="_blank">{{ row.tag }}</a>
                        {% if is_admin %}
                        <a href="{{ url_for('main.editor_page') }}?tag={{ row.tag }}" class="ms-2 text-muted opacity-25 hover-opacity-100" title="Edit Tag">
                            <i class="bi bi-pencil-square"></i>
                        </a>
                        {% endif %}
                    </div>
                </td>
                <td class="author text-muted small">{{ row.author_display }}</td>
                <td class="title {{ 'fw-bold' if row.is_book else '' }}">{{ row.title_display }}</td>
                <td class="journal small"><i>{{ row.journal if 'journal' in row else (row.publisher if 'publisher' in row else '') }}</i></td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
{% elif view_mode == 'verbose' %}
<div class="verbose-list">
    {% for _, row in results.iterrows() %}
    <div class="list-item mb-3 p-3 bg-white rounded shadow-sm border-start border-4 {{ 'border-primary' if row.is_book else 'border-secondary' }}">
        <div class="d-flex justify-content-between align-items-start mb-1">
            <span class="tag-container">
                <a href="{{ url_for('main.view', tag=row.tag) }}" class="tag text-decoration-none fw-bold" target="_blank">{{ row.tag }}</a>
                {% if is_admin %}
                <a href="{{ url_for('main.editor_page') }}?tag={{ row.tag }}" class="ms-1 text-muted opacity-25 hover-opacity-100" title="Edit Tag">
                    <i class="bi bi-pencil-square" style="font-size: 0.8rem;"></i>
                </a>
                {% endif %}
            </span>
            <span class="year badge bg-light text-dark border">{{ row.year_display }}</span>
        </div>
        <div class="title mb-1 {{ 'fw-bold fs-5' if row.is_book else 'fs-6' }}">"{{ row.title_display }}"</div>
        <div class="author text-muted small mb-2">{{ row.author_display }}</div>
        
        <!-- Dynamic Metadata Grid -->
        {% set skip_keys = ['tag', 'title', 'author', 'year', 'journal', 'publisher', 'hash', 'path', 'is_book', 'title_display', 'author_display', 'year_display', 'hash_display', 'querex', 'version', 'type', 'node', 'links', 'suffix', 'mod', 'create', 'access', 'last_caller'] %}
        <div class="metadata-grid d-flex flex-wrap gap-2 mb-2">
            {% for key, value in row.items() %}
                {% if key not in skip_keys and value is not none and value|string|trim != '' and value|string|lower != 'nan' and value|string != 'NaT' %}
                <div class="metadata-item bg-light border px-2 py-1 rounded small shadow-xs" style="font-size: 0.75rem;">
                    <span class="text-muted text-uppercase fw-bold me-1" style="font-size: 0.65rem;">{{ key.replace('_', ' ') }}:</span>
                    <span class="text-dark">{{ value }}</span>
                </div>
                {% endif %}
            {% endfor %}
        </div>

        <div class="footer-meta d-flex gap-3 small text-muted border-top pt-2 mt-2">
            {% if row.get('journal') or row.get('publisher') %}
            <span><i class="bi bi-journal-text me-1"></i>{{ row.journal if row.get('journal') else row.publisher }}</span>
            {% endif %}
            {% if row.get('last_caller') %}
            <span title="Last accessed from {{ row.last_caller }}"><i class="bi bi-link-45deg me-1"></i>{{ row.last_caller|replace('http://', '')|replace('https://', '')|truncate(30) }}</span>
            {% endif %}
            <span class="ms-auto"><i class="bi bi-hash me-1"></i><code>{{ row.hash_display if row.hash_display else 'N/A' }}</code></span>
        </div>
    </div>
    {% endfor %}
</div>
{% else %}
<div class="dense-list">
    {% for _, row in results.iterrows() %}
    <div class="list-item {{ 'book-row' if row.is_book else '' }}">
        <span class="tag-container">
            <a href="{{ url_for('main.view', tag=row.tag) }}" class="tag text-decoration-none" target="_blank">{{ row.tag }}</a>
            {% if is_admin %}
            <a href="{{ url_for('main.editor_page') }}?tag={{ row.tag }}" class="ms-1 text-muted opacity-25 hover-opacity-100" title="Edit Tag">
                <i class="bi bi-pencil-square" style="font-size: 0.7rem;"></i>
            </a>
            {% endif %}
        </span>
        <span class="content-wrapper">
            <span class="year text-muted small fw-bold me-1">{{ row.year_display }}</span>
            <span class="title {{ 'fw-bold' if row.is_book else '' }}">"{{ row.title_display }}"</span>
            <span class="author text-muted small ms-1">{{ row.author_display }}</span>
            <span class="journal small ms-1"><i>{{ row.journal if 'journal' in row else (row.publisher if 'publisher' in row else '') }}</i></span>
        </span>
    </div>
    {% endfor %}
</div>
{% endif %}

<p class="muted" style="margin-top: 1rem; font-size: 0.8rem;">{{ results|length }} results found.</p>

{% else %}
<p class="muted">No results found matching your query.</p>
{% endif %}