@extends('layouts.admin')

@section('title', __('admin.payment_proofs.title'))

@section('content')
<div class="container-fluid px-4 py-4">
    <h1 class="display-md text-white mb-4">{{ __('admin.payment_proofs.title') }}</h1>

    @if (session('status'))
        <div class="alert alert-success">{{ session('status') }}</div>
    @endif

    @forelse($registrations as $registration)
        @php($proof = $registration->paymentProofs->sortByDesc('id')->first())
        <div class="card-arena p-4 mb-3">
            <div class="d-flex flex-wrap justify-content-between gap-2 mb-2">
                <div>
                    <div class="text-white fw-600">{{ $registration->event->title }}</div>
                    <div class="text-muted fs-sm">{{ $registration->user->display_name }} · {{ $registration->contact_email }}</div>
                </div>
                @if($proof)
                    <a href="{{ route('payment-proofs.show', $proof) }}" class="btn-arena btn-sm btn-ghost">{{ __('admin.payment_proofs.view_proof') }}</a>
                @endif
            </div>

            @if($proof)
                <form method="POST" action="{{ route('admin.payment-proofs.confirm', $proof) }}" class="d-inline">
                    @csrf
                    <button class="btn-arena btn-sm btn-primary">{{ __('admin.actions.confirm') }}</button>
                </form>
                <form method="POST" action="{{ route('admin.payment-proofs.reject', $proof) }}" class="d-inline-flex gap-2 ms-2">
                    @csrf
                    <input type="text" name="rejection_reason" class="form-control form-control-sm" placeholder="{{ __('admin.payment_proofs.rejection_reason') }}" required>
                    <button class="btn-arena btn-sm btn-outline-light">{{ __('admin.actions.reject') }}</button>
                </form>
            @endif
        </div>
    @empty
        <div class="card-arena p-4 text-muted">{{ __('admin.empty.no_proofs') }}</div>
    @endforelse

    <div class="mt-3">{{ $registrations->links() }}</div>
</div>
@endsection
