@extends('layouts.admin', ['title' => 'تذاكر الدعم'])

@php
    $statusLabels = ['pending_customer' => 'بانتظار الرد', 'open' => 'مفتوحة', 'resolved' => 'تم الحل'];
@endphp

@section('content')
    <section class="ac-section">
        <div class="ac-panel">
            <div class="ac-panel-head">
                <div>
                    <h2>تذاكر الدعم الفني</h2>
                    <p>الترتيب الافتراضي يعرض التذاكر اللي محتاجة دعم أولًا.</p>
                </div>
            </div>
            <div class="ac-status-strip support-strip">
                <a class="ac-status-chip amber {{ $status === 'pending_customer' ? 'active' : '' }}" href="{{ route('admin.support-tickets.index', ['status' => 'pending_customer']) }}"><span>بانتظار الرد</span><strong>{{ $summary['pending_customer'] }}</strong></a>
                <a class="ac-status-chip blue {{ $status === 'open' ? 'active' : '' }}" href="{{ route('admin.support-tickets.index', ['status' => 'open']) }}"><span>مفتوحة</span><strong>{{ $summary['open'] }}</strong></a>
                <a class="ac-status-chip green {{ $status === 'resolved' ? 'active' : '' }}" href="{{ route('admin.support-tickets.index', ['status' => 'resolved']) }}"><span>تم الحل</span><strong>{{ $summary['resolved'] }}</strong></a>
                <a class="ac-status-chip teal {{ $status === '' ? 'active' : '' }}" href="{{ route('admin.support-tickets.index') }}"><span>كل التذاكر</span><strong>{{ $summary['total'] }}</strong></a>
            </div>
        </div>

        <form class="ac-panel ac-filter" method="GET">
            <label class="form-field"><span>بحث برقم التذكرة</span><input name="q" value="{{ $query }}" placeholder="TCK-1001 أو الموضوع أو العميل"></label>
            <label class="form-field"><span>الحالة</span><select name="status"><option value="">كل الحالات</option>@foreach($statusLabels as $value => $label)<option value="{{ $value }}" @selected($status === $value)>{{ $label }}</option>@endforeach</select></label>
            <button class="ac-btn" type="submit">تصفية</button>
        </form>

        <div class="ac-ticket-board">
            @forelse($tickets as $ticket)
                <a href="{{ route('admin.support-tickets.show', $ticket) }}" class="ac-ticket-card">
                    <div class="ac-ticket-top">
                        <span class="ac-ticket-number">{{ $ticket->ticket_number }}</span>
                        <span class="ac-badge status-{{ $ticket->status }}">{{ $statusLabels[$ticket->status] ?? $ticket->status }}</span>
                    </div>
                    <h3>{{ $ticket->subject }}</h3>
                    <div class="ac-ticket-user">
                        <span>{{ mb_strtoupper(mb_substr($ticket->user?->display_name ?? $ticket->user?->name ?? 'G', 0, 1)) }}</span>
                        <div>
                            <strong>{{ $ticket->user?->display_name ?? $ticket->user?->name ?? 'Guest' }}</strong>
                            <small>{{ $ticket->user?->email ?? 'بدون بريد' }}</small>
                        </div>
                    </div>
                    <div class="ac-ticket-foot"><small>{{ $ticket->last_activity_at?->diffForHumans() ?? $ticket->updated_at?->diffForHumans() }}</small></div>
                </a>
            @empty
                <div class="ac-empty">لا توجد تذاكر مطابقة.</div>
            @endforelse
        </div>
        <div>{{ $tickets->links() }}</div>
    </section>
@endsection