@extends('layouts.app')
@section('title', 'Rider Statement — ' . $rider->full_name)

@section('styles')
<style>
    @media print {
        .no-print { display: none !important; }
        body, .main-content { background: #fff !important; padding: 0 !important; margin: 0 !important; }
        .stmt-wrap { padding: 0 !important; box-shadow: none !important; border: none !important; }
        @page { size: A4 portrait; margin: 12mm 14mm; }
    }
    .stmt-wrap { background: #fff; max-width: 820px; margin: 0 auto; padding: 16mm 14mm; }
</style>
@endsection

@section('content')
<div class="px-4 py-4 lg:px-8">

    <div class="no-print flex items-center gap-3 mb-4">
        <a href="{{ route('corporate.referrals.riders.index') }}" class="btn-secondary text-xs">← Riders</a>
        <h2 class="text-base font-semibold text-gray-800">Rider Statement</h2>
        <button onclick="window.print()" class="btn-primary text-xs ml-auto">Print Statement</button>
    </div>

    {{-- Window picker --}}
    <form method="GET" class="no-print bg-white rounded-lg border border-gray-200 p-3 mb-3 flex flex-wrap gap-2 items-end">
        <div>
            <label class="text-xs text-gray-500 block mb-0.5">From</label>
            <input type="date" name="from" value="{{ $from->toDateString() }}" class="form-input text-sm">
        </div>
        <div>
            <label class="text-xs text-gray-500 block mb-0.5">To</label>
            <input type="date" name="to" value="{{ $to->toDateString() }}" class="form-input text-sm">
        </div>
        <button type="submit" class="btn-secondary text-xs">Apply</button>
    </form>

    <div class="stmt-wrap">

        @include('partials._document-header')

        <div style="margin: 10px 0 6px 0;">
            <h1 style="font-size:13pt; font-weight:bold; color:#3b1054; margin:0; text-transform:uppercase;">
                Rider Referral Statement
            </h1>
            <div style="font-size: 9pt; color: #555; margin-top: 2px;">
                Period: {{ $from->format('d M Y') }} – {{ $to->format('d M Y') }}
            </div>
        </div>

        <table style="width: 100%; font-size: 9.5pt; margin-bottom: 10px; border-collapse: collapse;">
            <tr>
                <td style="padding: 4px 0;"><strong>Rider:</strong> {{ $rider->full_name }} ({{ $rider->rider_code }})</td>
                <td style="padding: 4px 0;"><strong>Phone:</strong> {{ $rider->phone }}</td>
                <td style="padding: 4px 0;"><strong>M-Pesa:</strong> {{ $rider->mpesa_number }}</td>
            </tr>
            <tr>
                <td style="padding: 4px 0;"><strong>Scheme:</strong> {{ $rider->scheme?->name }}</td>
                <td style="padding: 4px 0;"><strong>Status:</strong> {{ $rider->status }}</td>
                <td style="padding: 4px 0;"><strong>Bike:</strong> {{ $rider->bike_registration ?? '—' }}</td>
            </tr>
        </table>

        {{-- Totals --}}
        <table style="width: 100%; border: 1px solid #d1d5db; border-collapse: collapse; margin-bottom: 12px;">
            <tr style="background: #f9fafb;">
                <td style="padding: 6px 10px; border-right: 1px solid #d1d5db; text-align: center;">
                    <div style="font-size: 7.5pt; color: #6b7280; text-transform: uppercase;">Total Referrals</div>
                    <div style="font-size: 13pt; font-weight: bold;">{{ $totals['all'] }}</div>
                </td>
                <td style="padding: 6px 10px; border-right: 1px solid #d1d5db; text-align: center;">
                    <div style="font-size: 7.5pt; color: #6b7280; text-transform: uppercase;">Successful</div>
                    <div style="font-size: 13pt; font-weight: bold; color: #15803d;">{{ $totals['successful'] }}</div>
                </td>
                <td style="padding: 6px 10px; border-right: 1px solid #d1d5db; text-align: center;">
                    <div style="font-size: 7.5pt; color: #6b7280; text-transform: uppercase;">Paid (KES)</div>
                    <div style="font-size: 13pt; font-weight: bold; color: #1e40af;">{{ number_format($totals['paid_kes']) }}</div>
                </td>
                <td style="padding: 6px 10px; text-align: center;">
                    <div style="font-size: 7.5pt; color: #6b7280; text-transform: uppercase;">Unpaid (KES)</div>
                    <div style="font-size: 13pt; font-weight: bold; color: #b91c1c;">{{ number_format($totals['unpaid_kes']) }}</div>
                </td>
            </tr>
        </table>

        {{-- Detail --}}
        <table style="width: 100%; font-size: 8.5pt; border-collapse: collapse;">
            <thead>
                <tr style="background: #f3f4f6;">
                    <th style="text-align: left; padding: 5px 6px; border-bottom: 1px solid #888;">Date</th>
                    <th style="text-align: left; padding: 5px 6px; border-bottom: 1px solid #888;">Patient</th>
                    <th style="text-align: left; padding: 5px 6px; border-bottom: 1px solid #888;">MRN</th>
                    <th style="text-align: right; padding: 5px 6px; border-bottom: 1px solid #888;">KES</th>
                    <th style="text-align: left; padding: 5px 6px; border-bottom: 1px solid #888;">Status</th>
                </tr>
            </thead>
            <tbody>
                @forelse($referrals as $ref)
                    <tr>
                        <td style="padding: 4px 6px; border-bottom: 1px solid #e5e7eb;">{{ $ref->referral_date->format('d M Y') }}</td>
                        <td style="padding: 4px 6px; border-bottom: 1px solid #e5e7eb;">{{ $ref->patient?->first_name }} {{ $ref->patient?->last_name }}</td>
                        <td style="padding: 4px 6px; border-bottom: 1px solid #e5e7eb; font-family: monospace; font-size: 8pt;">{{ $ref->patient?->mrn }}</td>
                        <td style="padding: 4px 6px; border-bottom: 1px solid #e5e7eb; text-align: right; font-family: monospace;">{{ number_format($ref->bounty_amount) }}</td>
                        <td style="padding: 4px 6px; border-bottom: 1px solid #e5e7eb;">{{ $ref->status }}</td>
                    </tr>
                @empty
                    <tr><td colspan="5" style="padding: 20px; text-align: center; color: #9ca3af;">No referrals in this period.</td></tr>
                @endforelse
            </tbody>
        </table>

        <div style="margin-top: 14px; padding-top: 8px; border-top: 1px solid #e5e7eb; font-size: 7.5pt; color: #6b7280;">
            Statement generated {{ now()->format('d M Y H:i') }}. For queries contact Clara Rosa Hospital, Utawala.
        </div>
    </div>
</div>
@endsection