{% set status_colors = {
    "active":      "bg-emerald-50 text-emerald-700 ring-emerald-600/20",
    "maintenance": "bg-amber-50 text-amber-700 ring-amber-600/20",
    "disabled":    "bg-red-50 text-red-700 ring-red-600/20",
    "env_gated":   "bg-blue-50 text-blue-700 ring-blue-600/20",
    "deprecated":  "bg-slate-100 text-slate-500 ring-slate-400/20"
} %}

<tr class="group hover:bg-slate-50/70 transition-colors">
    <td class="px-5 py-3 text-xs font-mono text-slate-400 whitespace-nowrap">
        {{ entry.timestamp.strftime("%Y-%m-%d") }}
        <span class="text-slate-300">·</span>
        {{ entry.timestamp.strftime("%H:%M:%S") }}
    </td>
    <td class="px-4 py-3" data-label="Route">
        <code class="text-xs font-mono text-slate-700">{{ entry.path }}</code>
    </td>
    <td class="px-4 py-3" data-label="Action">
        <span class="inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium bg-slate-100 text-slate-700 font-mono">
            {{ entry.action }}
        </span>
    </td>
    <td class="px-4 py-3 text-xs text-slate-500 hidden sm:table-cell" data-label="Actor">
        <div class="flex items-center gap-1">
            <svg class="w-3 h-3 text-slate-300 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"/>
            </svg>
            {{ entry.actor }}
        </div>
    </td>
    <td class="px-4 py-3 text-xs text-slate-500 hidden sm:table-cell" data-label="Via">
        {% if entry.platform == "cli" %}
        <span class="inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium bg-violet-50 text-violet-700 font-mono">cli</span>
        {% elif entry.platform == "dashboard" %}
        <span class="inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium bg-indigo-50 text-indigo-700 font-mono">dashboard</span>
        {% else %}
        <span class="inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium bg-slate-100 text-slate-500 font-mono">{{ entry.platform }}</span>
        {% endif %}
    </td>
    {% set rl_action_colors = {
        "rl_policy_set":     "bg-emerald-50 text-emerald-700 ring-emerald-600/20",
        "rl_policy_updated": "bg-amber-50 text-amber-700 ring-amber-600/20",
        "rl_reset":          "bg-sky-50 text-sky-700 ring-sky-600/20",
        "rl_policy_deleted": "bg-red-50 text-red-700 ring-red-600/20"
    } %}
    {% set rl_action_labels = {
        "rl_policy_set":     "set",
        "rl_policy_updated": "update",
        "rl_reset":          "reset",
        "rl_policy_deleted": "delete"
    } %}
    <td class="px-4 py-3" data-label="Change">
        {% if entry.action in rl_action_labels %}
        <span class="inline-flex items-center px-2 py-0.5 rounded-full text-[10px] font-semibold ring-1 ring-inset {{ rl_action_colors.get(entry.action, 'bg-slate-100 text-slate-500 ring-slate-400/20') }}">
            {{ rl_action_labels[entry.action] }}
        </span>
        {% elif entry.previous_status is not none and entry.new_status is not none %}
        <div class="flex items-center gap-1.5 flex-wrap">
            <span class="inline-flex items-center px-2 py-0.5 rounded-full text-[10px] font-medium ring-1 ring-inset {{ status_colors.get(entry.previous_status, 'bg-slate-100 text-slate-500 ring-slate-400/20') }}">
                {{ entry.previous_status }}
            </span>
            <svg class="w-3 h-3 text-slate-300 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                <path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5L21 12m0 0l-7.5 7.5M21 12H3"/>
            </svg>
            <span class="inline-flex items-center px-2 py-0.5 rounded-full text-[10px] font-medium ring-1 ring-inset {{ status_colors.get(entry.new_status, 'bg-slate-100 text-slate-500 ring-slate-400/20') }}">
                {{ entry.new_status }}
            </span>
        </div>
        {% else %}
        <span class="text-xs text-slate-400">—</span>
        {% endif %}
    </td>
    <td class="px-4 py-3 text-xs text-slate-500 max-w-xs hidden md:table-cell" data-label="Reason">
        <span class="truncate block" title="{{ entry.reason }}">{{ entry.reason or "—" }}</span>
    </td>
</tr>