@include('Partials.sidebar')
<section class="main_content dashboard_part large_header_bg">
@include('Partials.header')
<div class="main_content_iner default_main_contaner_iner">
<div class="page-body">

    {{-- ── Page Title ── --}}
    <div class="container-fluid">
        <div class="page-title">
            <div class="row align-items-center">
                <div class="col-sm-6 ps-0">
                    <h3><i class="fas fa-money-bill-wave mr-2" style="color:#c9a96e"></i>My Payments</h3>
                    <p class="text-muted mb-0" style="font-size:13px">Payments received for your bookings — {{ $broker->name }}</p>
                </div>
                <div class="col-sm-6 pe-0">
                    <ol class="bc">
                        <li><a href="/project/dashboard" class="bc-home"><i class="fas fa-home"></i></a></li>
                        <li class="bc-sep">›</li>
                        <li><a href="{{ route('broker.dashboard') }}" class="bc-link">My Bookings</a></li>
                        <li class="bc-sep">›</li>
                        <li class="bc-active">My Payments</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>

    {{-- ── No linked account warning ── --}}
    @if($no_frontend_account)
    <div class="container-fluid mb-3">
        <div class="alert alert-warning d-flex align-items-center gap-2">
            <i class="fas fa-exclamation-triangle fa-lg"></i>
            <div>
                <strong>Account not linked.</strong>
                Your broker admin account is not linked to a frontend user account.
                Please register on the frontend using the same email address (<strong>{{ $broker->email }}</strong>) to see your payment history.
            </div>
        </div>
    </div>
    @endif

    {{-- ── KPI Cards ── --}}
    <div class="container-fluid mb-4">
        <div class="row">
            @foreach([
                ['Total Received',      $currency.$stats['total_received'],    '#22c55e', 'fa-coins'],
                ['Successful Payments', $stats['total_count'],                                   '#3b82f6', 'fa-check-circle'],
                ['Pending',             $stats['pending_count'],                                 '#f59e0b', 'fa-clock'],
                ['Failed',              $stats['failed_count'],                                  '#ef4444', 'fa-times-circle'],
                ['Online Payments',     $currency.$stats['online_amount'],     '#8b5cf6', 'fa-globe'],
                ['Cash Payments',       $currency.$stats['cash_amount'],       '#10b981', 'fa-money-bill'],
                ['Commission Earned',   $currency.$stats['commission_paid'],   '#c9a96e', 'fa-percentage'],
                ['Commission Pending',  $currency.$stats['commission_pending'],'#f59e0b', 'fa-wallet'],
            ] as [$label, $val, $color, $icon])
            <div class="col-xl-3 col-md-4 col-sm-6 mb-3">
                <div class="card shadow-sm h-100" style="border-top:3px solid {{ $color }};border-radius:10px;">
                    <div class="card-body py-3 px-3">
                        <div class="d-flex align-items-center justify-content-between">
                            <div>
                                <div style="font-size:20px;font-weight:800;color:{{ $color }};">{{ $val }}</div>
                                <div style="font-size:11px;color:#94a3b8;margin-top:2px;">
                                    <i class="fas {{ $icon }} mr-1"></i>{{ $label }}
                                </div>
                            </div>
                            <div style="width:42px;height:42px;border-radius:50%;background:{{ $color }}18;
                                        display:flex;align-items:center;justify-content:center;flex-shrink:0;">
                                <i class="fas {{ $icon }}" style="color:{{ $color }};font-size:17px;"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @endforeach
        </div>
    </div>

    {{-- ── Filters ── --}}
    <div class="container-fluid mb-3">
        <div class="card shadow-sm">
            <div class="card-body py-2">
                <form method="GET" class="d-flex flex-wrap align-items-center" style="gap:8px;">
                    {{-- Period --}}
                    @foreach([
                        'all'          => 'All Time',
                        'this_month'   => 'This Month',
                        'last_month'   => 'Last Month',
                        'this_quarter' => 'This Quarter',
                        'this_year'    => 'This Year',
                    ] as $val => $label)
                    <a href="?period={{ $val }}"
                       class="btn btn-sm {{ $period === $val ? 'btn-warning' : 'btn-outline-secondary' }}"
                       style="{{ $period === $val ? 'color:#fff;font-weight:700;' : '' }}">
                        {{ $label }}
                    </a>
                    @endforeach

                    <div class="ml-auto d-flex" style="gap:8px;">
                        <select name="status" class="form-control form-control-sm" style="width:130px;">
                            <option value="">All Statuses</option>
                            <option value="success"  {{ request('status')==='success'  ?'selected':'' }}>Success</option>
                            <option value="pending"  {{ request('status')==='pending'  ?'selected':'' }}>Pending</option>
                            <option value="failed"   {{ request('status')==='failed'   ?'selected':'' }}>Failed</option>
                            <option value="refunded" {{ request('status')==='refunded' ?'selected':'' }}>Refunded</option>
                        </select>
                        <select name="gateway" class="form-control form-control-sm" style="width:130px;">
                            <option value="">All Gateways</option>
                            <option value="razorpay" {{ request('gateway')==='razorpay'?'selected':'' }}>Razorpay</option>
                            <option value="stripe"   {{ request('gateway')==='stripe'  ?'selected':'' }}>Stripe</option>
                            <option value="phonepe"  {{ request('gateway')==='phonepe' ?'selected':'' }}>PhonePe</option>
                            <option value="cash"     {{ request('gateway')==='cash'    ?'selected':'' }}>Cash</option>
                            <option value="manual"   {{ request('gateway')==='manual'  ?'selected':'' }}>Manual</option>
                        </select>
                        <input type="text" name="search" class="form-control form-control-sm"
                               placeholder="Client, unit, payment ID..."
                               value="{{ request('search') }}" style="width:200px;">
                        <button class="btn btn-primary btn-sm"><i class="fas fa-filter mr-1"></i>Filter</button>
                        <a href="/admin/payments" class="btn btn-outline-secondary btn-sm"><i class="fas fa-times"></i></a>
                    </div>
                </form>
            </div>
        </div>
    </div>

    {{-- ── Tabs ── --}}
    <div class="container-fluid">
        <ul class="nav nav-tabs mb-3" id="paymentTabs">
            <li class="nav-item">
                <a class="nav-link active" data-toggle="tab" href="#tab-transactions">
                    <i class="fas fa-receipt mr-1"></i> Payment Transactions
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" data-toggle="tab" href="#tab-commission">
                    <i class="fas fa-percentage mr-1"></i> Commission Summary
                </a>
            </li>
        </ul>

        <div class="tab-content">

            {{-- ── Tab 1: Transactions ── --}}
            <div class="tab-pane fade show active" id="tab-transactions">
                <div class="card shadow-sm" style="border-top:3px solid #22c55e;">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h6 class="mb-0">
                            <i class="fas fa-receipt mr-2" style="color:#22c55e;"></i>
                            Payment Transactions
                            <span class="badge badge-success ml-2">{{ $transactions->total() }}</span>
                        </h6>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-hover mb-0" style="font-size:13px;">
                                <thead class="thead-light">
                                    <tr>
                                        <th>#</th>
                                        <th>Client</th>
                                        <th>Unit</th>
                                        <th>Amount</th>
                                        <th>Gateway</th>
                                        <th>Mode</th>
                                        <th>Status</th>
                                        <th>Payment ID</th>
                                        <th>Date</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($transactions as $i => $tx)
                                    @php
                                        $statusColors = ['success'=>'#22c55e','pending'=>'#f59e0b','failed'=>'#ef4444','refunded'=>'#8b5cf6'];
                                        $sc = $statusColors[$tx->status] ?? '#94a3b8';
                                        $modeIcons = ['online'=>'fa-globe','cash'=>'fa-money-bill','manual'=>'fa-edit'];
                                        $mi = $modeIcons[$tx->mode ?? ''] ?? 'fa-credit-card';
                                    @endphp
                                    <tr>
                                        <td class="text-muted">{{ $transactions->firstItem() + $i }}</td>
                                        <td>
                                            <div style="font-weight:700;">{{ $tx->booking->client_name ?? '—' }}</div>
                                            <div style="font-size:11px;color:#94a3b8;">{{ $tx->booking->client_phone ?? '' }}</div>
                                        </td>
                                        <td><strong>Unit {{ $tx->booking->plot_number ?? '—' }}</strong></td>
                                        <td style="font-weight:800;color:#22c55e;">
                                            {{ $currency }}{{ $tx->amount }}
                                        </td>
                                        <td>
                                            <span class="badge badge-secondary" style="font-size:11px;">
                                                {{ ucfirst($tx->gateway) }}
                                            </span>
                                        </td>
                                        <td>
                                            <i class="fas {{ $mi }} mr-1" style="color:#94a3b8;"></i>
                                            {{ ucfirst($tx->mode ?? '—') }}
                                        </td>
                                        <td>
                                            <span style="background:{{ $sc }}22;color:{{ $sc }};
                                                         padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;">
                                                {{ ucfirst($tx->status) }}
                                            </span>
                                        </td>
                                        <td style="font-size:11px;color:#94a3b8;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">
                                            {{ $tx->gateway_payment_id ?? '—' }}
                                        </td>
                                        <td style="font-size:12px;color:#94a3b8;white-space:nowrap;">
                                            {{ $tx->paid_at ? \Carbon\Carbon::parse($tx->paid_at)->format('d M Y') : \Carbon\Carbon::parse($tx->created_at)->format('d M Y') }}
                                            <br>
                                            <span style="font-size:10px;">
                                                {{ $tx->paid_at ? \Carbon\Carbon::parse($tx->paid_at)->format('H:i') : '' }}
                                            </span>
                                        </td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="9" class="text-center py-5 text-muted">
                                            <i class="fas fa-receipt fa-3x d-block mb-3 text-light"></i>
                                            No payment transactions found.
                                        </td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                    @if($transactions->hasPages())
                    <div class="card-footer">{{ $transactions->links() }}</div>
                    @endif
                </div>
            </div>

            {{-- ── Tab 2: Commission Summary ── --}}
            <div class="tab-pane fade" id="tab-commission">
                <div class="card shadow-sm" style="border-top:3px solid #c9a96e;">
                    <div class="card-header">
                        <h6 class="mb-0">
                            <i class="fas fa-percentage mr-2" style="color:#c9a96e;"></i>
                            Commission per Booking
                        </h6>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-hover mb-0" style="font-size:13px;">
                                <thead class="thead-light">
                                    <tr>
                                        <th>#</th>
                                        <th>Client</th>
                                        <th>Unit</th>
                                        <th>Deal Value</th>
                                        <th>Rate</th>
                                        <th>Commission</th>
                                        <th>Booking Status</th>
                                        <th>Commission Status</th>
                                        <th>Date</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php $totalComm = 0; $totalDeal = 0; @endphp
                                    @forelse($bookingSummary as $i => $b)
                                    @php
                                        $csColors = ['paid'=>'#22c55e','pending'=>'#f59e0b','approved'=>'#3b82f6'];
                                        $bsColors = ['confirmed'=>'#22c55e','pending'=>'#f59e0b','cancelled'=>'#ef4444'];
                                        $cc = $csColors[$b->commission_status ?? ''] ?? '#94a3b8';
                                        $bc = $bsColors[$b->booking_status ?? ''] ?? '#94a3b8';
                                        $totalComm += (float)($b->commission_amount ?? 0);
                                        $totalDeal += (float)($b->total_amount ?? 0);
                                    @endphp
                                    <tr>
                                        <td class="text-muted">{{ $i + 1 }}</td>
                                        <td>
                                            <div style="font-weight:700;">{{ $b->client_name ?? '—' }}</div>
                                            <div style="font-size:11px;color:#94a3b8;">{{ $b->client_phone ?? '' }}</div>
                                        </td>
                                        <td><strong>Unit {{ $b->plot_number ?? '—' }}</strong><br>
                                            <small style="color:#94a3b8;">{{ $b->plot_type ?? '' }}</small>
                                        </td>
                                        <td style="font-weight:700;">
                                            {{ $currency }}{{ $b->total_amount ?? 0 }}
                                        </td>
                                        <td>
                                            @if($b->commission_rate)
                                                <span style="background:#fff8ee;color:#c9a96e;padding:2px 8px;border-radius:8px;font-weight:700;">
                                                    {{ $b->commission_rate }}%
                                                </span>
                                            @else
                                                <span style="color:#94a3b8;">—</span>
                                            @endif
                                        </td>
                                        <td style="font-weight:800;color:#c9a96e;">
                                            {{ $b->commission_amount ? $currency.$b->commission_amount : '—' }}
                                        </td>
                                        <td>
                                            <span style="background:{{ $bc }}22;color:{{ $bc }};
                                                         padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;">
                                                {{ ucfirst($b->booking_status ?? '—') }}
                                            </span>
                                        </td>
                                        <td>
                                            <span style="background:{{ $cc }}22;color:{{ $cc }};
                                                         padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;">
                                                {{ ucfirst($b->commission_status ?? 'Unpaid') }}
                                            </span>
                                        </td>
                                        <td style="font-size:12px;color:#94a3b8;white-space:nowrap;">
                                            {{ \Carbon\Carbon::parse($b->created_at)->format('d M Y') }}
                                        </td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="9" class="text-center py-5 text-muted">
                                            <i class="fas fa-percentage fa-3x d-block mb-3 text-light"></i>
                                            No bookings found.
                                        </td>
                                    </tr>
                                    @endforelse
                                </tbody>
                                @if($bookingSummary->count() > 0)
                                <tfoot class="thead-light">
                                    <tr>
                                        <th colspan="3" class="text-right">Totals</th>
                                        <th style="color:#3b82f6;">{{ $currency }}{{ $totalDeal }}</th>
                                        <th>—</th>
                                        <th style="color:#c9a96e;">{{ $currency }}{{ $totalComm }}</th>
                                        <th colspan="3"></th>
                                    </tr>
                                </tfoot>
                                @endif
                            </table>
                        </div>
                    </div>
                </div>
            </div>

        </div>{{-- end tab-content --}}
    </div>

</div>
</div>
</section>
@include('Partials.footer')