{% extends "_layout.html" %}
{% block content %}
<section class="card">
    <div class="px-4 py-3 border-b border-soft flex items-center justify-between">
        <h2 class="font-semibold">System-Log</h2>
        <span class="text-xs text-slate-500">{{ events|length }} Einträge (max 300, letzte 14 Tage)</span>
    </div>
    <div class="divide-y divide-soft">
        {% for e in events %}
        <div class="px-4 py-2 mono flex items-start gap-3 flex-wrap">
            <span class="text-slate-500 shrink-0">{{ e.ts|de_dt }}</span>
            {% if e.kind == 'error' %}
                <span class="chip chip-bad">{{ e.source }}</span>
            {% else %}
                <span class="chip chip-info">{{ e.source }}</span>
            {% endif %}
            <span class="text-slate-700">{{ e.action }}</span>
            {% if e.user %}<span class="text-slate-500">user={{ e.user }}</span>{% endif %}
            {% if e.details %}<span class="text-slate-500">— {{ e.details }}</span>{% endif %}
            {% if e.ip %}<span class="text-slate-400">[{{ e.ip }}]</span>{% endif %}
        </div>
        {% else %}
        <div class="px-4 py-8 text-center text-slate-500">Keine Einträge.</div>
        {% endfor %}
    </div>
</section>
{% endblock %}