{% extends "admin_base.html" %}
{% block title %}Sponsors | Nexora Admin{% endblock %}
{% block content %}
<div class="admin-head">
  <p class="eyebrow">Partners</p>
  <h1>Sponsors &amp; Partners</h1>
  <p>Upload sponsor logos for the homepage slider. Transparent PNG logos work best.</p>
</div>

{% if can('sponsors_create') %}
<section class="admin-panel">
  <h2><i class="fas fa-plus"></i> Add Sponsor</h2>
  <form class="admin-form sponsor-admin-form" method="post" enctype="multipart/form-data">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <label>Company Name<input name="name" placeholder="e.g. Dawlance" required></label>
    <label>Website <span class="field-hint">(optional)</span><input name="website" placeholder="https://example.com"></label>
    <label>Logo <span class="field-hint">(transparent PNG best)</span><input type="file" name="logo"
        accept="image/*"></label>
    <label class="check"><input type="checkbox" name="active" checked> Show on website</label>
    <button class="btn primary" type="submit"><i class="fas fa-plus"></i> Add Sponsor</button>
  </form>
</section>
{% endif %}

<section class="admin-panel">
  <h2><i class="fas fa-handshake"></i> Current Sponsors</h2>
  {% if sponsors %}
  <div class="admin-card-grid">
    {% for sponsor in sponsors %}
    <article class="mini-admin-card">
      {% set sp_img = img(sponsor.logo) if sponsor.logo else '' %}
      {% if sp_img %}
      <img class="thumb contain" src="{{ url_for('serve_media', filename=sp_img) }}"
        alt="{{ sponsor.name }}">
      {% endif %}
      <strong>{{ sponsor.name }}</strong>
      {% if sponsor.website %}
      <a class="link-out" href="{{ sponsor.website }}" target="_blank" rel="noopener"><i
          class="fas fa-arrow-up-right-from-square"></i> Visit site</a>
      {% endif %}
      <span class="badge {{ 'paid' if sponsor.active else 'unpaid' }}" style="margin-top:8px;">
        {{ 'Visible' if sponsor.active else 'Hidden' }}</span>
      {% if can('sponsors_update') or can('sponsors_delete') %}
      <div style="display:flex; gap:8px; margin-top:12px; flex-wrap:wrap;">
        <button class="btn outline small" type="button" data-toggle-edit><i class="fas fa-pen"></i> Edit</button>
        <form method="post" action="{{ url_for('toggle_sponsor', sponsor_id=sponsor.id) }}">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button class="danger-link" type="submit" style="color:var(--brand);"><i class="fas fa-eye"></i>
            {{ 'Hide' if sponsor.active else 'Show' }}</button>
        </form>
        <form method="post" action="{{ url_for('delete_sponsor', sponsor_id=sponsor.id) }}"
          data-confirm="Delete {{ sponsor.name }}?">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button class="danger-link" type="submit"><i class="fas fa-trash"></i> Delete</button>
        </form>
      </div>

      <form method="post" action="{{ url_for('edit_sponsor', sponsor_id=sponsor.id) }}"
        enctype="multipart/form-data" class="admin-inline-edit" hidden>
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <label>Name<input name="name" value="{{ sponsor.name }}" required></label>
        <label>Website <span class="field-hint">(optional)</span>
          <input name="website" value="{{ sponsor.website }}" placeholder="https://example.com"></label>
        <label>Replace Logo <span class="field-hint">(optional — keeps current if blank)</span>
          <input type="file" name="logo" accept="image/*"></label>
        <label class="check"><input type="checkbox" name="active" {% if sponsor.active %}checked{% endif %}> Show on
          website</label>
        <button class="btn primary small" type="submit"><i class="fas fa-floppy-disk"></i> Save Changes</button>
      </form>
      {% endif %}
    </article>
    {% endfor %}
  </div>
  {% else %}
  <div class="empty"><i class="fas fa-handshake"></i>No sponsors have been added yet. The homepage sponsor section appears after you add one.</div>
  {% endif %}
</section>
{% endblock %}