{% set status_styles = {
  'prospect':       'background:#E2E8F0;color:#475569',
  'contacted':      'background:#DBEAFE;color:#1E40AF',
  'replied':        'background:#D1FAE5;color:#065F46',
  'signed_up':      'background:#A7F3D0;color:#065F46',
  'declined':       'background:#FEE2E2;color:#991B1B',
  'not_interested': 'background:#F1F5F9;color:#64748B',
} %}
<tr id="outreach-row-{{ s.id }}">
  <td>
    <a href="{{ url_for('admin.supplier_detail', supplier_id=s.id) }}" class="text-sm font-semibold">{{ s.name }}</a>
    {% if s.contact_email %}<br><span class="text-xs text-slate">{{ s.contact_email }}</span>{% endif %}
  </td>
  <td class="text-sm">{{ s.country_code or '-' }}</td>
  <td>
    {# Inline status dropdown via HTMX #}
    <form hx-post="{{ url_for('admin.outreach_status', supplier_id=s.id) }}"
          hx-target="#outreach-row-{{ s.id }}"
          hx-swap="outerHTML"
          class="m-0">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <select name="outreach_status" class="form-input" style="font-size:0.75rem;padding:2px 6px;min-width:120px"
              onchange="this.form.requestSubmit()">
        {% for st in ['prospect','contacted','replied','signed_up','declined','not_interested'] %}
        <option value="{{ st }}" {% if st == s.outreach_status %}selected{% endif %}>{{ st | replace('_',' ') | title }}</option>
        {% endfor %}
      </select>
    </form>
  </td>
  <td class="text-sm text-center">{{ s.outreach_sequence_step or 0 }}</td>
  <td class="text-sm mono">
    {% if s.last_contacted_at %}
      {{ s.last_contacted_at[:10] }}
    {% else %}
      —
    {% endif %}
  </td>
  <td>
    {# Follow-up date picker — submits on change, row swaps via HTMX #}
    <form hx-post="{{ url_for('admin.outreach_follow_up', supplier_id=s.id) }}"
          hx-target="#outreach-row-{{ s.id }}"
          hx-swap="outerHTML"
          class="m-0">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <input type="date" name="follow_up_at"
             value="{{ s.follow_up_at or '' }}"
             class="form-input"
             style="font-size:0.75rem;padding:2px 6px"
             onchange="this.form.requestSubmit()">
    </form>
  </td>
  <td style="max-width:160px">
    {# Inline note edit #}
    <form hx-post="{{ url_for('admin.outreach_note', supplier_id=s.id) }}"
          hx-target="#note-{{ s.id }}"
          hx-swap="innerHTML"
          class="m-0">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <input type="text" name="note"
             value="{{ s.outreach_notes or '' }}"
             placeholder="Add note…"
             class="form-input"
             style="font-size:0.75rem;padding:2px 6px;width:100%"
             hx-trigger="change"
             hx-post="{{ url_for('admin.outreach_note', supplier_id=s.id) }}"
             hx-target="#note-{{ s.id }}"
             hx-swap="innerHTML"
             hx-include="this">
      <span id="note-{{ s.id }}" class="text-xs text-slate">
        {% if s.outreach_notes %}{{ s.outreach_notes[:60] }}{% if s.outreach_notes|length > 60 %}…{% endif %}{% endif %}
      </span>
    </form>
  </td>
  <td>
    {% if s.contact_email %}
    {% set compose_url = url_for('admin.email_compose') ~ '?to=' ~ s.contact_email ~ '&from_key=outreach&email_type=outreach&supplier_id=' ~ s.id %}
    <a href="{{ compose_url }}" class="btn-outline btn-sm" title="Compose outreach email" style="font-size:0.75rem;padding:2px 8px">✉ Send</a>
    {% endif %}
  </td>
</tr>
