@extends('layouts.app')
@section('title','Customers')
@section('content')
<div class="page-header">
    <div><div class="page-title">Customers</div><div class="page-subtitle">{{ $customers->total() }} customers</div></div>
    <div class="page-actions"><a href="{{ route('sales.customers.create') }}" class="btn btn-primary"><i class="fas fa-plus"></i> New Customer</a></div>
</div>
<div class="card mb-4" style="padding:16px;">
    <form method="GET" style="display:flex;gap:12px;align-items:center;">
        <input type="text" name="search" class="form-control" placeholder="Search by name, phone, email..." value="{{ request('search') }}" style="max-width:360px;">
        <button type="submit" class="btn btn-primary"><i class="fas fa-search"></i></button>
        @if(request('search'))<a href="{{ route('sales.customers.index') }}" class="btn btn-secondary">Clear</a>@endif
    </form>
</div>
<div class="card">
    <div class="table-wrapper">
        <table>
            <thead><tr><th>Code</th><th>Name</th><th>Contact</th><th>Phone</th><th>Credit Days</th><th class="text-right">Outstanding</th><th>Status</th><th class="text-center">Actions</th></tr></thead>
            <tbody>
                @forelse($customers as $c)
                <tr>
                    <td class="font-mono" style="font-size:12px;color:var(--text-muted);">{{ $c->code }}</td>
                    <td><a href="{{ route('sales.customers.show',$c) }}" style="font-weight:600;color:var(--text);text-decoration:none;">{{ $c->name }}</a></td>
                    <td style="font-size:12px;">{{ $c->contact_person ?? '—' }}</td>
                    <td style="font-size:12px;">{{ $c->phone ?? '—' }}</td>
                    <td>{{ $c->credit_days }} days</td>
                    <td class="text-right" style="color:var(--danger);font-weight:600;">৳{{ number_format($c->getOutstandingBalance(),2) }}</td>
                    <td><span class="badge badge-{{ $c->is_active?'success':'secondary' }}">{{ $c->is_active?'Active':'Inactive' }}</span></td>
                    <td class="text-center">
                        <div style="display:flex;gap:4px;justify-content:center;">
                            <a href="{{ route('sales.customers.show',$c) }}" class="btn btn-xs btn-secondary"><i class="fas fa-eye"></i></a>
                            <a href="{{ route('sales.customers.edit',$c) }}" class="btn btn-xs btn-secondary"><i class="fas fa-edit"></i></a>
                            <a href="{{ route('sales.invoices.create',['customer_id'=>$c->id]) }}" class="btn btn-xs btn-primary" title="New Invoice"><i class="fas fa-file-invoice"></i></a>
                        </div>
                    </td>
                </tr>
                @empty
                <tr><td colspan="8" class="text-center text-muted" style="padding:40px;">No customers found. <a href="{{ route('sales.customers.create') }}">Add your first customer</a></td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($customers->hasPages())
    <div class="card-footer" style="display:flex;justify-content:space-between;align-items:center;">
        <div style="font-size:13px;color:var(--text-muted);">Showing {{ $customers->firstItem() }}–{{ $customers->lastItem() }} of {{ $customers->total() }}</div>
        <div>{{ $customers->withQueryString()->links() }}</div>
    </div>
    @endif
</div>
@endsection