<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Registrations Report</title>
    <style>
        body { font-family: Arial, sans-serif; font-size: 10px; margin: 0; padding: 20px; }
        .header { text-align: center; margin-bottom: 20px; border-bottom: 2px solid #2d3748; padding-bottom: 12px; }
        h1 { font-size: 16px; margin: 8px 0 2px; }
        .subtitle { color: #666; font-size: 11px; margin: 0; }
        table.data { width: 100%; border-collapse: collapse; margin-top: 12px; }
        table.data th, table.data td { border: 1px solid #333; padding: 4px 6px; text-align: left; }
        table.data th { background-color: #2d3748; color: #fff; font-weight: bold; }
        table.data tr:nth-child(even) { background-color: #f7fafc; }
        .badge { padding: 2px 6px; border-radius: 3px; font-size: 9px; font-weight: bold; color: #fff; }
        .badge-pending { background: #d69e2e; }
        .badge-verified { background: #38a169; }
        .badge-rejected { background: #e53e3e; }
        .footer { text-align: center; margin-top: 16px; font-size: 9px; color: #999; }
    </style>
</head>
<body>
    <div class="header" style="position: relative; padding-bottom: 12px; border-bottom: 2px solid #2d3748; margin-bottom: 20px; min-height: 70px;">
        <div style="position: absolute; left: 0; top: 0;">
            <img src="{{ public_path('images/uin-logo.png') }}" height="55">
            <img src="{{ public_path('images/teflin-logo.png') }}" height="55">
        </div>
        <div style="text-align: center; padding-top: 5px;">
            <h1>Registrations Report</h1>
            <p class="subtitle">TEFLIN International Conference</p>
            <p class="subtitle">Generated: {{ now()->format('d M Y, H:i') }}</p>
        </div>
    </div>

    <table class="data">
        <thead>
            <tr>
                <th>No</th>
                <th>Code</th>
                <th>Name</th>
                <th>Email</th>
                <th>Institution</th>
                <th>Category</th>
                <th>Amount</th>
                <th>Payment</th>
                <th>Created</th>
            </tr>
        </thead>
        <tbody>
            @foreach($registrations as $i => $registration)
            <tr>
                <td>{{ $i + 1 }}</td>
                <td>{{ $registration->registration_code }}</td>
                <td>{{ $registration->name }}</td>
                <td>{{ $registration->email }}</td>
                <td>{{ $registration->institution }}</td>
                <td>{{ ucfirst(str_replace('_', ' ', $registration->category)) }}</td>
                <td>{{ number_format($registration->amount, 0, ',', '.') }}</td>
                <td><span class="badge badge-{{ $registration->payment_status }}">{{ ucfirst($registration->payment_status) }}</span></td>
                <td>{{ $registration->created_at?->format('d/m/Y') }}</td>
            </tr>
            @endforeach
        </tbody>
    </table>

    <p class="footer">Total: {{ $registrations->count() }} registrations</p>
</body>
</html>
