@extends('layouts.vendor')

@section('title', 'Customer Management')
@section('header_title', 'Customer Management')

@section('content')
    <div class="card">
        <div style="display: flex; justify-content: space-between; align-items: center;">
            <div>
                <h3><i class="fa-solid fa-users" style="color: var(--primary);"></i> Store Customers</h3>
                <p style="color: var(--text-muted); margin-top: 0.35rem;">Customers appear here after an order is linked to their account.</p>
            </div>
            <a href="{{ route('vendor.orders') }}" class="btn btn-primary"><i class="fa-solid fa-plus"></i> Create Order</a>
        </div>
        <table>
            <thead><tr><th>Customer</th><th>Contact</th><th>Orders</th><th>Total Purchases</th><th>Status</th></tr></thead>
            <tbody>
                @forelse($customers as $customer)
                    <tr>
                        <td><strong>{{ $customer->name }}</strong><div style="color: var(--text-muted); font-size: 0.8rem;">Joined {{ $customer->created_at->format('d M Y') }}</div></td>
                        <td>{{ $customer->phone ?? '-' }}<div style="color: var(--text-muted); font-size: 0.8rem;">{{ $customer->email }}</div></td>
                        <td>{{ $customer->orders_count }}</td>
                        <td style="color: var(--success); font-weight: 700;">₹{{ number_format($customer->total_spent ?? 0, 2) }}</td>
                        <td><span class="badge {{ $customer->status ? 'badge-success' : 'badge-danger' }}">{{ $customer->status ? 'Active' : 'Disabled' }}</span></td>
                    </tr>
                @empty
                    <tr><td colspan="5" style="text-align: center; color: var(--text-muted); padding: 2rem;">No customers have ordered from this store yet.</td></tr>
                @endforelse
            </tbody>
        </table>
        <div style="margin-top: 1.5rem;">{{ $customers->links() }}</div>
    </div>
@endsection
