@extends('layouts.superadmin')
@section('title','غرفة رولا — الدعم المعنوي')
@section('page-title','🤝 الدعم المعنوي — صبايا التيم')

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

  {{-- ملخص سريع --}}
  <div class="grid grid-cols-2 md:grid-cols-3 gap-4">
    <x-stat title="إجمالي الصبايا" value="{{ number_format($summary['girls_total'] ?? 0) }}" color="pink"/>
    <x-stat title="نشاط آخر 24 ساعة" value="{{ number_format($summary['active_24h'] ?? 0) }}" color="emerald"/>
    <x-stat title="متوسط دقائق (7 أيام)" value="{{ number_format($summary['avg_minutes7'] ?? 0,1) }} د" color="cyan"/>
  </div>

  @php
    $sections = [
      ['key'=>'needs_warm',  'title'=>'💌 بحاجة تواصل لطيف',       'color'=>'from-rose-50 to-rose-100'],
      ['key'=>'returning',   'title'=>'🌱 عائدة بعد انقطاع',       'color'=>'from-emerald-50 to-emerald-100'],
      ['key'=>'appreciate',  'title'=>'👏 تستحق تقدير',            'color'=>'from-amber-50 to-amber-100'],
      ['key'=>'consistent',  'title'=>'📅 انضباط مستمر',           'color'=>'from-violet-50 to-violet-100'],
    ];
  @endphp

  @foreach($sections as $sec)
    @php $items = $cards[$sec['key']] ?? collect(); @endphp
    <div class="bg-white dark:bg-gray-900 rounded-xl border border-gray-100 dark:border-gray-700 p-4 space-y-3">
      <div class="flex items-center justify-between">
        <h3 class="font-bold">{{ $sec['title'] }}</h3>
        <div class="text-xs text-gray-500">الأسبوع: {{ $period[0] }} → {{ $period[1] }}</div>
      </div>

      @if($items->isEmpty())
        <div class="text-sm text-gray-500">لا يوجد مرشحات لهذا القسم.</div>
      @else
        <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-3">
          @foreach($items as $i)
          <div class="rounded-xl p-4 bg-gradient-to-br {{ $sec['color'] }} border-r-4 border-gray-300">
            <div class="flex items-center justify-between gap-2">
              <div class="min-w-0">
                <div class="font-bold truncate">{{ $i->name }}</div>
                <div class="text-xs text-gray-600 dark:text-gray-300 truncate">{{ $i->username ?? '—' }}</div>
              </div>
              <span class="px-2 py-1 rounded text-xs bg-black/5 dark:bg-white/10">{{ $i->badge }}</span>
            </div>

            <div class="mt-3 text-2xl font-extrabold text-gray-900 dark:text-white">
              {{ $i->metric }}
            </div>

            <p class="mt-2 text-sm text-gray-700 dark:text-gray-300">{{ $i->hint }}</p>

            @if(Route::has('superadmin.admin-messages.index'))
              <div class="mt-3">
                <a href="{{ route('superadmin.admin-messages.index', ['to'=>$i->id]) }}"
                   class="inline-flex items-center gap-2 px-3 py-1.5 rounded bg-primary-600 text-white text-xs hover:bg-primary-700">
                  ✉️ إرسال رسالة تشجيع
                </a>
              </div>
            @endif
          </div>
          @endforeach
        </div>
      @endif
    </div>
  @endforeach

  <div class="text-xs text-gray-500 dark:text-gray-400">
    * تُحسب الترشيحات تلقائيًا من التواجد، النقاط، الغياب، المخالفات — مجرد مؤشرات للعمل الإنساني اللطيف 💗
  </div>
</div>
@endsection