{# Code diff component (vendored from packages/web/src/governor_web/templates/components/code_diff.html).
   Expects: diff_lines (list of dicts with 'type' and 'content'),
            file_path (str, optional)
#}
{% if file_path %}
<div class="flex items-center gap-2 mb-2">
  <span class="text-xs font-mono text-slate-600 dark:text-slate-400">{{ file_path }}</span>
</div>
{% endif %}
<div class="border border-slate-200 dark:border-slate-800 rounded-sm overflow-hidden font-mono text-sm">
  {% for line in diff_lines %}
    {% if line.type == 'hunk' %}
      <div class="px-3 py-1 bg-slate-100 dark:bg-slate-800 text-slate-500 dark:text-slate-400 text-xs">{{ line.content }}</div>
    {% elif line.type == 'add' %}
      <div class="px-3 py-0.5 bg-green-50 dark:bg-green-950/30 text-green-800 dark:text-green-300">
        <span class="select-none text-green-600 dark:text-green-400 mr-2">+</span>{{ line.content }}
      </div>
    {% elif line.type == 'delete' %}
      <div class="px-3 py-0.5 bg-red-50 dark:bg-red-950/30 text-red-800 dark:text-red-300">
        <span class="select-none text-red-500 dark:text-red-400 mr-2">-</span>{{ line.content }}
      </div>
    {% else %}
      <div class="px-3 py-0.5 text-slate-700 dark:text-slate-300">
        <span class="select-none text-slate-400 dark:text-slate-600 mr-2">&nbsp;</span>{{ line.content }}
      </div>
    {% endif %}
  {% endfor %}
</div>