@extends('layouts.superadmin')
@section('title','عرض تقرير ProActive')
@section('page-title','📄 عرض تقرير ProActive')

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

  <div class="bg-white dark:bg-gray-900 rounded-2xl border dark:border-white/10 p-5 md:p-6 shadow">
    <div class="flex items-center justify-between">
      <div>
        <div class="text-sm text-gray-500">{{ $r->activity_date }}</div>
        <h2 class="text-xl md:text-2xl font-extrabold text-gray-900 dark:text-white">
          لايف {{ $r->live_host }} — صاحب اللايف: {{ $r->live_owner_name }}
        </h2>
      </div>
      <div class="flex items-center gap-2">
        <span class="text-xs px-2 py-0.5 rounded-full border dark:border-white/10">{{ $typeText }}</span>
        <span class="text-xs px-2 py-0.5 rounded-full border dark:border-white/10">{{ $platText }}</span>
        <span class="text-xs px-2 py-0.5 rounded-full border dark:border-white/10">الدرجة: {{ $gradeText }}</span>
      </div>
    </div>

    @if($r->live_link)
      <div class="mt-2">
        <a href="{{ $r->live_link }}" target="_blank" class="text-primary-600 hover:underline text-sm">رابط اللايف</a>
      </div>
    @endif

    <div class="mt-4 text-gray-700 dark:text-gray-200">
      <div class="font-semibold">ملخص سريع:</div>
      <div class="mt-1">{{ $r->short_summary }}</div>
    </div>

    <div class="mt-4 grid grid-cols-1 md:grid-cols-2 gap-4">
      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">التقدّم</div>
        <div class="text-sm">{{ $r->had_progress ? 'نعم' : 'لا' }}</div>
        @if($r->had_progress && $r->progress_text)
          <div class="mt-2 text-gray-700 dark:text-gray-300">{{ $r->progress_text }}</div>
        @endif
      </div>

      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">مشاكل اللايف</div>
        <div class="text-sm">{{ $r->had_issues ? 'نعم' : 'لا' }}</div>
        @if($r->had_issues && $r->issues_text)
          <div class="mt-2 text-gray-700 dark:text-gray-300">{{ $r->issues_text }}</div>
        @endif
      </div>
    </div>

    <div class="mt-4 grid grid-cols-1 md:grid-cols-2 gap-4">
      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">ملاحظات إيجابية</div>
        <div class="text-gray-700 dark:text-gray-300 whitespace-pre-line">{{ $r->positive_notes }}</div>
      </div>
      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">ملاحظات سلبية</div>
        <div class="text-gray-700 dark:text-gray-300 whitespace-pre-line">{{ $r->negative_notes ?? '—' }}</div>
      </div>
    </div>

    <div class="mt-4 grid grid-cols-1 md:grid-cols-3 gap-4">
      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">عضو من فريقنا</div>
        <div class="text-sm">{{ $r->had_team_member ? 'نعم' : 'لا' }}</div>
        @if($r->had_team_member)
          <div class="mt-2 text-gray-700 dark:text-gray-300">
            <div>الاسم: {{ $r->member_name ?? '—' }}</div>
            <div>الأداء: {{ $r->member_performance ?? '—' }}</div>
            <div>الدقائق: {{ $r->member_minutes ?? 0 }}</div>
          </div>
        @endif
      </div>

      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">مشاكل عامة</div>
        <div class="text-gray-700 dark:text-gray-300 whitespace-pre-line">{{ $r->general_issues ?? '—' }}</div>
      </div>

      <div class="rounded-xl border dark:border-white/10 p-4">
        <div class="font-semibold mb-1">أرقام إضافية</div>
        <div class="text-gray-700 dark:text-gray-300">
          <div>أصدقاء/مهتمين جدد: {{ (int)$r->new_friends }}</div>
          <div>دعوات أُرسلت: {{ (int)$r->invitations_sent }}</div>
        </div>
      </div>
    </div>

    <div class="mt-6 flex items-center justify-end gap-2">
      <a href="{{ route('superadmin.proactive.reports.index') }}" class="px-4 py-2 rounded-lg border dark:border-white/10">رجوع للأرشيف</a>
      <a href="{{ route('superadmin.proactive.report.create') }}" class="px-4 py-2 rounded-lg bg-primary-600 text-white">تسجيل تقرير جديد</a>
    </div>
  </div>

</div>
@endsection