{% if job and job.delta %}
{% set delta = job.delta %}
<section>
  <h2 class="text-sm font-semibold uppercase tracking-widest text-gray-500 mb-3">Delta Report</h2>
  <div class="bg-gray-900 border border-gray-800 rounded-xl p-5 space-y-4">

    <!-- Score delta -->
    {% if delta.score_delta is not none %}
    <div class="flex items-center gap-3">
      <span class="text-sm text-gray-400">Score change:</span>
      <span class="font-bold {% if delta.score_delta >= 0 %}text-green-400{% else %}text-red-400{% endif %}">
        {% if delta.score_delta >= 0 %}+{% endif %}{{ "%.1f"|format(delta.score_delta) }}
      </span>
    </div>
    {% endif %}

    <!-- New failures -->
    {% if delta.new_failures %}
    <div>
      <p class="text-xs font-semibold text-red-400 uppercase mb-2">New Failures ({{ delta.new_failures|length }})</p>
      <ul class="space-y-1">
        {% for rule_id in delta.new_failures %}
        <li class="text-xs font-mono text-red-300 bg-red-900/20 px-3 py-1 rounded">{{ rule_id }}</li>
        {% endfor %}
      </ul>
    </div>
    {% endif %}

    <!-- Fixed rules -->
    {% if delta.fixed %}
    <div>
      <p class="text-xs font-semibold text-green-400 uppercase mb-2">Fixed ({{ delta.fixed|length }})</p>
      <ul class="space-y-1">
        {% for rule_id in delta.fixed %}
        <li class="text-xs font-mono text-green-300 bg-green-900/20 px-3 py-1 rounded">{{ rule_id }}</li>
        {% endfor %}
      </ul>
    </div>
    {% endif %}

    <!-- Unchanged failures -->
    {% if delta.unchanged_failures %}
    <div>
      <p class="text-xs font-semibold text-yellow-400 uppercase mb-2">Persistent Failures ({{ delta.unchanged_failures|length }})</p>
      <ul class="space-y-1 max-h-40 overflow-y-auto">
        {% for rule_id in delta.unchanged_failures %}
        <li class="text-xs font-mono text-yellow-300 bg-yellow-900/20 px-3 py-1 rounded">{{ rule_id }}</li>
        {% endfor %}
      </ul>
    </div>
    {% endif %}

    {% if not delta.new_failures and not delta.fixed and not delta.unchanged_failures %}
    <p class="text-sm text-gray-500">No changes from baseline.</p>
    {% endif %}

  </div>
</section>
{% endif %}