@extends('layouts.admin', ['title' => 'Support'])

@section('admin-content')
<section class="space-y-6">
    <div class="rounded-[2rem] border border-white/10 bg-slate-900/70 p-6">
        <h1 class="font-display text-3xl font-bold text-white">Support tickets</h1>
        <div class="mt-6 grid gap-4 sm:grid-cols-3">
            <div class="rounded-2xl border border-white/10 bg-white/5 p-4"><div class="text-sm text-slate-400">Open</div><div class="mt-2 text-2xl font-bold text-white">{{ $summary['open'] }}</div></div>
            <div class="rounded-2xl border border-white/10 bg-white/5 p-4"><div class="text-sm text-slate-400">Pending</div><div class="mt-2 text-2xl font-bold text-white">{{ $summary['pending'] }}</div></div>
            <div class="rounded-2xl border border-white/10 bg-white/5 p-4"><div class="text-sm text-slate-400">Closed</div><div class="mt-2 text-2xl font-bold text-white">{{ $summary['closed'] }}</div></div>
        </div>
    </div>
    <div class="space-y-4">
        @foreach ($tickets as $ticket)
            <div class="rounded-[2rem] border border-white/10 bg-slate-900/70 p-6">
                <div class="flex flex-wrap items-center justify-between gap-4">
                    <div>
                        <h2 class="font-display text-xl font-semibold text-white">{{ $ticket->subject }}</h2>
                        <p class="mt-2 text-sm text-slate-300">{{ $ticket->message }}</p>
                    </div>
                    <div class="text-right text-sm text-slate-400">
                        <div>{{ ucfirst($ticket->status) }}</div>
                        <div>{{ ucfirst($ticket->priority) }}</div>
                    </div>
                </div>
            </div>
        @endforeach
        <div>{{ $tickets->links() }}</div>
    </div>
</section>
@endsection