{% for r in records %}
<tr class="{{ 'bg-red-50' if r.level == 'ERROR' else ('bg-amber-50' if r.level == 'WARNING' else '') }}">
  <td class="text-xs text-gray-400 font-mono whitespace-nowrap">{{ r.timestamp }}</td>
  <td>
    <span class="text-xs font-semibold {{ 'text-red-600' if r.level == 'ERROR' else ('text-amber-600' if r.level == 'WARNING' else 'text-gray-500') }}">
      {{ r.level }}
    </span>
  </td>
  <td class="text-xs text-gray-500 font-mono truncate max-w-xs" title="{{ r.logger }}">{{ r.logger }}</td>
  <td class="text-xs font-mono text-gray-700">{{ r.message }}</td>
</tr>
{% else %}
<tr>
  <td colspan="4" class="text-center text-gray-400 py-8">
    No log records{% if level or q %} matching filters{% endif %}.
  </td>
</tr>
{% endfor %}