{% extends "admin/base_admin.html" %}
{% set admin_page = "outreach" %}
{% block title %}Import Suppliers - Outreach - Admin - {{ config.APP_NAME }}{% endblock %}

{% block admin_content %}
  <header class="mb-6">
    <a href="{{ url_for('admin.outreach') }}" class="text-sm text-slate">&larr; Outreach Pipeline</a>
    <h1 class="text-2xl mt-1">Import Suppliers from CSV</h1>
  </header>

  <div style="max-width:600px">
    <div class="card" style="padding:1.5rem">
      <p class="text-sm text-slate mb-4">
        Upload a CSV file to create supplier prospects in bulk.
        Rows with a <code>contact_email</code> that already exists in the database are skipped (dedup).
        Max {{ 500 }} rows per upload.
      </p>

      <div class="mb-4" style="background:#F0F9FF;border:1px solid #BAE6FD;border-radius:6px;padding:0.875rem 1rem;">
        <p class="text-xs font-semibold mb-1">Required columns</p>
        <code class="text-xs">name, contact_email</code>
        <p class="text-xs font-semibold mt-2 mb-1">Optional columns</p>
        <code class="text-xs">country_code, category, website</code>
      </div>

      <form method="post" enctype="multipart/form-data" action="{{ url_for('admin.outreach_import') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

        <div class="mb-4">
          <label class="text-xs font-semibold text-slate block mb-1">CSV file</label>
          <input type="file" name="csv_file" accept=".csv,text/csv" class="form-input" required>
        </div>

        <div class="flex gap-2">
          <button type="submit" class="btn">Import</button>
          <a href="{{ url_for('admin.outreach') }}" class="btn-outline">Cancel</a>
        </div>
      </form>
    </div>
  </div>
{% endblock %}
