@extends('layouts.app')
@section('title', 'لوحة الموظف')
@section('sidebar') @include('staff._sidebar') @endsection
@section('content')
<h1 class="text-xl font-bold mb-4">مرحبًا، {{ auth()->user()->name }}</h1>

<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
    @foreach([['مفتوحة', $stats['open'], 'green'], ['بانتظار الرد', $stats['pending'], 'yellow'], ['تذاكري', $stats['mine'], 'indigo'], ['غير مخصصة', $stats['unassigned'], 'red']] as [$label, $value, $color])
    <div class="bg-white rounded-xl border border-gray-200 p-4">
        <p class="text-xs text-gray-500 mb-1">{{ $label }}</p>
        <p class="text-2xl font-bold text-{{ $color }}-600">{{ $value }}</p>
    </div>
    @endforeach
</div>

<div class="bg-white rounded-xl border border-gray-200">
    <div class="px-4 py-3 border-b border-gray-100 font-medium text-sm">آخر التذاكر</div>
    <table class="w-full text-sm text-right">
        <tbody class="divide-y divide-gray-100">
            @foreach($recent as $ticket)
            <tr class="hover:bg-gray-50 cursor-pointer" onclick="location.href='{{ route('staff.tickets.show', $ticket) }}'">
                <td class="px-4 py-3 text-gray-400">{{ $ticket->ticket_number }}</td>
                <td class="px-4 py-3 font-medium">{{ $ticket->subject }}</td>
                <td class="px-4 py-3 text-gray-500">{{ $ticket->user->name }}</td>
                <td class="px-4 py-3"><span class="px-2 py-0.5 rounded text-xs status-{{ $ticket->status }}">{{ $ticket->status }}</span></td>
            </tr>
            @endforeach
        </tbody>
    </table>
</div>
@endsection