@extends('layouts.admin', ['heading' => 'Network Tools', 'subheading' => 'Spillover, placement, and leg-balance monitoring'])

@section('content')
    <div class="mb-4 grid grid-cols-1 gap-4 md:grid-cols-3">
        <div class="admin-card p-4">
            <div class="text-xs text-slate-500">Total Users</div>
            <div class="mt-1 text-2xl font-semibold">{{ number_format((int) $stats['total_users']) }}</div>
        </div>
        <div class="admin-card p-4">
            <div class="text-xs text-slate-500">Spillover Users</div>
            <div class="mt-1 text-2xl font-semibold text-amber-600">{{ number_format((int) $stats['spillover_count']) }}</div>
        </div>
        <div class="admin-card p-4">
            <div class="text-xs text-slate-500">Parents with 2 Filled Legs</div>
            <div class="mt-1 text-2xl font-semibold text-indigo-600">{{ number_format((int) $stats['two_leg_filled']) }}</div>
        </div>
    </div>

    <form method="GET" class="mb-4 admin-card p-4">
        <div class="flex flex-wrap gap-2">
            <input name="q" value="{{ $search }}" placeholder="Search member for spillover filters" class="w-full rounded border p-2 md:w-96">
            <button class="rounded bg-slate-900 px-4 py-2 text-white">Apply</button>
            <a href="{{ route('admin.tree') }}" class="rounded border border-slate-300 px-4 py-2 text-slate-700">Open Tree Manager</a>
        </div>
    </form>

    <div class="grid grid-cols-1 gap-4 xl:grid-cols-2">
        <div class="admin-card p-4">
            <div class="mb-2 text-sm font-semibold">Spillover Tracking</div>
            <div class="overflow-x-auto">
                <table class="min-w-full text-sm">
                    <thead class="bg-slate-100 text-left">
                        <tr>
                            <th class="p-2">Member</th>
                            <th class="p-2">Sponsor</th>
                            <th class="p-2">Placement Parent</th>
                            <th class="p-2">Leg</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($spilloverUsers as $row)
                            <tr class="border-t">
                                <td class="p-2">{{ $row->member_code }} - {{ $row->name }}</td>
                                <td class="p-2">{{ $row->sponsor_id }}</td>
                                <td class="p-2">{{ $row->placement_parent_id }}</td>
                                <td class="p-2">{{ strtoupper((string) $row->placement_leg) }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="4" class="p-3 text-center text-slate-500">No spillover rows found.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="admin-card p-4">
            <div class="mb-2 text-sm font-semibold">Leg Balance Monitoring</div>
            <div class="overflow-x-auto">
                <table class="min-w-full text-sm">
                    <thead class="bg-slate-100 text-left">
                        <tr>
                            <th class="p-2">Member</th>
                            <th class="p-2">Left Units</th>
                            <th class="p-2">Right Units</th>
                            <th class="p-2">Gap</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($legBalanceRows as $row)
                            @php
                                $user = $balanceUsers->get($row->beneficiary_user_id);
                                $gap = abs((float) $row->left_units - (float) $row->right_units);
                            @endphp
                            <tr class="border-t">
                                <td class="p-2">{{ $user?->member_code ?? $row->beneficiary_user_id }} - {{ $user?->name }}</td>
                                <td class="p-2">{{ number_format((float) $row->left_units, 4) }}</td>
                                <td class="p-2">{{ number_format((float) $row->right_units, 4) }}</td>
                                <td class="p-2 text-rose-600">{{ number_format($gap, 4) }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="4" class="p-3 text-center text-slate-500">No leg data available.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection