@extends('admin.layouts.master')
@section('title', 'ملف العميل')

@section('css')
<style>
    .cust-profile-hero {
        background: linear-gradient(135deg, #1b2f55 0%, #1a5276 50%, #0d7377 100%);
        border-radius: 16px; color: #fff; padding: 24px;
    }
    .fin-card { border-radius: 12px; border: 1px solid #edf0f4; }
    .stat-num { font-size: 1.5rem; font-weight: 700; }
    .progress { height: 8px; border-radius: 4px; }
    .tx-invoice td { background: #f8fffe; }
    .tx-payment td { background: #f0fff4; }
    .tx-opening td { background: #fff8e1; }
</style>
@endsection

@section('content')
<div class="pc-container"><div class="pc-content">

    {{-- Hero Profile Header --}}
    <div class="cust-profile-hero mb-3">
        <div class="d-flex flex-wrap justify-content-between align-items-center gap-3">
            <div>
                <div class="d-flex align-items-center gap-3">
                    <div class="bg-white bg-opacity-25 rounded-circle d-flex align-items-center justify-content-center"
                         style="width:54px;height:54px;font-size:22px;font-weight:700;color:#fff;">
                        {{ mb_substr($customer->name_ar, 0, 1) }}
                    </div>
                    <div>
                        <h4 class="mb-0 text-white">{{ $customer->name_ar }}</h4>
                        <div class="mt-1 d-flex flex-wrap gap-2">
                            <code class="bg-white bg-opacity-25 text-white px-2 py-1 rounded small">{{ $customer->code }}</code>
                            <span class="badge bg-white text-dark">{{ $customer->type_name }}</span>
                            <span class="badge {{ match($customer->customer_type) { 'retail'=>'bg-primary','half_wholesale'=>'bg-warning text-dark','wholesale'=>'bg-success', default=>'bg-secondary' } }}">
                                {{ $customer->customer_type_name }}
                            </span>
                            @if($customer->is_active)
                                <span class="badge bg-success">نشط</span>
                            @else
                                <span class="badge bg-secondary">غير نشط</span>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
            <div class="d-flex gap-2">
                @can('customers.update')
                <a href="{{ route('admin.customers.edit', $customer) }}" class="btn btn-light">
                    <i class="ti ti-edit me-1"></i>تعديل
                </a>
                @endcan
                <a href="{{ route('admin.customers.index') }}" class="btn btn-outline-light">
                    <i class="ti ti-arrow-right me-1"></i>رجوع
                </a>
            </div>
        </div>
    </div>

    {{-- Financial KPIs --}}
    <div class="row g-3 mb-3">
        <div class="col-md-3">
            <div class="fin-card p-3 h-100">
                <div class="text-muted small">إجمالي الفواتير</div>
                <div class="stat-num text-primary">{{ number_format($totalInvoices, 2) }} <small class="fs-6">ج.م</small></div>
                <div class="text-muted small mt-1">{{ $invoiceStats['count'] }} فاتورة</div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="fin-card p-3 h-100">
                <div class="text-muted small">إجمالي التحصيل</div>
                <div class="stat-num text-success">{{ number_format($totalCollected, 2) }} <small class="fs-6">ج.م</small></div>
                <div class="text-muted small mt-1">{{ $customer->customerPayments->count() }} عملية</div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="fin-card p-3 h-100">
                <div class="text-muted small">الرصيد المستحق</div>
                <div class="stat-num {{ $currentBalance > 0 ? 'text-danger' : 'text-success' }}">
                    {{ number_format($currentBalance, 2) }} <small class="fs-6">ج.م</small>
                </div>
                <div class="small mt-1 {{ $currentBalance > 0 ? 'text-danger' : 'text-success' }}">
                    {{ $currentBalance > 0 ? 'مديونية على العميل' : 'لا توجد مديونية' }}
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="fin-card p-3 h-100">
                <div class="text-muted small">استخدام الحد الائتماني</div>
                <div class="stat-num">{{ $creditUsedPct }}%</div>
                <div class="progress mt-2">
                    <div class="progress-bar {{ $creditUsedPct > 80 ? 'bg-danger' : ($creditUsedPct > 50 ? 'bg-warning' : 'bg-success') }}"
                         style="width:{{ $creditUsedPct }}%"></div>
                </div>
                <div class="text-muted small mt-1">من {{ number_format($creditLimit, 2) }} ج.م</div>
            </div>
        </div>
    </div>

    {{-- Invoice Status Row --}}
    <div class="row g-3 mb-3">
        <div class="col-md-3">
            <div class="fin-card p-3 text-center h-100">
                <div class="text-muted small">فواتير مكتملة</div>
                <div class="fw-bold fs-4 text-success">{{ $invoiceStats['paid'] }}</div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="fin-card p-3 text-center h-100">
                <div class="text-muted small">مدفوعة جزئياً</div>
                <div class="fw-bold fs-4 text-warning">{{ $invoiceStats['partially_paid'] }}</div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="fin-card p-3 text-center h-100">
                <div class="text-muted small">فواتير معلقة</div>
                <div class="fw-bold fs-4 text-primary">{{ $invoiceStats['pending'] }}</div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="fin-card p-3 text-center h-100">
                <div class="text-muted small">إجمالي الفواتير</div>
                <div class="fw-bold fs-4">{{ $invoiceStats['count'] }}</div>
            </div>
        </div>
    </div>

    <div class="row g-3 mb-3">
        {{-- Customer Info --}}
        <div class="col-lg-6">
            <div class="card h-100">
                <div class="card-header"><h6 class="mb-0"><i class="ti ti-id-badge me-1 text-primary"></i>بيانات العميل</h6></div>
                <div class="card-body">
                    <div class="row g-2 small">
                        <div class="col-6"><span class="text-muted">جهة الاتصال:</span><br><strong>{{ $customer->contact_person_ar ?: '-' }}</strong></div>
                        <div class="col-6"><span class="text-muted">الموبايل:</span><br><strong>{{ $customer->phone ?: '-' }}</strong></div>
                        <div class="col-6"><span class="text-muted">رقم إضافي:</span><br>{{ $customer->alternative_phone ?: '-' }}</div>
                        <div class="col-6"><span class="text-muted">البريد الإلكتروني:</span><br>{{ $customer->email ?: '-' }}</div>
                        <div class="col-6"><span class="text-muted">الرقم الضريبي:</span><br>{{ $customer->tax_number ?: '-' }}</div>
                        <div class="col-6"><span class="text-muted">السجل التجاري:</span><br>{{ $customer->commercial_register ?: '-' }}</div>
                        <div class="col-6"><span class="text-muted">المدينة:</span><br>{{ $customer->city_ar ?: '-' }}</div>
                        <div class="col-6"><span class="text-muted">الحد الائتماني:</span><br><strong>{{ number_format((float)$customer->credit_limit, 2) }} ج.م</strong></div>
                        @if($customer->address_ar)
                            <div class="col-12"><span class="text-muted">العنوان:</span><br>{{ $customer->address_ar }}</div>
                        @endif
                        @if($customer->notes_ar)
                            <div class="col-12"><span class="text-muted">ملاحظات:</span><br>{{ $customer->notes_ar }}</div>
                        @endif
                    </div>
                </div>
            </div>
        </div>

        {{-- Recent Invoices --}}
        <div class="col-lg-6">
            <div class="card h-100">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h6 class="mb-0"><i class="ti ti-receipt me-1 text-info"></i>آخر الفواتير</h6>
                    @if($customer->salesInvoices->count() > 5)
                        <small class="text-muted">أحدث 5</small>
                    @endif
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-sm mb-0">
                            <thead><tr><th>رقم الفاتورة</th><th>التاريخ</th><th>الإجمالي</th><th>الحالة</th></tr></thead>
                            <tbody>
                                @forelse($recentInvoices as $inv)
                                <tr>
                                    <td><a href="{{ route('admin.sales_invoices.show', $inv) }}" class="text-primary fw-semibold">{{ $inv->invoice_number }}</a></td>
                                    <td class="text-nowrap">{{ $inv->invoice_date?->format('Y-m-d') }}</td>
                                    <td>{{ number_format((float)$inv->grand_total, 2) }}</td>
                                    <td>{!! $inv->status_badge !!}</td>
                                </tr>
                                @empty
                                <tr><td colspan="4" class="text-muted text-center py-3">لا توجد فواتير.</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Account Statement --}}
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h5 class="mb-0"><i class="ti ti-report-money me-1"></i>كشف الحساب</h5>
            <small class="text-muted">مرتب تصاعدياً بالتاريخ</small>
        </div>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-bordered mb-0">
                    <thead class="table-dark">
                        <tr>
                            <th>التاريخ</th>
                            <th>البيان</th>
                            <th>المرجع</th>
                            <th class="text-end">مدين</th>
                            <th class="text-end">دائن</th>
                            <th class="text-end">الرصيد</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($statement as $row)
                        <tr class="tx-{{ $row['type'] }}">
                            <td class="text-nowrap">{{ $row['date'] }}</td>
                            <td>{{ $row['description'] }}</td>
                            <td>
                                @if($row['type'] === 'invoice')
                                    <span class="badge bg-light-info text-info">{{ $row['reference'] }}</span>
                                @elseif($row['type'] === 'payment')
                                    <span class="badge bg-light-success text-success">{{ $row['reference'] }}</span>
                                @else
                                    {{ $row['reference'] }}
                                @endif
                            </td>
                            <td class="text-end">{{ $row['debit'] > 0 ? number_format($row['debit'], 2) : '-' }}</td>
                            <td class="text-end">{{ $row['credit'] > 0 ? number_format($row['credit'], 2) : '-' }}</td>
                            <td class="text-end fw-bold {{ $row['balance'] > 0 ? 'text-danger' : 'text-success' }}">
                                {{ number_format($row['balance'], 2) }}
                            </td>
                        </tr>
                        @empty
                        <tr><td colspan="6" class="text-center text-muted py-4">لا توجد حركات مسجلة.</td></tr>
                        @endforelse
                    </tbody>
                    @if($statement->isNotEmpty())
                    <tfoot class="table-light fw-bold">
                        <tr>
                            <td colspan="3" class="text-end">الإجمالي</td>
                            <td class="text-end">{{ number_format($statement->sum('debit'), 2) }}</td>
                            <td class="text-end">{{ number_format($statement->sum('credit'), 2) }}</td>
                            <td class="text-end {{ $currentBalance > 0 ? 'text-danger' : 'text-success' }}">
                                {{ number_format($currentBalance, 2) }}
                            </td>
                        </tr>
                    </tfoot>
                    @endif
                </table>
            </div>
        </div>
    </div>

</div></div>
@endsection