@extends('layouts.app')
@section('title', $client->name)

@section('content')
    <div class="mb-4"><a href="{{ route('clients.index') }}" class="text-sm text-brand-600 hover:underline">&larr; {{ __('Back') }}</a></div>

    <div class="grid grid-cols-1 gap-6 lg:grid-cols-3">
        <div class="card">
            <h2 class="text-lg font-bold">{{ $client->name }}</h2>
            <dl class="mt-3 space-y-2 text-sm">
                <div class="flex justify-between"><dt class="text-slate-400">{{ __('Phone') }}</dt><dd>{{ $client->phone ?? '—' }}</dd></div>
                <div class="flex justify-between"><dt class="text-slate-400">{{ __('Email') }}</dt><dd>{{ $client->email ?? '—' }}</dd></div>
                <div class="flex justify-between"><dt class="text-slate-400">{{ __('Balance') }}</dt><dd class="font-semibold">{{ money($client->balance) }}</dd></div>
                <div class="flex justify-between"><dt class="text-slate-400">{{ __('Total spent') }}</dt><dd class="font-semibold text-brand-700">{{ money($totalSpent) }}</dd></div>
            </dl>
        </div>

        <div class="lg:col-span-2">
            <h3 class="mb-3 font-semibold">{{ __('Sales history') }}</h3>
            <div class="table-wrap">
                <table class="min-w-full divide-y divide-slate-100">
                    <thead class="bg-slate-50"><tr>
                        <th class="th">{{ __('Reference') }}</th><th class="th">{{ __('Date') }}</th><th class="th">{{ __('Employee') }}</th><th class="th text-right">{{ __('Total') }}</th>
                    </tr></thead>
                    <tbody class="divide-y divide-slate-100">
                        @forelse ($sales as $sale)
                            <tr class="hover:bg-slate-50">
                                <td class="td font-mono text-xs"><a href="{{ route('sales.show', $sale) }}" class="text-brand-600 hover:underline">{{ $sale->reference }}</a></td>
                                <td class="td">{{ $sale->created_at->format('d/m/Y H:i') }}</td>
                                <td class="td">{{ $sale->employee?->name }}</td>
                                <td class="td text-right font-semibold">{{ money($sale->total) }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="4" class="td py-8 text-center text-slate-400">{{ __('No sales.') }}</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
            <div class="mt-4">{{ $sales->links() }}</div>
        </div>
    </div>
@endsection