@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-hand-holding-usd mr-2" style="color:#c9a96e"></i>My Bookings</h3>
                            <p class="text-muted mb-0" style="font-size:13px">All bookings you have closed</p>
                        </div>
                        <div class="col-sm-6 pe-0">
                            <ol class="bc">
                                <li><a href="{{ route('broker.dashboard') }}" class="bc-home"><i class="fas fa-home"></i></a></li>
                                <li class="bc-sep">›</li>
                                <li class="bc-active">My Bookings</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>

            {{-- ── No linked account warning ── --}}
            @if(!empty($no_frontend_account))
            <div class="container-fluid mb-3">
                <div class="alert alert-warning d-flex align-items-center" style="gap:12px;">
                    <i class="fas fa-exclamation-triangle fa-2x" style="color:#c9a96e;flex-shrink:0;"></i>
                    <div>
                        <strong>No bookings linked yet.</strong><br>
                        <span style="font-size:13px;">
                            Register on the frontend using the same email
                            (<strong>{{ $admin->email }}</strong>) and select the
                            <strong>Broker</strong> role. Bookings you make will then appear here automatically.
                        </span>
                    </div>
                </div>
            </div>
            @endif

            {{-- ── 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;">
                            <select name="status" class="form-control form-control-sm" style="width:150px;">
                                <option value="">All Statuses</option>
                                <option value="confirmed" {{ request('status')==='confirmed'?'selected':'' }}>Confirmed</option>
                                <option value="pending"   {{ request('status')==='pending'  ?'selected':'' }}>Pending</option>
                                <option value="cancelled" {{ request('status')==='cancelled'?'selected':'' }}>Cancelled</option>
                            </select>
                            <input type="text" name="search" class="form-control form-control-sm"
                                   placeholder="Client name, unit, phone..."
                                   value="{{ request('search') }}" style="width:220px;">
                            <button class="btn btn-primary btn-sm">
                                <i class="fas fa-filter mr-1"></i>Filter
                            </button>
                            <a href="{{ route('broker.bookings') }}" class="btn btn-outline-secondary btn-sm">
                                <i class="fas fa-times"></i>
                            </a>
                            <span class="text-muted ml-auto" style="font-size:12px;">
                                {{ $bookings instanceof \Illuminate\Pagination\LengthAwarePaginator ? $bookings->total() : (is_countable($bookings) ? count($bookings) : 0) }} booking(s)
                            </span>
                        </form>
                    </div>
                </div>
            </div>

            {{-- ── Bookings Table ── --}}
            <div class="container-fluid">
                <div class="card shadow-sm" style="border-top:3px solid #c9a96e;">
                    <div class="card-header d-flex justify-content-between align-items-center"
                         style="background:linear-gradient(135deg,#1a1a2e,#16213e);">
                        <h6 class="mb-0 text-white">
                            <i class="fas fa-bookmark mr-2" style="color:#c9a96e;"></i>All My Bookings
                        </h6>
                        <a href="{{ route('broker.dashboard') }}" class="btn btn-sm btn-outline-light" style="font-size:11px;">
                            <i class="fas fa-chart-pie mr-1"></i>Dashboard
                        </a>
                    </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>Unit</th>
                                        <th>Client</th>
                                        <th>Deal Value</th>
                                        <th>Commission</th>
                                        <th>Comm. Status</th>
                                        <th>Booking Status</th>
                                        <th>Date</th>
                                        <th class="text-center">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($bookings as $i => $b)
                                    @php
                                        $csColors = ['pending'=>'#f59e0b','approved'=>'#3b82f6','paid'=>'#22c55e','rejected'=>'#ef4444'];
                                        $bsColors = ['confirmed'=>'#22c55e','pending'=>'#f59e0b','cancelled'=>'#ef4444'];
                                        $cc = $csColors[$b->commission_status ?? ''] ?? '#94a3b8';
                                        $bc = $bsColors[$b->booking_status ?? ''] ?? '#94a3b8';
                                        $blockLabel = is_object($b->block) ? ($b->block->block_name ?? '—') : ($b->block ?? '—');
                                    @endphp
                                    <tr>
                                        <td class="text-muted align-middle">{{ $b->id }}</td>
                                        <td class="align-middle">
                                            <div style="font-weight:700;">Unit {{ $b->plot_number ?? '—' }}</div>
                                            <div style="font-size:11px;color:#94a3b8;">
                                                {{ $b->plot_type ?? '' }}
                                                @if($blockLabel && $blockLabel !== '—') · {{ $blockLabel }} @endif
                                            </div>
                                        </td>
                                        <td class="align-middle">
                                            <div style="font-weight:600;">{{ $b->client_name ?: ($b->name ?? '—') }}</div>
                                            <div style="font-size:11px;color:#94a3b8;">{{ $b->client_phone ?: ($b->phone ?? '') }}</div>
                                            @if($b->client_email)
                                            <div style="font-size:11px;color:#94a3b8;">{{ $b->client_email }}</div>
                                            @endif
                                        </td>
                                        <td class="align-middle" style="font-weight:700;color:#22c55e;">
                                            {{ $currency }}{{ $b->total_amount ?? $b->price ?? 0 }}
                                        </td>
                                        <td class="align-middle">
                                            @if($b->commission_amount)
                                                <div style="font-weight:700;color:#c9a96e;">
                                                    {{ $currency }}{{$b->commission_amount }}
                                                </div>
                                                @if($b->commission_rate)
                                                <div style="font-size:11px;color:#94a3b8;">{{ $b->commission_rate }}%</div>
                                                @endif
                                            @else
                                                <span style="color:#94a3b8;">—</span>
                                            @endif
                                        </td>
                                        <td class="align-middle">
                                            <span style="background:{{ $cc }}22;color:{{ $cc }};
                                                         padding:3px 10px;border-radius:10px;font-size:11px;font-weight:600;">
                                                {{ ucfirst($b->commission_status ?? 'N/A') }}
                                            </span>
                                            @if($b->commission_status === 'paid' && isset($b->commission_paid_at))
                                            <div style="font-size:10px;color:#94a3b8;margin-top:2px;">
                                                {{ \Carbon\Carbon::parse($b->commission_paid_at)->format('d M Y') }}
                                            </div>
                                            @endif
                                        </td>
                                        <td class="align-middle">
                                            <span style="background:{{ $bc }}22;color:{{ $bc }};
                                                         padding:3px 10px;border-radius:10px;font-size:11px;font-weight:600;">
                                                {{ ucfirst($b->booking_status ?? '—') }}
                                            </span>
                                        </td>
                                        <td class="align-middle" style="font-size:12px;color:#94a3b8;white-space:nowrap;">
                                            {{ \Carbon\Carbon::parse($b->created_at)->format('d M Y') }}<br>
                                            <span style="font-size:10px;">{{ \Carbon\Carbon::parse($b->created_at)->format('H:i') }}</span>
                                        </td>
                                        <td class="align-middle text-center">
                                            <a href="{{ route('broker.bookings.show', $b->id) }}"
                                               class="btn btn-sm btn-outline-primary" title="View Details">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                        </td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="9" class="text-center py-5 text-muted">
                                            <i class="fas fa-hand-holding-usd fa-3x d-block mb-3 text-light"></i>
                                            @if(request('search') || request('status'))
                                                No bookings match your filters.
                                                <a href="{{ route('broker.bookings') }}" class="d-block mt-2" style="font-size:13px;">Clear filters</a>
                                            @else
                                                No bookings yet. Book a unit from the property listing.
                                            @endif
                                        </td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                    @if($bookings instanceof \Illuminate\Pagination\LengthAwarePaginator && $bookings->hasPages())
                    <div class="card-footer">
                        {{ $bookings->links() }}
                    </div>
                    @endif
                </div>
            </div>

        </div>
    </div>
</section>

@include('Partials.footer')