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

@section('content')
<x-page-head icon="person" :title="$customer->name"
    :subtitle="__('customers.id_types.' . $customer->id_type) . ($customer->national_id ? ' · ' . $customer->national_id : '')">
    <x-slot:actions>
        @can('customers.edit')
            <a href="{{ route('customers.edit', $customer) }}" class="btn btn-primary btn-sm">
                <i class="bi bi-pencil"></i> {{ __('app.edit') }}
            </a>
        @endcan
        <a href="{{ route('customers.index') }}" class="btn btn-secondary btn-sm">
            <i class="bi bi-arrow-{{ app()->getLocale() === 'en' ? 'left' : 'right' }}"></i> {{ __('app.back') }}
        </a>
    </x-slot:actions>
</x-page-head>

<div class="row g-2 g-md-3 mb-3">
    <div class="col-6 col-md-3">
        <div class="mini-stat">
            <div class="ms-value">{{ $customer->applications->count() }}</div>
            <div class="ms-label">{{ __('app.applications') }}</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="mini-stat">
            <div class="ms-value">{{ $customer->leads->count() }}</div>
            <div class="ms-label">{{ __('app.leads') }}</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="mini-stat">
            <div class="ms-value" style="font-size:1.1rem"><x-money :value="$customer->monthly_income" /></div>
            <div class="ms-label">{{ __('app.monthly_income') }}</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="mini-stat">
            <div class="ms-value" style="font-size:1.1rem">{{ $customer->employment_sector ? __('customers.sectors.' . $customer->employment_sector) : '—' }}</div>
            <div class="ms-label">{{ __('customers.employment_sector') }}</div>
        </div>
    </div>
</div>

<div class="row g-3">
    <div class="col-lg-4">
        <x-detail-card :title="__('app.basic_info')" icon="person-vcard">
            <x-detail-item :label="__('customers.id_type')">{{ __('customers.id_types.' . $customer->id_type) }}</x-detail-item>
            <x-detail-item :label="__('app.national_id')">{{ $customer->national_id }}</x-detail-item>
            <x-detail-item :label="__('customers.birth_date')">{{ optional($customer->birth_date)->format('Y-m-d') }}</x-detail-item>
            <x-detail-item :label="__('customers.gender')">{{ $customer->gender ? __('customers.genders.' . $customer->gender) : '' }}</x-detail-item>
            <x-detail-item :label="__('customers.nationality')">{{ $customer->nationality }}</x-detail-item>
            <x-detail-item :label="__('app.phone')">{{ $customer->phone }}</x-detail-item>
            <x-detail-item :label="__('app.email')">{{ $customer->email }}</x-detail-item>
            <x-detail-item :label="__('app.city')">{{ $customer->city }}</x-detail-item>
            <x-detail-item :label="__('customers.employer')">{{ $customer->employer }}</x-detail-item>
            <x-detail-item :label="__('app.monthly_income')">@if($customer->monthly_income)<x-money :value="$customer->monthly_income" :decimals="2" />@endif</x-detail-item>
        </x-detail-card>
    </div>

    <div class="col-lg-8">
        <x-related-card :title="__('app.applications')" icon="folder2-open" :count="$customer->applications->count()" class="mb-3">
            <div class="table-responsive">
                <table class="table table-hover mb-0 align-middle">
                    <thead class="table-light"><tr>
                        <th>{{ __('app.application_number') }}</th>
                        <th>{{ __('applications.columns.finance_product') }}</th>
                        <th class="text-end">{{ __('app.amount') }}</th>
                        <th>{{ __('app.status') }}</th>
                    </tr></thead>
                    <tbody>
                        @forelse($customer->applications as $app)
                            <tr>
                                <td><a href="{{ route('applications.show', $app) }}" class="text-decoration-none fw-semibold">{{ $app->application_number }}</a></td>
                                <td class="text-truncate" style="max-width:160px">{{ optional($app->product)->name ?? '—' }}</td>
                                <td class="text-end"><x-money :value="$app->requested_amount" /></td>
                                <td>@include('applications.partials.status_badge', ['status' => $app->status])</td>
                            </tr>
                        @empty
                            <tr><td colspan="4" class="text-center text-muted py-4">{{ __('app.no_related') }}</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </x-related-card>

        <x-related-card :title="__('app.leads')" icon="person-lines-fill" :count="$customer->leads->count()">
            <div class="table-responsive">
                <table class="table table-hover mb-0 align-middle">
                    <thead class="table-light"><tr>
                        <th>{{ __('app.reference') }}</th>
                        <th>{{ __('applications.columns.finance_product') }}</th>
                        <th class="text-end">{{ __('leads.estimated_amount') }}</th>
                        <th>{{ __('app.status') }}</th>
                    </tr></thead>
                    <tbody>
                        @forelse($customer->leads as $lead)
                            <tr>
                                <td>
                                    @can('leads.view')
                                        <a href="{{ route('leads.show', $lead) }}" class="text-decoration-none fw-semibold">{{ $lead->reference }}</a>
                                    @else
                                        {{ $lead->reference }}
                                    @endcan
                                </td>
                                <td class="text-truncate" style="max-width:160px">{{ optional($lead->financeProduct)->name ?? '—' }}</td>
                                <td class="text-end"><x-money :value="$lead->estimated_amount" /></td>
                                <td><span class="badge bg-secondary">{{ __('leads.statuses.' . $lead->status) }}</span></td>
                            </tr>
                        @empty
                            <tr><td colspan="4" class="text-center text-muted py-4">{{ __('app.no_related') }}</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </x-related-card>
    </div>
</div>
@endsection