{% extends 'base.html' %}
{% block content %}
<h1 class="text-xl font-semibold mb-4">Projects for {{ case_email }}</h1>
<div class="bg-white shadow rounded-2xl overflow-hidden">
  <table class="min-w-full">
    <thead class="bg-slate-100 text-left text-sm">
      <tr>
        <th class="px-4 py-3">Project Email</th>
        <th class="px-4 py-3">Matter Description</th>
        <th class="px-4 py-3">Number</th>
        <th class="px-4 py-3">Incident Date</th>
        <th class="px-4 py-3">Name</th>
        <th class="px-4 py-3">Link</th>
      </tr>
    </thead>
    <tbody class="divide-y">
      {% for r in rows %}
      <tr class="hover:bg-slate-50">
        <td class="px-4 py-3 text-sm">{{ r.client or '—' }}</td>
        <td class="px-4 py-3 text-sm">{{ r.matter_description or '—' }}</td>
        <td class="px-4 py-3 text-sm">
          <ul>
            {% for c in r.contacts %}
            <li>{{ c.orgContact.firstName }}</li>
            {% endfor %}
          </ul>
        </td>
        <td class="px-4 py-3 text-sm">{{ r.Number or '—' }}</td>
        <td class="px-4 py-3 text-sm">{{ (r.IncidentDate or '')[:10] }}</td>
        <td class="px-4 py-3 text-sm">{{ r.ProjectName or '—' }}</td>
        <td class="px-4 py-3 text-sm">
          {% if r.projectUrl %}
          <a class="text-blue-600 hover:underline" href="{{ r.projectUrl }}" target="_blank">Open</a>
          {% else %}—{% endif %}
        </td>
      </tr>
      {% else %}
      <tr>
        <td colspan="5" class="px-4 py-6 text-center text-slate-500">No matching projects found.</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}