@extends('layouts.app')
@section('title', 'গ্রাহক তালিকা')
@section('page-title', 'গ্রাহক ম্যানেজমেন্ট')

@section('content')

{{-- Summary Cards --}}
<div class="row g-3 mb-4">
    <div class="col-md-3">
        <div class="card stat-card h-100">
            <div class="card-body d-flex align-items-center gap-3">
                <div class="rounded-circle bg-primary bg-opacity-10 p-3">
                    <i class="bi bi-people-fill text-primary fs-4"></i>
                </div>
                <div>
                    <div class="text-muted small">মোট গ্রাহক</div>
                    <div class="fs-3 fw-bold">{{ $customers->total() }}</div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card stat-card h-100">
            <div class="card-body d-flex align-items-center gap-3">
                <div class="rounded-circle bg-warning bg-opacity-10 p-3">
                    <i class="bi bi-exclamation-circle-fill text-warning fs-4"></i>
                </div>
                <div>
                    <div class="text-muted small">মোট বকেয়া</div>
                    <div class="fs-3 fw-bold text-danger">৳{{ number_format($totalDue, 2) }}</div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card stat-card h-100">
            <div class="card-body d-flex align-items-center gap-3">
                <div class="rounded-circle bg-success bg-opacity-10 p-3">
                    <i class="bi bi-cash-stack text-success fs-4"></i>
                </div>
                <div>
                    <div class="text-muted small">মোট ডিপোজিট</div>
                    <div class="fs-3 fw-bold text-success">৳{{ number_format($totalDeposit, 2) }}</div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card stat-card h-100 border-start border-4 border-danger">
            <div class="card-body d-flex align-items-center gap-3">
                <div class="rounded-circle bg-danger bg-opacity-10 p-3">
                    <i class="bi bi-person-x-fill text-danger fs-4"></i>
                </div>
                <div>
                    <div class="text-muted small">বকেয়া গ্রাহক</div>
                    <div class="fs-3 fw-bold">{{ \App\Models\Customer::withDue()->count() }}</div>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- Filters & Table --}}
<div class="card stat-card">
    <div class="card-header bg-white border-0 pt-3 pb-0">
        <div class="d-flex justify-content-between align-items-center flex-wrap gap-2">
            <h6 class="fw-semibold mb-0">গ্রাহকের তালিকা</h6>
            <a href="{{ route($routePrefix . '.create') }}" class="btn btn-primary btn-sm">
                <i class="bi bi-person-plus me-1"></i>নতুন গ্রাহক
            </a>
        </div>

        {{-- Search & Filter --}}
        <form method="GET" action="{{ route($routePrefix . '.index') }}" class="row g-2 mt-2 mb-3">
            <div class="col-md-4">
                <input type="text" name="search" value="{{ request('search') }}"
                    class="form-control form-control-sm" placeholder="নাম, ফোন বা এলাকা খুঁজুন...">
            </div>
            <div class="col-md-2">
                <select name="type" class="form-select form-select-sm">
                    <option value="">সব ধরন</option>
                    <option value="regular" {{ request('type') === 'regular' ? 'selected' : '' }}>রেগুলার</option>
                    <option value="corporate" {{ request('type') === 'corporate' ? 'selected' : '' }}>কর্পোরেট</option>
                </select>
            </div>
            <div class="col-md-2">
                <select name="status" class="form-select form-select-sm">
                    <option value="">সব স্ট্যাটাস</option>
                    <option value="active" {{ request('status') === 'active' ? 'selected' : '' }}>সক্রিয়</option>
                    <option value="inactive" {{ request('status') === 'inactive' ? 'selected' : '' }}>নিষ্ক্রিয়</option>
                </select>
            </div>
            <div class="col-md-2">
                <select name="due" class="form-select form-select-sm">
                    <option value="">সব বকেয়া</option>
                    <option value="1" {{ request('due') ? 'selected' : '' }}>শুধু বকেয়া</option>
                </select>
            </div>
            <div class="col-md-2 d-flex gap-1">
                <button type="submit" class="btn btn-primary btn-sm flex-fill">
                    <i class="bi bi-search"></i>
                </button>
                <a href="{{ route($routePrefix . '.index') }}" class="btn btn-outline-secondary btn-sm flex-fill">
                    <i class="bi bi-x"></i>
                </a>
            </div>
        </form>
    </div>

    <div class="card-body p-0">
        <div class="table-responsive">
            <table class="table table-hover mb-0 align-middle">
                <thead class="table-light">
                    <tr>
                        <th>#</th>
                        <th>নাম</th>
                        <th>ফোন</th>
                        <th>এলাকা</th>
                        <th>ধরন</th>
                        <th>ডিপোজিট</th>
                        <th>বকেয়া</th>
                        <th>স্ট্যাটাস</th>
                        <th>একশন</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($customers as $customer)
                    <tr>
                        <td class="text-muted small">{{ $customers->firstItem() + $loop->index }}</td>
                        <td>
                            <div class="fw-semibold">{{ $customer->name }}</div>
                            @if($customer->company_name)
                                <small class="text-muted">{{ $customer->company_name }}</small>
                            @endif
                        </td>
                        <td>{{ $customer->phone }}</td>
                        <td>
                            {{ $customer->area ?? '—' }}
                            @if($customer->district)
                                <br><small class="text-muted">{{ $customer->district }}</small>
                            @endif
                        </td>
                        <td>
                            <span class="badge {{ $customer->type === 'corporate' ? 'bg-info' : 'bg-secondary' }}">
                                {{ $customer->type_label }}
                            </span>
                        </td>
                        <td class="text-success fw-semibold">৳{{ number_format($customer->deposit_amount, 2) }}</td>
                        <td>
                            @if($customer->due_balance > 0)
                                <span class="badge bg-danger rounded-pill">৳{{ number_format($customer->due_balance, 2) }}</span>
                            @else
                                <span class="text-muted">—</span>
                            @endif
                        </td>
                        <td>
                            <span class="badge {{ $customer->status === 'active' ? 'bg-success' : 'bg-secondary' }}">
                                {{ $customer->status_label }}
                            </span>
                        </td>
                        <td>
                            <div class="d-flex gap-1">
                                <a href="{{ route($routePrefix . '.show', $customer) }}"
                                    class="btn btn-sm btn-outline-info" title="বিস্তারিত">
                                    <i class="bi bi-eye"></i>
                                </a>
                                <a href="{{ route($routePrefix . '.edit', $customer) }}"
                                    class="btn btn-sm btn-outline-primary" title="সম্পাদনা">
                                    <i class="bi bi-pencil"></i>
                                </a>
                                @if(auth()->user()->hasRole('admin'))
                                <form method="POST" action="{{ route($routePrefix . '.destroy', $customer) }}"
                                      onsubmit="return confirm('এই গ্রাহক মুছে ফেলবেন?')">
                                    @csrf @method('DELETE')
                                    <button type="submit" class="btn btn-sm btn-outline-danger" title="মুছুন">
                                        <i class="bi bi-trash"></i>
                                    </button>
                                </form>
                                @endif
                            </div>
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="9" class="text-center text-muted py-5">
                            <i class="bi bi-people fs-1 d-block mb-2 opacity-25"></i>
                            কোনো গ্রাহক পাওয়া যায়নি।
                        </td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

    @if($customers->hasPages())
    <div class="card-footer bg-white border-0">
        {{ $customers->links() }}
    </div>
    @endif
</div>
@endsection