@extends('layouts.master')

@section('title', 'Mijn boetes')

@section('content')
<div class="container py-4">
    <h1 class="mb-4">Mijn boetes</h1>

    @if($fines->isEmpty())
        <p class="text-muted">Je hebt geen boetes.</p>
    @else
        <div class="table-responsive">
            <table class="table table-sm align-middle">
                <thead>
                    <tr>
                        <th>Omschrijving</th>
                        <th>Bedrag</th>
                        <th>Status</th>
                        <th>Betalen</th>
                    </tr>
                </thead>
                <tbody>
                @foreach($fines as $fine)
                    <tr>
                        <td>{{ $fine->fineType?->description ?? '-' }}</td>
                        <td>
                            @php $amount = $fine->fineType?->amount; @endphp
                            {{ $amount !== null ? '€'.number_format($amount, 2, ',', '.') : '-' }}
                        </td>
                        <td>{!! $fine->paid ? '✅ Betaald' : '❌ Open' !!}</td>
                        <td>
                            @php $url = $fine->fineType?->paymentLink?->url; @endphp
                            @if(!$fine->paid && $url)
                                <a class="btn btn-sm btn-success" href="{{ $url }}" target="_blank" rel="noopener">Betalen</a>
                            @else
                                <span class="text-muted">-</span>
                            @endif
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    @endif
</div>
@endsection