{% extends "admin_base.html" %}
{% block title %}Payment Proof | Nexora Admin{% endblock %}
{% block content %}
<div class="admin-head">
  <p class="eyebrow">Payment Proof</p>
  <h1>NX-{{ '%04d' % row.id }} — {{ row.full_name }}</h1>
  <p>{{ row.game_title }} · {{ row.entry_type | title }} · {{ row.created_at | pretty_dt }}</p>
</div>

<section class="admin-panel proof-view-panel">
  <div class="proof-view-grid">
    <div class="proof-image-frame">
      {% if row.proof_image %}
      <img src="{{ url_for('serve_proof_image', reg_id=row.id) }}" alt="Payment proof for {{ row.full_name }}">
      {% else %}
      <div class="empty"><i class="fas fa-image"></i>No payment screenshot attached.</div>
      {% endif %}
    </div>

    <aside class="proof-details">
      <span class="badge {{ row.payment_status }}">{{ row.payment_status }}</span>
      <h2>{{ row.full_name }}</h2>
      <p>{{ row.email }}<br>{{ row.phone }}</p>
      <div class="bar-list">
        <div class="bar-row"><span>Game</span><strong>{{ row.game_title }}</strong></div>
        <div class="bar-row"><span>Platform</span><strong>{{ row.platform }}</strong></div>
        <div class="bar-row"><span>Entry</span><strong>{{ row.entry_type | title }}</strong></div>
        <div class="bar-row"><span>Team</span><strong>{{ row.team_name or 'Individual' }}</strong></div>
      </div>
      <div class="proof-actions">
        <a class="btn primary small" href="{{ url_for('registration_ticket_pdf', reg_id=row.id) }}"><i
            class="fas fa-ticket"></i> Ticket PDF</a>
        <a class="btn outline small" href="{{ url_for('admin_registrations') }}"><i class="fas fa-arrow-left"></i>
          Back</a>
        <form method="post" action="{{ url_for('delete_registration', reg_id=row.id) }}"
          data-confirm="Delete registration of {{ row.full_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>
    </aside>
  </div>
</section>
{% endblock %}