@extends('layouts.app')
@section('title', $customer->name)
@section('breadcrumb')
<li class="breadcrumb-item"><a href="{{ route('customers.index') }}">Customers</a></li>
<li class="breadcrumb-item active">{{ $customer->name }}</li>
@endsection
@section('content')

<div class="page-header d-flex justify-content-between align-items-start">
    <div>
        <h1 class="page-title">{{ $customer->name }}</h1>
        <div class="d-flex gap-2 mt-1">
            <span class="badge {{ $customer->is_active ? 'bg-success' : 'bg-danger' }}">{{ $customer->is_active ? 'Active' : 'Inactive' }}</span>
            @if($customer->is_over_credit_limit)<span class="badge bg-danger">Over Credit Limit</span>@endif
            @if($customer->current_due > 0)<span class="badge bg-warning text-dark">Has Due Balance</span>@endif
        </div>
    </div>
    <div class="d-flex gap-2 flex-wrap justify-content-end">
        <a href="{{ route('customers.ledger', $customer) }}" class="btn btn-outline-secondary btn-sm">
            <i class="bi bi-journal-text me-1"></i> Ledger
        </a>
        @can_permission('customers.edit')
        <form method="POST" action="{{ route('customers.toggle-status', $customer) }}">
            @csrf
            <button type="submit" class="btn btn-sm {{ $customer->is_active ? 'btn-outline-warning' : 'btn-outline-success' }}">
                <i class="bi bi-{{ $customer->is_active ? 'pause' : 'play' }}-circle me-1"></i>
                {{ $customer->is_active ? 'Deactivate' : 'Activate' }}
            </button>
        </form>
        <a href="{{ route('customers.edit', $customer) }}" class="btn btn-outline-primary btn-sm">
            <i class="bi bi-pencil me-1"></i> Edit
        </a>
        @endcan_permission
    </div>
</div>

{{-- Stats --}}
<div class="row g-3 mb-3">
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:#dbeafe;"><i class="bi bi-receipt" style="color:#1d4ed8;"></i></div>
            <div><div class="stat-value">{{ $totalSalesCount }}</div><div class="stat-label">Total Sales</div></div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:#d1fae5;"><i class="bi bi-cash-stack" style="color:#059669;"></i></div>
            <div><div class="stat-value" style="font-size:1.1rem;">৳{{ number_format($totalPurchased, 0) }}</div><div class="stat-label">Total Purchased</div></div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:#dcfce7;"><i class="bi bi-cash" style="color:#16a34a;"></i></div>
            <div><div class="stat-value" style="font-size:1.1rem;">৳{{ number_format($totalPaid, 0) }}</div><div class="stat-label">Total Paid</div></div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card">
            <div class="stat-icon" style="background:{{ $customer->current_due > 0 ? '#fee2e2' : '#d1fae5' }};"><i class="bi bi-clock" style="color:{{ $customer->current_due > 0 ? '#dc2626' : '#059669' }};"></i></div>
            <div><div class="stat-value" style="color:{{ $customer->current_due > 0 ? '#dc2626' : '#059669' }};font-size:1.1rem;">৳{{ number_format($customer->current_due, 0) }}</div><div class="stat-label">Current Due</div></div>
        </div>
    </div>
</div>

