@extends('layouts.dashboard')
@section('title', t('الدعم','Support'))
@section('page-title','💬 '.t('تذاكر الدعم','Support Tickets'))
@section('content')

<div class="stats-grid" style="grid-template-columns:repeat(3,1fr);margin-bottom:20px">
  <div class="stat-card stat-orange"><div class="stat-icon">📬</div><div class="stat-info"><div class="stat-label">{{ t('مفتوح','Open') }}</div><div class="stat-value">{{ $stats['open'] }}</div></div></div>
  <div class="stat-card stat-blue"><div class="stat-icon">💬</div><div class="stat-info"><div class="stat-label">{{ t('تم الرد','Replied') }}</div><div class="stat-value">{{ $stats['replied'] }}</div></div></div>
  <div class="stat-card stat-gray"><div class="stat-icon">🔒</div><div class="stat-info"><div class="stat-label">{{ t('مغلق','Closed') }}</div><div class="stat-value">{{ $stats['closed'] }}</div></div></div>
</div>

<div class="card">
  <div class="card-header">
    <div style="display:flex;gap:6px">
      @foreach(['open'=>t('مفتوح','Open'),'replied'=>t('تم الرد','Replied'),'closed'=>t('مغلق','Closed'),'all'=>t('الكل','All')] as $s=>$l)
      <a href="{{ request()->fullUrlWithQuery(['status'=>$s]) }}" class="btn btn-sm {{ $status===$s?'btn-primary':'btn-outline' }}">{{ $l }}</a>
      @endforeach
    </div>
    <span class="badge badge-blue">{{ $tickets->total() }}</span>
  </div>

  @forelse($tickets as $ticket)
  <div style="padding:14px 20px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:14px">
    <div style="width:40px;height:40px;border-radius:50%;background:#eff6ff;display:flex;align-items:center;justify-content:center;font-weight:700;color:#2563eb;font-size:16px;flex-shrink:0">
      {{ mb_strtoupper(mb_substr($ticket->user->name??'?',0,1,'UTF-8')) }}
    </div>
    <div style="flex:1;min-width:0">
      <div style="font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px">
        {{ $ticket->subject }}
        <span class="badge {{ $ticket->status==='open'?'badge-orange':($ticket->status==='replied'?'badge-blue':'badge-gray') }}" style="font-size:10px">
          {{ ['open'=>t('مفتوح','Open'),'replied'=>t('تم الرد','Replied'),'closed'=>t('مغلق','Closed')][$ticket->status] }}
        </span>
      </div>
      <div style="font-size:12px;color:#64748b;margin-top:2px">
        👤 {{ $ticket->user->name??'—' }} | {{ $ticket->created_at->format('Y-m-d H:i') }}
      </div>
      <div style="font-size:12px;color:#94a3b8;margin-top:2px">{{ Str::limit($ticket->message,80) }}</div>
    </div>
    <a href="{{ route('admin.tickets.show',$ticket->id) }}" class="btn btn-sm btn-primary" style="flex-shrink:0">
      {{ $ticket->status==='open' ? '💬 '.t('رد','Reply') : '👁️ '.t('عرض','View') }}
    </a>
  </div>
  @empty
  <p style="text-align:center;padding:32px;color:#94a3b8">{{ t('لا يوجد تذاكر','No tickets') }}</p>
  @endforelse
  @if($tickets->hasPages())<div style="padding:16px">{{ $tickets->withQueryString()->links() }}</div>@endif
</div>
@endsection