{% if error %}
<div class="bg-red-900/50 border border-red-700 rounded-lg p-4 text-red-200 text-sm">
    Import failed: {{ error }}
</div>
{% else %}
<div class="bg-green-900/50 border border-green-700 rounded-lg p-4 text-green-200 text-sm">
    Imported {{ imported_count }} key(s) from <span class="font-mono">{{ filename }}</span>.
    <a href="/dashboard/inventory/keys" class="ml-2 text-green-300 hover:text-green-100 underline">View keys</a>
</div>

{% if verification %}
<div class="bg-gray-800 rounded-xl border border-gray-700 p-4 mt-4">
    <h3 class="text-white font-medium mb-3">Verification Summary</h3>
    <div class="grid md:grid-cols-3 gap-4 mb-4">
        <div>
            <p class="text-xs text-gray-400 uppercase">Total</p>
            <p class="text-xl text-white font-bold">{{ verification.total }}</p>
        </div>
        <div>
            <p class="text-xs text-gray-400 uppercase">Routable</p>
            <p class="text-xl text-green-400 font-bold">{{ verification.routable }}</p>
        </div>
        <div>
            <p class="text-xs text-gray-400 uppercase">Encryption</p>
            <p class="text-sm text-gray-300">
                {{ verification.encryption.encrypted }} encrypted,
                {{ verification.encryption.plaintext }} plaintext
            </p>
        </div>
    </div>
    {% if verification.by_status %}
    <div class="text-sm text-gray-300">
        <p class="text-gray-400 mb-1">By status:</p>
        <ul class="list-disc list-inside space-y-1">
            {% for status, count in verification.by_status.items() %}
            <li>{{ status }}: {{ count }}</li>
            {% endfor %}
        </ul>
    </div>
    {% endif %}
</div>
{% endif %}
{% endif %}