@extends('layouts.superadmin')

@section('title','خطة الإنعاش — متابعة صقر للشباب')
@section('page-title','خطة الإنعاش — متابعة صقر للشباب')

@section('content')
<div class="space-y-6">

  {{-- ملخص سريع --}}
  <div class="bg-white dark:bg-gray-800 rounded-xl shadow p-5">
    <h2 class="text-xl font-bold text-gray-800 dark:text-white mb-4">📈 ملخص حالة الشباب</h2>
    <div class="grid grid-cols-2 sm:grid-cols-4 gap-3 text-center">
      <div class="p-3 bg-blue-50 dark:bg-blue-900/20 rounded">
        <div class="text-gray-500 text-sm">إجمالي الأعضاء</div>
        <div class="text-2xl font-bold text-blue-700 dark:text-blue-300">{{ $summary['count'] ?? 0 }}</div>
      </div>
      <div class="p-3 bg-emerald-50 dark:bg-emerald-900/20 rounded">
        <div class="text-gray-500 text-sm">النشطون</div>
        <div class="text-2xl font-bold text-emerald-700 dark:text-emerald-300">{{ $summary['active'] ?? 0 }}</div>
      </div>
      <div class="p-3 bg-amber-50 dark:bg-amber-900/20 rounded">
        <div class="text-gray-500 text-sm">الضعفاء</div>
        <div class="text-2xl font-bold text-amber-700 dark:text-amber-300">{{ $summary['weak'] ?? 0 }}</div>
      </div>
      <div class="p-3 bg-rose-50 dark:bg-rose-900/20 rounded">
        <div class="text-gray-500 text-sm">المنقطعين</div>
        <div class="text-2xl font-bold text-rose-700 dark:text-rose-300">{{ $summary['inactive'] ?? 0 }}</div>
      </div>
    </div>
  </div>

  {{-- بطاقات الإنعاش --}}
  <div class="bg-white dark:bg-gray-800 rounded-xl shadow p-5">
    <h3 class="font-bold text-lg mb-4 text-gray-800 dark:text-white">🧭 الأعضاء المستهدفون بالإنعاش</h3>

    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
      @forelse($revivalList as $r)
        <div class="p-4 rounded-xl border border-gray-100 dark:border-gray-700 bg-gradient-to-br from-gray-50 to-white dark:from-gray-900 dark:to-gray-800 shadow-sm hover:shadow-md transition">
          <div class="flex items-center justify-between">
            <h4 class="font-bold text-gray-900 dark:text-white truncate">{{ $r['name'] }}</h4>
            <span class="text-xs bg-rose-500/20 text-rose-600 dark:text-rose-300 px-2 py-0.5 rounded">
              {{ $r['category'] }}
            </span>
          </div>
          <p class="text-xs text-gray-500 mt-1">آخر تواجد: {{ $r['last_seen'] ? \Carbon\Carbon::parse($r['last_seen'])->diffForHumans() : 'غير محدد' }}</p>

          <div class="mt-3 space-y-1 text-sm text-gray-700 dark:text-gray-300">
            <div>⏱️ دقائق: <b>{{ $r['minutes'] }}</b></div>
            <div>🚫 غياب غير مبرر: <b class="text-rose-500">{{ $r['abs_unexcused'] }}</b></div>
            <div>⭐ نقاط: <b>{{ $r['points'] }}</b></div>
          </div>

          <details class="mt-3 group">
            <summary class="cursor-pointer text-sm font-semibold text-emerald-600 dark:text-emerald-400">
              🩺 خطة الإنعاش المقترحة
            </summary>
            <div class="mt-2 text-sm text-gray-600 dark:text-gray-300 leading-relaxed">
              <ul class="list-disc pr-5 space-y-1">
                @foreach($r['plan'] as $p)
                  <li>{{ $p }}</li>
                @endforeach
              </ul>
            </div>
          </details>
        </div>
      @empty
        <div class="col-span-full text-center text-gray-500 py-10">✅ لا يوجد أعضاء بحاجة لإنعاش حاليًا!</div>
      @endforelse
    </div>
  </div>

  {{-- توضيح --}}
  <div class="text-xs text-gray-500 dark:text-gray-400 leading-relaxed">
    ⚙️ يعتمد النظام على تحليل أسبوعي لنشاط العضو (الدقائق، النقاط، الغياب)، ويُصنَّف العضو تلقائيًا كـ <b>ضعيف</b> أو <b>منقطع</b> عند تجاوز عتبات محددة.  
    🧠 <b>خطة الإنعاش</b> تولَّد تلقائيًا وتشمل دعم معنوي، تواصل مباشر، متابعة بالجلسات، وتشجيع بالأهداف.
  </div>
</div>
@endsection