@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">

            <div class="container-fluid">
                <div class="page-title">
                    <div class="row">
                        <div class="col-sm-6 ps-0"><h3>Booking #{{ $booking->id }}</h3></div>
                        <div class="col-sm-6 pe-0">
                            <ol class="bc">
                                <li><a href="/admin/broker/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 Dashboard</a></li>
                                <li class="bc-sep">›</li>
                                <li class="bc-active">#{{ $booking->id }}</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>

            <div class="container-fluid">
                <div class="row">

                    <div class="col-lg-8">

                        {{-- Unit --}}
                        <div class="card shadow-sm mb-3">
                            <div class="card-header"><h6 class="mb-0"><i class="fas fa-building mr-2"></i>Unit Details</h6></div>
                            <div class="card-body">
                                <div class="row">
                                    @foreach([
                                        ['Unit No', $booking->plot_number],
                                        ['Type',    $booking->plot_type],
                                        ['Block',   $booking->block->block_name],
                                        ['Area',    $booking->area],
                                        ['Price',   $booking->price],
                                        ['Status',  $booking->status],
                                    ] as [$l, $v])
                                        <div class="col-4 mb-3">
                                            <div style="font-size:11px;color:#888;text-transform:uppercase">{{ $l }}</div>
                                            <div style="font-weight:600">{{ $v ?: '—' }}</div>
                                        </div>
                                    @endforeach
                                </div>
                                @if($booking->paymentPlan)
                                    <div class="alert alert-info py-2 mb-0" style="font-size:13px">
                                        <i class="fas fa-file-invoice-dollar mr-1"></i>
                                        Plan: <strong>{{ $booking->paymentPlan->name }}</strong>
                                        @if($booking->total_amount)
                                            · Total: <strong>₹{{ number_format($booking->total_amount,2) }}</strong>
                                        @endif
                                    </div>
                                @endif
                            </div>
                        </div>

                        {{-- Client --}}
                        <div class="card shadow-sm mb-3">
                            <div class="card-header"><h6 class="mb-0"><i class="fas fa-user mr-2"></i>Client Details</h6></div>
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-4 mb-2">
                                        <div style="font-size:11px;color:#888">Name</div>
                                        <div style="font-weight:600">{{ $booking->client_name ?: $booking->name }}</div>
                                    </div>
                                    <div class="col-md-4 mb-2">
                                        <div style="font-size:11px;color:#888">Phone</div>
                                        <div style="font-weight:600">{{ $booking->client_phone ?: $booking->phone }}</div>
                                    </div>
                                    @if($booking->client_email)
                                        <div class="col-md-4 mb-2">
                                            <div style="font-size:11px;color:#888">Email</div>
                                            <div>{{ $booking->client_email }}</div>
                                        </div>
                                    @endif
                                </div>
                                @if($booking->notes)
                                    <div class="mt-2 p-2" style="background:#f8f9fa;border-radius:6px;font-size:13px">
                                        <strong>Notes:</strong> {{ $booking->notes }}
                                    </div>
                                @endif
                            </div>
                        </div>

                    </div>

                    <div class="col-lg-4">

                        {{-- Booking status --}}
                        <div class="card shadow-sm mb-3">
                            <div class="card-header"><h6 class="mb-0">Booking Status</h6></div>
                            <div class="card-body">
                                {!! $booking->bookingStatusBadge() !!}
                                <div class="text-muted mt-2" style="font-size:12px">
                                    Submitted on {{ $booking->created_at->format('d M Y, h:i A') }}
                                </div>
                            </div>
                        </div>

                        {{-- Commission --}}
                        <div class="card shadow-sm" style="border-left:4px solid #c9a96e">
                            <div class="card-header" style="background:linear-gradient(135deg,#1a2535,#2a3a50)">
                                <h6 class="mb-0 text-white"><i class="fas fa-coins mr-2" style="color:#c9a96e"></i>Your Commission</h6>
                            </div>
                            <div class="card-body">
                                <div class="row mb-3">
                                    <div class="col-6">
                                        <div style="font-size:11px;color:#888">Rate</div>
                                        <div style="font-size:24px;font-weight:800;color:#c9a96e">{{ $booking->commission_rate }}%</div>
                                    </div>
                                    <div class="col-6">
                                        <div style="font-size:11px;color:#888">Amount</div>
                                        <div style="font-size:24px;font-weight:800">₹{{ number_format($booking->commission_amount,2) }}</div>
                                    </div>
                                </div>
                                <div class="mb-2">
                                    Status: {!! $booking->commissionStatusBadge() !!}
                                </div>
                                @if($booking->commission_paid_at)
                                    <div class="text-muted" style="font-size:12px">
                                        <i class="fas fa-check-circle text-success mr-1"></i>
                                        Paid on {{ $booking->commission_paid_at->format('d M Y') }}
                                    </div>
                                @elseif($booking->commission_status === 'approved')
                                    <div class="text-muted" style="font-size:12px">
                                        <i class="fas fa-info-circle mr-1"></i>
                                        Approved — payment will be processed soon.
                                    </div>
                                @elseif($booking->commission_status === 'pending')
                                    <div class="text-muted" style="font-size:12px">
                                        <i class="fas fa-clock mr-1"></i>
                                        Awaiting admin review.
                                    </div>
                                @endif
                            </div>
                        </div>

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

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

@include('Partials.footer')