{% if extensions %}
<div style="display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:12px 16px">
    {% for e in extensions %}
    {% if show_all or e.is_installed %}
    <div style="padding:8px 10px;background:var(--surface-2);border-radius:6px;display:flex;justify-content:space-between;align-items:center;font-size:12.5px">
        <span style="display:flex;align-items:center;gap:6px;min-width:0">
            <i data-lucide="puzzle" style="width:12px;height:12px;color:var(--brand);flex-shrink:0"></i>
            <span style="font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">{{ e.name }}</span>
            {% if e.is_installed %}
                <span class="chip chip-green">v{{ e.installed_version }}</span>
            {% else %}
                <span class="chip chip-neutral">v{{ e.default_version }}</span>
            {% endif %}
        </span>
        {% if e.is_installed %}
        <button hx-post="/api/admin/{{ conn_id }}/extensions/{{ e.name }}/uninstall"
                hx-target="#extensions-list" hx-swap="innerHTML"
                hx-confirm="Uninstall extension {{ e.name }}?"
                class="btn btn-sm btn-ghost" style="color:var(--red);flex-shrink:0">Uninstall</button>
        {% else %}
        <button hx-post="/api/admin/{{ conn_id }}/extensions/{{ e.name }}/install"
                hx-target="#extensions-list" hx-swap="innerHTML"
                class="btn btn-sm btn-ghost" style="color:var(--green);flex-shrink:0">Install</button>
        {% endif %}
    </div>
    {% endif %}
    {% endfor %}
</div>
{% else %}
<div style="padding:14px;color:var(--fg-3)">No extensions found</div>
{% endif %}