@extends('layouts.superadmin')
@section('content')
<div class="p-6 space-y-4">

  <div class="flex items-center justify-between">
    <div class="font-extrabold text-xl text-slate-900 dark:text-white">📡 Risk Radar</div>
    <a class="text-sm font-bold text-cyan-700 dark:text-cyan-200 hover:underline" href="{{ route('superadmin.prosanta.signals.index') }}">فتح الإشارات</a>
  </div>

  <div class="grid grid-cols-1 lg:grid-cols-3 gap-4">
    <div class="lg:col-span-2 rounded-2xl border border-white/10 bg-white/70 dark:bg-slate-900/70 backdrop-blur-xl p-4 shadow-lg">
      <div class="font-extrabold text-slate-800 dark:text-white mb-2">أعلى المخاطر</div>
      <div class="space-y-2">
        @forelse($topRisk as $s)
          <div class="p-3 rounded-2xl border border-slate-200/60 dark:border-white/10 bg-slate-50/70 dark:bg-white/5 flex items-start justify-between gap-3">
            <div class="min-w-0">
              <div class="font-extrabold text-slate-900 dark:text-white truncate">{{ $s->title }}</div>
              <div class="text-[11px] text-slate-500 dark:text-white/55">
                {{ $s->subject_type }}:{{ $s->subject_key }} • {{ $s->signal_type }}
              </div>
            </div>
            <span class="px-2 py-0.5 rounded-full text-[10px] font-bold ring-1 bg-rose-500/15 text-rose-200 ring-rose-400/30">
              SCORE {{ $s->risk_score }}
            </span>
          </div>
        @empty
          <div class="text-slate-500 dark:text-white/50">لا توجد بيانات.</div>
        @endforelse
      </div>
    </div>

    <div class="rounded-2xl border border-white/10 bg-white/70 dark:bg-slate-900/70 backdrop-blur-xl p-4 shadow-lg space-y-3">
      <div class="font-extrabold text-slate-800 dark:text-white">Top Types</div>
      @foreach($byType as $t)
        <div class="flex items-center justify-between p-3 rounded-2xl border border-slate-200/60 dark:border-white/10 bg-slate-50/70 dark:bg-white/5">
          <span class="font-bold text-slate-700 dark:text-white/70">{{ $t->signal_type }}</span>
          <span class="font-extrabold text-cyan-700 dark:text-cyan-200">{{ $t->c }}</span>
        </div>
      @endforeach

      <div class="pt-2 border-t border-white/10">
        <div class="font-extrabold text-slate-800 dark:text-white mb-2">By Severity</div>
        @foreach($bySeverity as $x)
          <div class="flex items-center justify-between p-2 rounded-xl bg-slate-50/70 dark:bg-white/5 border border-slate-200/60 dark:border-white/10 mb-2">
            <span class="font-bold">{{ strtoupper($x->severity) }}</span>
            <span class="font-extrabold">{{ $x->c }}</span>
          </div>
        @endforeach
      </div>
    </div>
  </div>

</div>
@endsection