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

<div class="mb-5">
    <a href="{{ route('admin.customers.index') }}" class="text-sm text-gray-500 hover:text-blue-600">← Alle Kunden</a>
</div>

<div class="grid grid-cols-3 gap-6">

    {{-- Linke Spalte: Kundendaten --}}
    <div class="space-y-4">

        {{-- Stammdaten --}}
        <div class="bg-white rounded shadow p-5">
            <div class="flex items-center gap-3 mb-4">
                <div class="w-12 h-12 rounded-full bg-blue-600 flex items-center justify-center text-white font-bold text-lg">
                    {{ mb_substr($customer->name, 0, 1) }}
                </div>
                <div>
                    <h2 class="font-semibold">{{ $customer->name }}</h2>
                    <p class="text-xs text-gray-400">Kunde seit {{ $customer->created_at->format('d.m.Y') }}</p>
                </div>
            </div>
            <dl class="space-y-2 text-sm">
                <div>
                    <dt class="text-xs text-gray-400">E-Mail</dt>
                    <dd><a href="mailto:{{ $customer->email }}" class="text-blue-600 hover:underline">{{ $customer->email }}</a></dd>
                </div>
                <div>
                    <dt class="text-xs text-gray-400">E-Mail verifiziert</dt>
                    <dd>
                        @if($customer->email_verified_at)
                            <span class="text-green-600">✓ {{ $customer->email_verified_at->format('d.m.Y') }}</span>
                        @else
                            <span class="text-orange-500">Noch nicht verifiziert</span>
                        @endif
                    </dd>
                </div>
                <div>
                    <dt class="text-xs text-gray-400">Konto-Status</dt>
                    <dd>
                        @if($customer->approved)
                            <span class="text-green-600 font-medium">✓ Freigeschaltet</span>
                        @else
                            <span class="text-red-500 font-medium">✗ Gesperrt / Ausstehend</span>
                        @endif
                    </dd>
                </div>
            </dl>
            <div class="mt-4 pt-4 border-t space-y-2">
                <form method="POST" action="{{ route('admin.customers.toggle-approval', $customer) }}">
                    @csrf
                    <button type="submit"
                            class="w-full py-2 rounded text-sm font-medium transition
                                {{ $customer->approved
                                    ? 'bg-red-50 text-red-600 hover:bg-red-100'
                                    : 'bg-green-600 text-white hover:bg-green-700' }}">
                        {{ $customer->approved ? 'Konto sperren' : 'Konto freischalten' }}
                    </button>
                </form>
                <form method="POST" action="{{ route('admin.customers.destroy', $customer) }}"
                      onsubmit="return confirm('Kunde und alle Daten unwiderruflich löschen?')">
                    @csrf @method('DELETE')
                    <button class="text-red-500 text-xs hover:underline w-full text-left">Kunde löschen</button>
                </form>
            </div>
        </div>

        {{-- Kennzahlen --}}
        <div class="bg-white rounded shadow p-5">
            <h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wide mb-3">Kennzahlen</h3>
            <dl class="space-y-3 text-sm">
                <div class="flex justify-between">
                    <dt class="text-gray-500">Bestellungen gesamt</dt>
                    <dd class="font-semibold">{{ $stats['total_orders'] }}</dd>
                </div>
                <div class="flex justify-between">
                    <dt class="text-gray-500">Umsatz gesamt</dt>
                    <dd class="font-semibold text-green-700">{{ number_format($stats['total_revenue'], 2, ',', '.') }} €</dd>
                </div>
                <div class="flex justify-between">
                    <dt class="text-gray-500">Offene Bestellungen</dt>
                    <dd class="{{ $stats['open_orders'] > 0 ? 'font-semibold text-orange-500' : 'text-gray-400' }}">
                        {{ $stats['open_orders'] }}
                    </dd>
                </div>
                @if($stats['last_order'])
                <div class="flex justify-between">
                    <dt class="text-gray-500">Letzte Bestellung</dt>
                    <dd class="text-gray-600">{{ $stats['last_order']->created_at->format('d.m.Y') }}</dd>
                </div>
                @endif
            </dl>
        </div>

        {{-- Adressen --}}
        @if($customer->addresses->count())
        <div class="bg-white rounded shadow p-5">
            <h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wide mb-3">Gespeicherte Adressen</h3>
            <div class="space-y-3">
                @foreach($customer->addresses as $addr)
                <div class="text-sm border-b pb-3 last:border-0 last:pb-0">
                    @if($addr->is_default)
                        <span class="text-xs bg-blue-100 text-blue-700 px-1.5 py-0.5 rounded mb-1 inline-block">Standard</span>
                    @endif
                    <p class="font-medium">{{ $addr->first_name }} {{ $addr->last_name }}</p>
                    @if($addr->company)<p class="text-gray-500 text-xs">{{ $addr->company }}</p>@endif
                    <p class="text-gray-600">{{ $addr->street }}, {{ $addr->zip }} {{ $addr->city }}</p>
                    @if($addr->phone)<p class="text-gray-400 text-xs">{{ $addr->phone }}</p>@endif
                </div>
                @endforeach
            </div>
        </div>
        @endif

    </div>

    {{-- Rechte Spalte: Bestellungen --}}
    <div class="col-span-2">
        <h3 class="font-semibold mb-3">Bestellhistorie</h3>

        @if($orders->count())
        <div class="bg-white rounded shadow overflow-hidden">
            <table class="w-full text-sm">
                <thead class="bg-gray-50 border-b text-left">
                    <tr>
                        <th class="px-4 py-3">Bestellnr.</th>
                        <th class="px-4 py-3">Status</th>
                        <th class="px-4 py-3">Zahlungsart</th>
                        <th class="px-4 py-3 text-right">Betrag</th>
                        <th class="px-4 py-3">Datum</th>
                        <th class="px-4 py-3"></th>
                    </tr>
                </thead>
                <tbody class="divide-y">
                    @foreach($orders as $order)
                    <tr class="hover:bg-gray-50">
                        <td class="px-4 py-3 font-mono font-medium">{{ $order->order_number }}</td>
                        <td class="px-4 py-3">
                            <span class="px-2 py-0.5 rounded text-xs
                                {{ match($order->status) {
                                    'new'              => 'bg-yellow-100 text-yellow-700',
                                    'payment_received' => 'bg-blue-100 text-blue-700',
                                    'processing'       => 'bg-purple-100 text-purple-700',
                                    'shipped'          => 'bg-indigo-100 text-indigo-700',
                                    'completed'        => 'bg-green-100 text-green-700',
                                    'cancelled'        => 'bg-red-100 text-red-700',
                                    default            => 'bg-gray-100 text-gray-600',
                                } }}">
                                {{ $order->status_label }}
                            </span>
                        </td>
                        <td class="px-4 py-3 text-gray-500">{{ $order->payment_label }}</td>
                        <td class="px-4 py-3 text-right font-medium">{{ number_format($order->total, 2, ',', '.') }} €</td>
                        <td class="px-4 py-3 text-gray-400">{{ $order->created_at->format('d.m.Y') }}</td>
                        <td class="px-4 py-3 text-right">
                            <a href="{{ route('admin.orders.show', $order) }}"
                               class="text-blue-600 hover:underline text-xs">Details</a>
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
            <div class="px-4 py-3 border-t">{{ $orders->links() }}</div>
        </div>
        @else
        <div class="bg-white rounded shadow p-10 text-center text-gray-400">
            Dieser Kunde hat noch keine Bestellungen aufgegeben.
        </div>
        @endif
    </div>

</div>
@endsection