<div class="row g-3">

    {{-- Left: Profile --}}
    <div class="col-12 col-lg-4">

        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-person me-2"></i>Profile</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.875rem;">
                    <tr><td class="text-muted" style="width:40%;">Name</td><td class="fw-600">{{ $customer->name }}</td></tr>
                    <tr><td class="text-muted">Phone</td><td>{{ $customer->phone ?? '—' }}</td></tr>
                    <tr><td class="text-muted">Email</td><td>{{ $customer->email ?? '—' }}</td></tr>
                    <tr><td class="text-muted">Address</td><td>{{ $customer->address ?? '—' }}</td></tr>
                    <tr><td class="text-muted">Opening Bal.</td><td>৳{{ number_format($customer->opening_balance, 2) }}</td></tr>
                    <tr><td class="text-muted">Credit Limit</td><td>{{ $customer->credit_limit > 0 ? '৳'.number_format($customer->credit_limit, 2) : 'No limit' }}</td></tr>
                    <tr><td class="text-muted">Member Since</td><td>{{ $customer->created_at->format('d M Y') }}</td></tr>
                </table>
            </div>
        </div>

        {{-- Record Payment --}}
        @if($customer->current_due > 0)
        @can_permission('payments.customer.pay')
        <div class="card mb-3">
            <div class="card-header" style="background:#f0fdf4;"><i class="bi bi-cash me-2" style="color:#059669;"></i>Record Payment</div>
            <div class="card-body">
                <form method="POST" action="{{ route('customers.pay', $customer) }}">
                    @csrf
                    <div class="mb-2">
                        <label class="form-label fw-semibold" style="font-size:.825rem;">Amount (Max: ৳{{ number_format($customer->current_due, 2) }})</label>
                        <div class="input-group input-group-sm">
                            <span class="input-group-text">৳</span>
                            <input type="number" name="amount" class="form-control" value="{{ $customer->current_due }}"
                                   min="0.01" max="{{ $customer->current_due }}" step="0.01" required>
                        </div>
                    </div>
                    <div class="mb-2">
                        <select name="account_id" class="form-select form-select-sm" required>
                            <option value="">— Select Account —</option>
                            @foreach($accounts as $acc)
                            <option value="{{ $acc->id }}">{{ $acc->name }} ({{ ucfirst($acc->type) }})</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-2">
                        <input type="date" name="payment_date" class="form-control form-control-sm" value="{{ date('Y-m-d') }}" required>
                    </div>
                    <div class="mb-2">
                        <select name="payment_method" class="form-select form-select-sm">
                            <option value="cash">Cash</option>
                            <option value="mobile_banking">Mobile Banking</option>
                            <option value="bank_transfer">Bank Transfer</option>
                            <option value="cheque">Cheque</option>
                        </select>
                    </div>
                    <div class="mb-2">
                        <input type="text" name="reference" class="form-control form-control-sm" placeholder="Reference (optional)">
                    </div>
                    <button type="submit" class="btn btn-success btn-sm w-100">
                        <i class="bi bi-check-circle me-1"></i> Record Payment
                    </button>
                </form>
            </div>
        </div>
        @endcan_permission
        @endif

    </div>

    {{-- Right: History --}}
    <div class="col-12 col-lg-8">

        {{-- Recent Sales --}}
        <div class="card mb-3">
            <div class="card-header d-flex justify-content-between align-items-center">
                <span><i class="bi bi-receipt me-2"></i>Recent Sales</span>
                @can_permission('sales.view')
                <a href="{{ route('sales.index', ['customer_id' => $customer->id]) }}" class="btn btn-sm btn-outline-primary">All Sales</a>
                @endcan_permission
            </div>
            <div class="card-body p-0">
                @if($customer->sales->isEmpty())
                <div class="text-center py-4 text-muted" style="font-size:.875rem;"><i class="bi bi-receipt" style="font-size:1.5rem;display:block;margin-bottom:.25rem;"></i>No sales yet</div>
                @else
                <table class="table table-sm mb-0" style="font-size:.825rem;">
                    <thead><tr><th>Invoice</th><th>Date</th><th>Total</th><th>Paid</th><th>Due</th><th>Status</th></tr></thead>
                    <tbody>
                        @foreach($customer->sales as $sale)
                        <tr>
                            <td><a href="{{ route('sales.show', $sale) }}" style="color:#1d4ed8;font-weight:600;text-decoration:none;">{{ $sale->invoice_no }}</a></td>
                            <td>{{ $sale->sale_date->format('d M Y') }}</td>
                            <td>৳{{ number_format($sale->total_amount, 2) }}</td>
                            <td class="text-success">৳{{ number_format($sale->paid_amount, 2) }}</td>
                            <td>{{ $sale->due_amount > 0 ? '৳'.number_format($sale->due_amount, 2) : '—' }}</td>
                            <td>@php $sc=['completed'=>'success','hold'=>'warning','returned'=>'danger','cancelled'=>'secondary']; @endphp<span class="badge bg-{{ $sc[$sale->status] ?? 'secondary' }}">{{ ucfirst($sale->status) }}</span></td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
                @endif
            </div>
        </div>

        {{-- Recent Payments --}}
        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-cash-stack me-2"></i>Recent Payments</div>
            <div class="card-body p-0">
                @if($customer->payments->isEmpty())
                <div class="text-center py-4 text-muted" style="font-size:.875rem;"><i class="bi bi-cash-stack" style="font-size:1.5rem;display:block;margin-bottom:.25rem;"></i>No payments yet</div>
                @else
                <table class="table table-sm mb-0" style="font-size:.825rem;">
                    <thead><tr><th>Date</th><th>Amount</th><th>Method</th><th>Account</th><th>Reference</th></tr></thead>
                    <tbody>
                        @foreach($customer->payments as $pmt)
                        <tr>
                            <td>{{ $pmt->payment_date->format('d M Y') }}</td>
                            <td class="fw-600 text-success">৳{{ number_format($pmt->amount, 2) }}</td>
                            <td>{{ ucfirst(str_replace('_',' ',$pmt->payment_method)) }}</td>
                            <td>{{ $pmt->account->name }}</td>
                            <td>{{ $pmt->reference ?? '—' }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
                @endif
            </div>
        </div>

        {{-- Warranties --}}
        @if($customer->warranties->isNotEmpty())
        <div class="card mb-3">
            <div class="card-header"><i class="bi bi-shield-check me-2"></i>Warranties</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.825rem;">
                    <thead><tr><th>Product</th><th>Serial</th><th>Start</th><th>End</th><th>Status</th></tr></thead>
                    <tbody>
                        @foreach($customer->warranties as $w)
                        <tr>
                            <td>{{ $w->saleItem?->productVariant?->product?->name ?? '—' }}</td>
                            <td><code style="font-size:.72rem;">{{ $w->serialNumber?->serial_no ?? '—' }}</code></td>
                            <td>{{ $w->start_date->format('d M Y') }}</td>
                            <td>{{ $w->end_date->format('d M Y') }}</td>
                            <td><span class="badge bg-{{ $w->status === 'active' ? 'success' : ($w->status === 'expired' ? 'danger' : 'warning') }}">{{ ucfirst($w->status) }}</span></td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
        @endif

        {{-- Repair Tickets --}}
        @if($customer->repairTickets->isNotEmpty())
        <div class="card">
            <div class="card-header"><i class="bi bi-tools me-2"></i>Repair Tickets</div>
            <div class="card-body p-0">
                <table class="table table-sm mb-0" style="font-size:.825rem;">
                    <thead><tr><th>Ticket</th><th>Device</th><th>Status</th><th>Date</th></tr></thead>
                    <tbody>
                        @foreach($customer->repairTickets as $ticket)
                        <tr>
                            <td><a href="{{ route('repairs.show', $ticket) }}" style="color:#1d4ed8;font-weight:600;text-decoration:none;">{{ $ticket->ticket_no }}</a></td>
                            <td>{{ $ticket->device_name }}</td>
                            <td><span class="badge bg-secondary">{{ ucfirst(str_replace('_',' ',$ticket->status)) }}</span></td>
                            <td>{{ $ticket->received_date->format('d M Y') }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
        @endif

    </div>
</div>

@endsection