@extends('admin.layout')
@section('title', 'Dashboard')

@section('content')

{{-- ── Gebeurtenissen van de dag ──────────────────────────────────────── --}}
<div class="bg-white rounded-lg border border-gray-100 p-4 mb-5">

    {{-- Header + datumkiezer --}}
    @php
        $prevDate = \Carbon\Carbon::parse($dateStr)->subDay()->toDateString();
        $nextDate = \Carbon\Carbon::parse($dateStr)->addDay()->toDateString();
        $isToday  = $dateStr === today()->toDateString();
    @endphp
    <div class="flex items-center justify-between gap-4 mb-4">
        <p class="text-xs font-semibold text-gray-500 uppercase tracking-wide">Gebeurtenissen</p>
        <div class="flex items-center gap-1">
            <a href="{{ route('admin.dashboard', ['date' => $prevDate]) }}"
               class="px-2 py-1 text-sm text-gray-400 hover:text-gray-600 border border-gray-200 rounded-lg leading-none transition">&#8249;</a>
            <form method="GET" action="{{ route('admin.dashboard') }}" class="flex items-center gap-1">
                <input type="date" name="date" value="{{ $dateStr }}"
                       max="{{ today()->toDateString() }}"
                       onchange="this.form.submit()"
                       class="text-xs border border-gray-200 rounded-lg px-2 py-1 text-gray-600 focus:outline-none focus:ring-1 focus:ring-indigo-400">
            </form>
            @if ($isToday)
                <span class="px-2 py-1 text-sm text-gray-200 border border-gray-100 rounded-lg leading-none cursor-default">&#8250;</span>
            @else
                <a href="{{ route('admin.dashboard', ['date' => $nextDate]) }}"
                   class="px-2 py-1 text-sm text-gray-400 hover:text-gray-600 border border-gray-200 rounded-lg leading-none transition">&#8250;</a>
                <a href="{{ route('admin.dashboard') }}"
                   class="text-[11px] text-gray-400 hover:text-gray-600 transition ml-1">vandaag</a>
            @endif
        </div>
    </div>

    @php
        $logsUrl       = route('admin.logs');
        $appErrCount   = count($events['appErrors']);
        $srvErrCount   = $events['serverErrors']->count();
    @endphp

    <div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-3">

        {{-- Nieuwe accounts --}}
        @php $newCount = $events['newAccounts']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $newCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.users.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Nieuwe accounts</span>
                <span class="text-base font-bold {{ $newCount ? 'text-emerald-600' : 'text-gray-300' }}">{{ $newCount }}</span>
            </a>
            @if ($newCount)
                <ul class="space-y-1">
                    @foreach ($events['newAccounts']->take(5) as $u)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <a href="{{ route('admin.users.show', $u->id) }}"
                               class="text-gray-700 hover:underline truncate"><span class="text-gray-400">#{{ $u->id }}</span> {{ $u->name ?: $u->email }}</a>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($u->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($newCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $newCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.users.index') }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Alle gebruikers →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Actieve gebruikers --}}
        @php $activeCount = ($events['activeUsers'] ?? collect())->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $activeCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.users.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Actieve gebruikers</span>
                <div class="flex items-center gap-2">
                    <span class="text-[10px] {{ $stats['active_now'] > 0 ? 'text-green-500' : 'text-gray-300' }}"
                          title="Actief in de afgelopen 15 minuten">● {{ $stats['active_now'] }} nu</span>
                    <span class="text-base font-bold {{ $activeCount ? 'text-blue-600' : 'text-gray-300' }}">{{ $activeCount }}</span>
                </div>
            </a>
            @if ($activeCount)
                <ul class="space-y-1">
                    @foreach (($events['activeUsers'] ?? collect())->take(5) as $u)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            @if ($u->user_id)
                                <a href="{{ route('admin.users.show', $u->user_id) }}"
                                   class="text-gray-700 hover:underline truncate">
                                    <span class="text-gray-400">#{{ $u->user_id }}</span> {{ $u->name }}
                                </a>
                            @else
                                <span class="text-gray-300 italic truncate">Gast</span>
                            @endif
                            <div class="text-right shrink-0 leading-tight">
                                <span class="text-gray-400 block">{{ \Carbon\Carbon::parse($u->last_active_at)->format('H:i') }}</span>
                                <span class="text-gray-300 block">{{ $u->page_count }}p</span>
                            </div>
                        </li>
                    @endforeach
                    @if ($activeCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $activeCount - 5 }} meer</li>
                    @endif
                </ul>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Accounts verwijderd --}}
        @php $delCount = $events['deleted']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $delCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.logs', ['tab' => 'security']) }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Accounts verwijderd</span>
                <span class="text-base font-bold {{ $delCount ? 'text-red-500' : 'text-gray-300' }}">{{ $delCount }}</span>
            </a>
            @if ($delCount)
                <ul class="space-y-1.5">
                    @foreach ($events['deleted']->take(5) as $log)
                        <li class="text-[11px] flex items-start justify-between gap-1">
                            <span class="min-w-0">
                                <span class="flex items-center gap-1">
                                    @if ($log->target_user_id)
                                        <span class="text-gray-400 shrink-0">#{{ $log->target_user_id }}</span>
                                    @endif
                                    <span class="text-gray-700 font-medium truncate">{{ $log->target_name ?: '—' }}</span>
                                    @if ($log->note === 'self-deletion')
                                        <span class="text-gray-400 shrink-0">(zelf)</span>
                                    @elseif ($log->admin_id)
                                        <span class="text-gray-400 shrink-0">(admin)</span>
                                    @endif
                                </span>
                                <span class="text-gray-400 block truncate">{{ $log->target_email }}</span>
                            </span>
                            <span class="text-gray-300 shrink-0 mt-0.5">{{ \Carbon\Carbon::parse($log->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($delCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $delCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.logs', ['tab' => 'security']) }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Security log →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Profielmeldingen --}}
        @php $repCount = $events['reports']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $repCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.reports.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Profielmeldingen</span>
                <span class="text-base font-bold {{ $repCount ? 'text-orange-500' : 'text-gray-300' }}">{{ $repCount }}</span>
            </a>
            @if ($repCount)
                <ul class="space-y-1">
                    @foreach ($events['reports']->take(5) as $rep)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <a href="{{ route('admin.reports.index') }}"
                               class="truncate {{ $rep->read_at ? 'text-gray-500' : 'text-orange-600 font-medium' }} hover:underline">
                                {{ $rep->category === 'report-profile' ? 'Nepprofiel' : 'Wangedrag' }}
                                — {{ $rep->name ?: $rep->email }}
                            </a>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($rep->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($repCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $repCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.reports.index') }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Alle meldingen →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Betalingen --}}
        @php
            $payCount = $events['payments']->count();
            $payLabels = [
                'checkout_started'       => 'Checkout gestart',
                'plan_switch_started'    => 'Planwissel gestart',
                'payment_paid'           => 'Betaald',
                'renewal_paid'           => 'Verlenging betaald',
                'payment_refunded'       => '↩ Terugbetaald',
                'payment_charged_back'   => '↩ Chargeback',
                'payment_failed'         => 'Mislukt',
                'payment_expired'        => 'Verlopen',
                'payment_cancelled'      => 'Geannuleerd',
                'subscription_cancelled' => 'Abonnement opgezegd',
                'referral_rewarded'      => 'Referral beloond',
            ];
        @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $payCount ? '' : 'hidden sm:block' }}">
            <a href="{{ $logsUrl }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Betalingen</span>
                <span class="text-base font-bold {{ $payCount ? 'text-violet-600' : 'text-gray-300' }}">{{ $payCount }}</span>
            </a>
            @if ($payCount)
                <ul class="space-y-1">
                    @foreach ($events['payments']->take(5) as $pay)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <a href="{{ route('admin.logs.payment', $pay->id) }}"
                               class="truncate hover:underline {{ in_array($pay->event, ['payment_refunded','payment_charged_back']) ? 'text-red-500' : 'text-gray-600' }}">
                                {{ $payLabels[$pay->event] ?? $pay->event }}
                                @if ($pay->user) — <span class="text-gray-400">#{{ $pay->user->id }}</span> {{ $pay->user->name }} @endif
                            </a>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($pay->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($payCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $payCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ $logsUrl }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Betalingslog →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- App-fouten --}}
        <div class="rounded-lg border border-gray-100 p-3 {{ $appErrCount ? '' : 'hidden sm:block' }}">
            <a href="{{ $logsUrl }}?tab=app-errors&date={{ $dateStr !== today()->toDateString() ? $dateStr : 'laravel.log' }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">App-fouten</span>
                <span class="text-base font-bold {{ $appErrCount ? 'text-red-600' : 'text-gray-300' }}">{{ $appErrCount }}</span>
            </a>
            @if ($appErrCount)
                <ul class="space-y-1">
                    @foreach (array_slice($events['appErrors'], 0, 5) as $err)
                        <li class="text-[11px] flex items-start justify-between gap-1">
                            <span class="truncate {{ $err['level'] === 'ERROR' ? 'text-red-600' : 'text-red-700 font-medium' }}">
                                {{ $err['level'] === 'CRITICAL' || $err['level'] === 'EMERGENCY' ? '⚠ ' : '' }}{{ \Illuminate\Support\Str::limit($err['message'], 60) }}
                            </span>
                            <span class="text-gray-300 shrink-0">{{ substr($err['time'], 0, 5) }}</span>
                        </li>
                    @endforeach
                    @if ($appErrCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $appErrCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ $logsUrl }}?tab=app-errors&date={{ $dateStr !== today()->toDateString() ? $dateStr : 'laravel.log' }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">App-foutenlog →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Serverfouten --}}
        <div class="rounded-lg border border-gray-100 p-3 {{ $srvErrCount ? '' : 'hidden sm:block' }}">
            <a href="{{ $logsUrl }}?tab=server&status_range=5xx&from={{ $dateStr }}&to={{ $dateStr }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Serverfouten (5xx)</span>
                <span class="text-base font-bold {{ $srvErrCount ? 'text-red-500' : 'text-gray-300' }}">{{ $srvErrCount }}</span>
            </a>
            @if ($srvErrCount)
                <ul class="space-y-1">
                    @foreach ($events['serverErrors']->take(5) as $req)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <a href="{{ route('admin.logs.server', $req->id) }}"
                               class="truncate text-red-600 hover:underline font-mono">
                                {{ $req->status }} {{ $req->method }} {{ $req->path }}
                            </a>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($req->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($srvErrCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $srvErrCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ $logsUrl }}?tab=server&status_range=5xx&from={{ $dateStr }}&to={{ $dateStr }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Serverlog →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Clientfouten (4xx) --}}
        @php $clientErrCount = $events['clientErrors']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $clientErrCount ? '' : 'hidden sm:block' }}">
            <a href="{{ $logsUrl }}?tab=server&status_range=4xx&from={{ $dateStr }}&to={{ $dateStr }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Clientfouten (4xx)</span>
                <span class="text-base font-bold {{ $clientErrCount ? 'text-yellow-600' : 'text-gray-300' }}">{{ $clientErrCount }}</span>
            </a>
            @if ($clientErrCount)
                <ul class="space-y-1">
                    @foreach ($events['clientErrors']->take(5) as $req)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <span class="truncate text-yellow-700 font-mono">
                                {{ $req->status }} {{ $req->method }} {{ $req->path }}
                            </span>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($req->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($clientErrCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $clientErrCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ $logsUrl }}?tab=server&status_range=4xx&from={{ $dateStr }}&to={{ $dateStr }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Serverlog →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Likes --}}
        <div class="rounded-lg border border-gray-100 p-3 {{ $events['likesCount'] ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.users.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Likes</span>
                <span class="text-base font-bold {{ $events['likesCount'] ? 'text-pink-500' : 'text-gray-300' }}">{{ $events['likesCount'] }}</span>
            </a>
            @if ($events['likesCount'])
                <p class="text-[11px] text-gray-400">
                    {{ $events['likesCount'] }} {{ $events['likesCount'] === 1 ? 'like' : 'likes' }} verstuurd op deze dag.
                </p>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Follows --}}
        @php $followCount = $events['follows']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $followCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.social.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Nieuwe follows</span>
                <span class="text-base font-bold {{ $followCount ? 'text-sky-500' : 'text-gray-300' }}">{{ $followCount }}</span>
            </a>
            @if ($followCount)
                <ul class="space-y-1">
                    @foreach ($events['follows']->take(5) as $follow)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <span class="truncate text-gray-600">
                                <a href="{{ route('admin.users.show', $follow->follower_id) }}" class="hover:underline"><span class="text-gray-400">#{{ $follow->follower_id }}</span> {{ $follow->follower?->name ?? '?' }}</a>
                                <span class="text-gray-300 mx-1">→</span>
                                <a href="{{ route('admin.users.show', $follow->following_id) }}" class="hover:underline"><span class="text-gray-400">#{{ $follow->following_id }}</span> {{ $follow->following?->name ?? '?' }}</a>
                            </span>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($follow->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($followCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $followCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.social.index') }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Follows & Blocks →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Nieuwe posts --}}
        @php $postCount = $events['newPosts']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $postCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.posts.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Nieuwe posts</span>
                <span class="text-base font-bold {{ $postCount ? 'text-teal-600' : 'text-gray-300' }}">{{ $postCount }}</span>
            </a>
            @if ($postCount)
                <ul class="space-y-1">
                    @foreach ($events['newPosts']->take(5) as $post)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <span class="truncate text-gray-600">
                                <a href="{{ route('admin.users.show', $post->user_id) }}" class="hover:underline font-medium"><span class="text-gray-400">#{{ $post->user_id }}</span> {{ $post->user?->name ?? '?' }}</a>
                                <span class="text-gray-400 ml-1">— {{ \Illuminate\Support\Str::limit(strip_tags($post->body), 40) }}</span>
                            </span>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($post->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($postCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $postCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.posts.index') }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Alle posts →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Nieuwe gesprekken --}}
        @php $convCount = $events['newConversations']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $convCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.conversations.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Nieuwe gesprekken</span>
                <span class="text-base font-bold {{ $convCount ? 'text-indigo-600' : 'text-gray-300' }}">{{ $convCount }}</span>
            </a>
            @if ($convCount)
                <ul class="space-y-1">
                    @foreach ($events['newConversations']->take(5) as $conv)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <a href="{{ route('admin.conversations.show', $conv->id) }}"
                               class="truncate text-gray-600 hover:underline">
                                <span class="text-gray-400">#{{ $conv->user_one_id }}</span> {{ $conv->userOne?->name ?? '?' }} &amp; <span class="text-gray-400">#{{ $conv->user_two_id }}</span> {{ $conv->userTwo?->name ?? '?' }}
                            </a>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($conv->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($convCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $convCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.conversations.index') }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Alle berichten →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

        {{-- Contactberichten (niet-meldingen) --}}
        @php $contactCount = $events['contactMessages']->count(); @endphp
        <div class="rounded-lg border border-gray-100 p-3 {{ $contactCount ? '' : 'hidden sm:block' }}">
            <a href="{{ route('admin.contact.index') }}" class="flex items-center justify-between mb-2 hover:opacity-75 transition">
                <span class="text-[11px] font-semibold uppercase tracking-wide text-gray-400">Contactberichten</span>
                <span class="text-base font-bold {{ $contactCount ? 'text-amber-500' : 'text-gray-300' }}">{{ $contactCount }}</span>
            </a>
            @if ($contactCount)
                <ul class="space-y-1">
                    @foreach ($events['contactMessages']->take(5) as $msg)
                        <li class="text-[11px] flex items-center justify-between gap-1">
                            <a href="{{ route('admin.contact.show', $msg->id) }}"
                               class="truncate {{ $msg->read_at ? 'text-gray-500' : 'text-amber-600 font-medium' }} hover:underline">
                                {{ $msg->name ?: $msg->email }}
                            </a>
                            <span class="text-gray-300 shrink-0">{{ \Carbon\Carbon::parse($msg->created_at)->format('H:i:s') }}</span>
                        </li>
                    @endforeach
                    @if ($contactCount > 5)
                        <li class="text-[11px] text-gray-400">+{{ $contactCount - 5 }} meer</li>
                    @endif
                </ul>
                <a href="{{ route('admin.contact.index') }}"
                   class="block mt-2 text-[11px] text-gray-300 hover:text-gray-500 transition">Alle contactberichten →</a>
            @else
                <p class="text-[11px] text-gray-300 italic">Geen</p>
            @endif
        </div>

    </div>
</div>


@php
    $fmt = fn(float $v): string => "€\u{202F}" . number_format($v, 2, ',', '.');
@endphp

<div class="grid grid-cols-1 lg:grid-cols-3 gap-4 mb-6">

    {{-- Omzet (2/3) --}}
    <div class="bg-white rounded-lg border border-gray-100 p-4 lg:col-span-2">
        <p class="text-xs font-semibold text-gray-500 mb-3">Omzet (betaalde abonnementen)</p>

        {{-- Periodes --}}
        <div class="grid grid-cols-2 gap-x-4 gap-y-1.5 mb-4 text-xs">
            @foreach ([
                ['Vandaag',        $revenue['today']],
                ['Deze week',      $revenue['week']],
                ['Deze maand',     $revenue['month']],
                ['Dit kwartaal',   $revenue['quarter']],
                ['Dit jaar',       $revenue['year']],
            ] as [$label, $val])
                <span class="text-gray-400">{{ $label }}</span>
                <span class="font-semibold tabular-nums {{ $val > 0 ? 'text-emerald-600' : 'text-gray-300' }}">
                    {{ $fmt($val) }}
                </span>
            @endforeach
        </div>

        {{-- Scheidingslijn + gemiddelden --}}
        <div class="border-t border-gray-100 pt-2.5 mb-3">
            <p class="text-[11px] font-semibold text-gray-400 uppercase tracking-wide mb-1.5">Gemiddelden</p>
            <div class="grid grid-cols-2 gap-x-4 gap-y-1 text-xs">
                @foreach ([
                    ['Gem/dag (30d)',    $revenue['avg_day']],
                    ['Gem/week (12w)',   $revenue['avg_week']],
                    ['Gem/maand (12m)',  $revenue['avg_month']],
                ] as [$label, $val])
                    <span class="text-gray-400">{{ $label }}</span>
                    <span class="font-semibold tabular-nums {{ $val > 0 ? 'text-sky-600' : 'text-gray-300' }}">
                        {{ $fmt($val) }}
                    </span>
                @endforeach
            </div>
        </div>

        {{-- Omzet mini-chart (14 dagen) --}}
        @php
            $revDays = collect();
            for ($i = 13; $i >= 0; $i--) {
                $d = now()->subDays($i)->format('Y-m-d');
                $revDays[$d] = (float) ($revenue['chart'][$d] ?? 0);
            }
            $revMax = max($revDays->max(), 0.01);
        @endphp
        <div class="flex items-end gap-0.5 h-16">
            @foreach ($revDays as $d => $val)
                <div class="flex-1 flex flex-col items-center gap-0.5"
                     title="{{ \Carbon\Carbon::parse($d)->format('d/m') }}: {{ $fmt($val) }}">
                    <div class="w-full rounded-t bg-emerald-400"
                         style="height:{{ max($val > 0 ? 2 : 0, round($val / $revMax * 58)) }}px"></div>
                    <span class="text-[8px] text-gray-200">{{ \Carbon\Carbon::parse($d)->format('d') }}</span>
                </div>
            @endforeach
        </div>
    </div>

    {{-- Geslacht donut --}}
    <div class="bg-white rounded-lg border border-gray-100 p-4">
        <p class="text-xs font-semibold text-gray-500 mb-3">Geslacht (profielen)</p>
        @php
            $gMale   = (int) ($genderStats['male']    ?? 0);
            $gFemale = (int) ($genderStats['female']  ?? 0);
            $gOther  = (int) ($genderStats['other']   ?? 0);
            $gTotal  = $gMale + $gFemale + $gOther;
            if ($gTotal > 0) {
                $gStop1 = round($gMale   / $gTotal * 100);
                $gStop2 = round(($gMale + $gFemale) / $gTotal * 100);
            } else {
                $gStop1 = $gStop2 = 0;
            }
        @endphp
        @if ($gTotal > 0)
            <div class="flex items-center gap-5">
                <div class="relative shrink-0" style="width:80px;height:80px">
                    <div class="absolute inset-0 rounded-full"
                         style="background:conic-gradient(#60a5fa 0% {{ $gStop1 }}%, #f472b6 {{ $gStop1 }}% {{ $gStop2 }}%, #a78bfa {{ $gStop2 }}% 100%)"></div>
                    <div class="absolute rounded-full bg-white" style="width:48px;height:48px;top:16px;left:16px"></div>
                </div>
                <div class="space-y-1.5 text-xs flex-1">
                    @foreach ([
                        ['Man',    $gMale,   $gStop1,              '#60a5fa'],
                        ['Vrouw',  $gFemale, $gStop2 - $gStop1,    '#f472b6'],
                        ['Anders', $gOther,  100 - $gStop2,        '#a78bfa'],
                    ] as [$label, $count, $pct, $color])
                        <div class="flex items-center gap-2">
                            <span class="w-2 h-2 rounded-full shrink-0" style="background:{{ $color }}"></span>
                            <span class="text-gray-500 w-10">{{ $label }}</span>
                            <div class="flex-1 h-1 rounded-full bg-gray-100 overflow-hidden">
                                <div class="h-full rounded-full" style="width:{{ $pct }}%;background:{{ $color }}"></div>
                            </div>
                            <span class="tabular-nums text-gray-700 w-6 text-right">{{ $count }}</span>
                            <span class="tabular-nums text-gray-400 w-8 text-right">{{ $pct }}%</span>
                        </div>
                    @endforeach
                </div>
            </div>
        @else
            <p class="text-xs text-gray-300 italic">Geen profielen</p>
        @endif
    </div>

</div>



@endsection