@extends('layouts.superadmin')
@section('title', 'جدول ساعات الأعضاء')

@section('content')
<div class="min-h-screen bg-gradient-to-b from-slate-950 via-slate-900 to-black py-6 sm:py-8 rtl">
  <div class="max-w-7xl mx-auto px-3 sm:px-4 lg:px-6 space-y-6">

    {{-- ✅ HERO (Socratic Style) --}}
    <div class="relative overflow-hidden rounded-3xl bg-gradient-to-br from-slate-900/95 via-slate-900/98 to-black/98 border border-sky-400/25 shadow-2xl shadow-sky-500/10">
      <div class="pointer-events-none absolute -top-24 -right-10 w-72 h-72 rounded-full bg-sky-400/20 blur-3xl"></div>
      <div class="pointer-events-none absolute -bottom-28 -left-16 w-80 h-80 rounded-full bg-indigo-500/18 blur-3xl"></div>
      <div class="pointer-events-none absolute top-10 left-10 w-64 h-64 rounded-full bg-fuchsia-500/10 blur-3xl"></div>

      <div class="relative p-5 sm:p-7 lg:p-8 flex flex-col lg:flex-row lg:items-center lg:justify-between gap-6">
        <div class="space-y-3 max-w-2xl">
          <div class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-black/40 border border-sky-300/25 text-[11px] text-sky-100">
            <i class="fa-solid fa-chart-column text-xs"></i>
            <span>غرفة المؤشرات — جدول ساعات الأعضاء • SuperAdmin</span>
          </div>

          <h1 class="text-2xl sm:text-3xl font-extrabold text-white tracking-tight">
            جدول ساعات <span class="text-sky-300">الأعضاء</span>
          </h1>

          <p class="text-[12px] sm:text-[14px] text-slate-200/85 leading-relaxed">
            يعرض ساعات اللايفات المؤكدة + ساعات القستات (Guest) مع مقارنة ونِسَب وأهداف — بدون ما نلمس خوارزمياتك، فقط عرض ملحمي واضح.
          </p>

          <div class="flex flex-wrap gap-2 pt-1">
            <span class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/5 border border-white/10 text-[11px] text-white/80">
              <span class="w-1.5 h-1.5 rounded-full bg-emerald-400"></span>
              لايفات مؤكدة: {{ $liveKpis['confirmed'] ?? 0 }}
            </span>
            <span class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/5 border border-white/10 text-[11px] text-white/80">
              <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span>
              غير محسوم: {{ $liveKpis['pending'] ?? 0 }}
            </span>
            <span class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/5 border border-white/10 text-[11px] text-white/80">
              <span class="w-1.5 h-1.5 rounded-full bg-cyan-400"></span>
              سجلات قست: {{ $guestKpis['records'] ?? 0 }}
            </span>
          </div>
        </div>

        <div class="w-full lg:w-auto space-y-2">
          <div class="rounded-2xl bg-black/40 border border-white/15 px-4 py-3 text-xs text-slate-100 space-y-2">
            <div class="flex items-center gap-2">
              <div class="w-9 h-9 rounded-xl bg-sky-500/20 text-sky-200 grid place-items-center">
                <i class="fa-regular fa-calendar"></i>
              </div>
              <div class="min-w-0">
                <div class="text-[11px] text-slate-300/80">الفترة</div>
                <div class="font-extrabold text-sm truncate">{{ $from }} → {{ $to }}</div>
              </div>
            </div>

            @if($compare_enabled)
              <div class="flex items-center gap-2">
                <div class="w-9 h-9 rounded-xl bg-indigo-500/15 text-indigo-200 grid place-items-center">
                  <i class="fa-solid fa-code-compare"></i>
                </div>
                <div class="min-w-0">
                  <div class="text-[11px] text-slate-300/80">المقارنة</div>
                  <div class="font-extrabold text-sm truncate">{{ $compare_from }} → {{ $compare_to }}</div>
                </div>
              </div>
            @endif

            <a href="{{ route('superadmin.falcon-room.lives-new.confirm') }}"
               class="inline-flex w-full items-center justify-center gap-2 px-4 py-2 rounded-2xl text-xs font-bold text-slate-900
                      bg-gradient-to-r from-sky-200 via-fuchsia-200 to-emerald-200 shadow-lg shadow-sky-500/15 hover:scale-[1.01] active:scale-100 transition">
              <i class="fa-solid fa-arrow-right-long text-[11px]"></i>
              رجوع للتأكيد
            </a>
          </div>
        </div>
      </div>
    </div>

    {{-- ✅ FILTERS (Socratic Card) --}}
    <details class="rounded-3xl border border-white/10 bg-slate-950/70 overflow-hidden shadow-xl md:open">
      <summary class="cursor-pointer list-none px-4 sm:px-6 py-4 flex items-center justify-between border-b border-white/10">
        <div class="flex items-center gap-2 text-white/90">
          <span class="w-9 h-9 rounded-2xl bg-fuchsia-500/15 border border-fuchsia-400/25 grid place-items-center text-fuchsia-200">
            <i class="fa-solid fa-filter text-[12px]"></i>
          </span>
          <div>
            <div class="text-[11px] text-white/60">فلترة</div>
            <div class="font-extrabold text-sm">فلاتر البحث + الأهداف</div>
          </div>
        </div>
        <i class="fa-solid fa-chevron-down text-white/50 text-xs group-open:rotate-180 transition-transform"></i>
      </summary>

      <form method="GET" class="px-4 sm:px-6 py-4 space-y-4">

        {{-- Filters --}}
        <div class="grid grid-cols-1 md:grid-cols-6 gap-3">
          @php
            $inp = 'w-full rounded-xl bg-black/40 border border-white/15 px-3 py-2 text-sm text-slate-50 focus:outline-none focus:ring-2 focus:ring-sky-500/35';
            $lbl = 'block text-[10px] font-bold text-slate-300/80 mb-1';
          @endphp

          <div>
            <label class="{{ $lbl }}">من</label>
            <input type="date" name="from" value="{{ $from }}" class="{{ $inp }}">
          </div>

          <div>
            <label class="{{ $lbl }}">إلى</label>
            <input type="date" name="to" value="{{ $to }}" class="{{ $inp }}">
          </div>

          <div>
            <label class="{{ $lbl }}">المقارنة</label>
            <select name="compare_mode" class="{{ $inp }}">
              <option value="none" {{ $compare_mode==='none'?'selected':'' }}>بدون</option>
              <option value="prev_month" {{ $compare_mode==='prev_month'?'selected':'' }}>مع الشهر السابق</option>
              <option value="custom" {{ $compare_mode==='custom'?'selected':'' }}>فترة مخصّصة</option>
            </select>
          </div>

          <div>
            <label class="{{ $lbl }}">من (مقارنة)</label>
            <input type="date" name="compare_from" value="{{ $compare_from }}" class="{{ $inp }}">
          </div>

          <div>
            <label class="{{ $lbl }}">إلى (مقارنة)</label>
            <input type="date" name="compare_to" value="{{ $compare_to }}" class="{{ $inp }}">
          </div>

          <div>
            <label class="{{ $lbl }}">نوع اللايف</label>
            <select name="live_type" class="{{ $inp }}">
              <option value="" {{ $live_type===''?'selected':'' }}>الكل</option>
              <option value="guests" {{ $live_type==='guests'?'selected':'' }}>قستات</option>
              <option value="tours"  {{ $live_type==='tours'?'selected':'' }}>تحديات/جولات</option>
              <option value="both"   {{ $live_type==='both'?'selected':'' }}>كلاهما</option>
            </select>
          </div>

          <div>
            <label class="{{ $lbl }}">السهرات</label>
            <select name="sahra_mode" class="{{ $inp }}">
              <option value="include" {{ $sahra_mode==='include'?'selected':'' }}>شامل</option>
              <option value="exclude" {{ $sahra_mode==='exclude'?'selected':'' }}>استبعاد السهرات</option>
              <option value="only"    {{ $sahra_mode==='only'?'selected':'' }}>سهرات فقط</option>
            </select>
          </div>

          <div>
            <label class="{{ $lbl }}">ترتيب حسب</label>
            <select name="sort" class="{{ $inp }}">
              <option value="total" {{ $sort==='total'?'selected':'' }}>الإجمالي</option>
              <option value="live"  {{ $sort==='live'?'selected':'' }}>ساعات اللايفات</option>
              <option value="guest" {{ $sort==='guest'?'selected':'' }}>ساعات القستات</option>
              <option value="sahra" {{ $sort==='sahra'?'selected':'' }}>ساعات السهرات</option>
            </select>
          </div>

          <div>
            <label class="{{ $lbl }}">الاتجاه</label>
            <select name="dir" class="{{ $inp }}">
              <option value="desc" {{ $dir==='desc'?'selected':'' }}>الأعلى</option>
              <option value="asc"  {{ $dir==='asc'?'selected':'' }}>الأقل</option>
            </select>
          </div>

          <div class="md:col-span-2 flex flex-col justify-end gap-2">
            <label class="flex items-center gap-2 text-sm text-white/80">
              <input type="checkbox" name="show_growth" value="1" {{ $show_growth ? 'checked' : '' }}>
              عرض نسبة التغير (مقارنة)
            </label>
            <label class="flex items-center gap-2 text-sm text-white/80">
              <input type="checkbox" name="show_share" value="1" {{ $show_share ? 'checked' : '' }}>
              عرض النسبة من الإجمالي
            </label>
          </div>

          <div class="md:col-span-2 flex flex-col justify-end gap-2">
            <label class="flex items-center gap-2 text-sm text-white/80">
              <input type="checkbox" name="show_sahra_col" value="1" {{ $show_sahra_col ? 'checked' : '' }}>
              إظهار عمود السهرات
            </label>
            <label class="flex items-center gap-2 text-sm text-white/80">
              <input type="checkbox" name="include_zero" value="1" {{ $include_zero ? 'checked' : '' }}>
              إظهار الأعضاء حتى لو 0 ساعات
            </label>
          </div>
        </div>

        {{-- Goals --}}
        <div class="pt-1">
          <div class="text-[11px] font-extrabold text-emerald-200/80 px-1 mb-2">الأهداف</div>
          <div class="grid grid-cols-1 md:grid-cols-6 gap-3">
            <div>
              <label class="{{ $lbl }}">هدف/عضو (لايف)</label>
              <input type="number" step="0.01" name="goal_live" value="{{ $goal_live }}" placeholder="مثال: 10" class="{{ $inp }}">
            </div>
            <div>
              <label class="{{ $lbl }}">هدف/عضو (قست)</label>
              <input type="number" step="0.01" name="goal_guest" value="{{ $goal_guest }}" placeholder="مثال: 5" class="{{ $inp }}">
            </div>
            <div>
              <label class="{{ $lbl }}">هدف/عضو (مجموع)</label>
              <input type="number" step="0.01" name="goal_total" value="{{ $goal_total }}" placeholder="مثال: 12" class="{{ $inp }}">
            </div>
            <div>
              <label class="{{ $lbl }}">هدف الفريق (لايف)</label>
              <input type="number" step="0.01" name="team_goal_live" value="{{ $teamGoals['team_goal_live'] }}" class="{{ $inp }}">
            </div>
            <div>
              <label class="{{ $lbl }}">هدف الفريق (قست)</label>
              <input type="number" step="0.01" name="team_goal_guest" value="{{ $teamGoals['team_goal_guest'] }}" class="{{ $inp }}">
            </div>
            <div>
              <label class="{{ $lbl }}">هدف الفريق (مجموع)</label>
              <input type="number" step="0.01" name="team_goal_total" value="{{ $teamGoals['team_goal_total'] }}" class="{{ $inp }}">
            </div>
          </div>
        </div>

        {{-- Actions --}}
        <div class="flex flex-wrap gap-2 pt-2">
          <button class="inline-flex items-center gap-2 px-4 py-2 rounded-2xl text-xs font-bold text-slate-900
                         bg-gradient-to-r from-fuchsia-200 via-cyan-200 to-emerald-200 shadow-lg shadow-fuchsia-500/15 hover:scale-[1.01] active:scale-100 transition">
            <i class="fa-solid fa-magnifying-glass"></i>
            عرض
          </button>

          <a href="{{ route('superadmin.falcon-room.lives-new.members-hours') }}"
             class="inline-flex items-center gap-2 px-4 py-2 rounded-2xl bg-white/10 border border-white/15 text-white/90 text-xs hover:bg-white/15 transition">
            <i class="fa-solid fa-rotate-right"></i>
            إعادة تعيين
          </a>

          <button type="button"
                  class="inline-flex items-center gap-2 px-4 py-2 rounded-2xl bg-emerald-600/90 border border-emerald-400/20 text-white text-xs hover:bg-emerald-600 transition"
                  onclick="copyWa()">
            <i class="fa-solid fa-copy"></i>
            نسخ نص واتساب
          </button>

          <button type="button"
                  class="inline-flex items-center gap-2 px-4 py-2 rounded-2xl bg-green-600/90 border border-green-400/20 text-white text-xs hover:bg-green-600 transition"
                  onclick="openWa()">
            <i class="fa-brands fa-whatsapp"></i>
            فتح واتساب
          </button>
        </div>

        <textarea id="waText" class="hidden">{{ $waMessage }}</textarea>
      </form>
    </details>

    {{-- ✅ KPIs (Socratic Cards) --}}
    <div class="grid gap-4 lg:grid-cols-4">
      <div class="relative overflow-hidden rounded-3xl bg-gradient-to-br from-emerald-600/10 via-slate-950 to-slate-950 border border-emerald-400/20 shadow-xl p-5">
        <div class="pointer-events-none absolute -top-16 -left-10 w-44 h-44 rounded-full bg-emerald-400/10 blur-3xl"></div>
        <div class="flex items-center gap-3">
          <div class="w-10 h-10 rounded-2xl bg-emerald-500/15 border border-emerald-400/25 grid place-items-center text-emerald-200">
            <i class="fa-solid fa-video"></i>
          </div>
          <div>
            <div class="text-[11px] text-slate-300/80">لايفات مؤكدة (ساعات)</div>
            <div class="text-2xl font-extrabold text-emerald-200">{{ $totals['live_hours'] }}</div>
            <div class="mt-1 text-[11px] text-white/50">
              عدد: {{ $liveKpis['confirmed'] ?? 0 }} • غير محسوم: {{ $liveKpis['pending'] ?? 0 }}
            </div>
          </div>
        </div>
      </div>

      <div class="relative overflow-hidden rounded-3xl bg-gradient-to-br from-sky-600/10 via-slate-950 to-slate-950 border border-sky-400/20 shadow-xl p-5">
        <div class="pointer-events-none absolute -top-16 -right-10 w-44 h-44 rounded-full bg-sky-400/10 blur-3xl"></div>
        <div class="flex items-center gap-3">
          <div class="w-10 h-10 rounded-2xl bg-sky-500/15 border border-sky-400/25 grid place-items-center text-sky-200">
            <i class="fa-solid fa-people-group"></i>
          </div>
          <div>
            <div class="text-[11px] text-slate-300/80">قستات (Guest) — ساعات</div>
            <div class="text-2xl font-extrabold text-sky-200">{{ $totals['guest_hours'] }}</div>
            <div class="mt-1 text-[11px] text-white/50">سجلات: {{ $guestKpis['records'] ?? 0 }}</div>
          </div>
        </div>
      </div>

      <div class="relative overflow-hidden rounded-3xl bg-gradient-to-br from-indigo-600/10 via-slate-950 to-slate-950 border border-indigo-400/20 shadow-xl p-5">
        <div class="pointer-events-none absolute -top-16 -left-10 w-44 h-44 rounded-full bg-indigo-400/10 blur-3xl"></div>
        <div class="flex items-center gap-3">
          <div class="w-10 h-10 rounded-2xl bg-indigo-500/15 border border-indigo-400/25 grid place-items-center text-indigo-200">
            <i class="fa-solid fa-layer-group"></i>
          </div>
          <div>
            <div class="text-[11px] text-slate-300/80">الإجمالي — ساعات</div>
            <div class="text-2xl font-extrabold text-indigo-200">{{ $totals['total_hours'] }}</div>
            <div class="mt-1 text-[11px] text-white/50">أعضاء ظاهرين: {{ $totals['members'] }}</div>
          </div>
        </div>
      </div>

      <div class="relative overflow-hidden rounded-3xl bg-gradient-to-br from-amber-600/10 via-slate-950 to-slate-950 border border-amber-400/20 shadow-xl p-5">
        <div class="pointer-events-none absolute -top-16 -right-10 w-44 h-44 rounded-full bg-amber-400/10 blur-3xl"></div>
        <div class="flex items-center gap-3">
          <div class="w-10 h-10 rounded-2xl bg-amber-500/15 border border-amber-400/25 grid place-items-center text-amber-200">
            <i class="fa-solid fa-moon"></i>
          </div>
          <div>
            <div class="text-[11px] text-slate-300/80">السهرات — ساعات</div>
            <div class="text-2xl font-extrabold text-amber-200">{{ $totals['sahra_hours'] }}</div>
            <div class="mt-1 text-[11px] text-white/50">(من ضمن اللايفات المؤكدة)</div>
          </div>
        </div>
      </div>
    </div>

    {{-- ✅ TABLE (Socratic Card) --}}
    <div class="rounded-3xl border border-white/10 bg-slate-950/70 overflow-hidden shadow-xl">
      <div class="px-4 sm:px-6 py-4 border-b border-white/10 flex items-center justify-between gap-3">
        <div>
          <h2 class="text-sm sm:text-base font-extrabold text-cyan-200">الترتيب التفصيلي</h2>
          <p class="text-[11px] sm:text-xs text-slate-300/80 mt-1">ساعات اللايف / القست / الإجمالي مع مؤشرات الهدف والتغير.</p>
        </div>
      </div>

      <div class="overflow-x-auto">
        <table class="min-w-full text-sm">
          <thead class="bg-white/5">
            <tr class="text-white/60 text-[11px] font-semibold">
              <th class="text-right px-4 py-3">#</th>
              <th class="text-right px-4 py-3">العضو</th>
              <th class="text-center px-4 py-3">ساعات اللايفات</th>
              @if($show_sahra_col)
                <th class="text-center px-4 py-3">ساعات السهرات</th>
              @endif
              <th class="text-center px-4 py-3">ساعات القستات</th>
              <th class="text-center px-4 py-3">الإجمالي</th>
            </tr>
          </thead>

          <tbody class="divide-y divide-white/5">
            @forelse($rows as $i => $r)
              <tr class="text-white/80 hover:bg-white/5 transition">
                <td class="px-4 py-3 text-right text-white/50 font-bold">{{ $i+1 }}</td>

                <td class="px-4 py-3">
                  <div class="flex items-center gap-3">
                    <div class="w-10 h-10 rounded-full overflow-hidden border border-white/10 bg-white/5">
                      @if(!empty($r['avatar']))
                        <img src="{{ $r['avatar'] }}" class="w-full h-full object-cover" alt="">
                      @else
                        <div class="w-full h-full flex items-center justify-center text-xs text-white/40">
                          <i class="fa-regular fa-user"></i>
                        </div>
                      @endif
                    </div>
                    <div class="min-w-0">
                      <div class="text-sm font-extrabold text-white truncate">
                        {{ $r['name'] }}
                        <span class="text-[11px] text-white/40">#{{ $r['id'] }}</span>
                      </div>
                      <div class="text-[11px] text-white/40 truncate">
                        {{ $r['username'] ? '@'.$r['username'] : '' }}
                      </div>
                    </div>
                  </div>
                </td>

                {{-- Live --}}
                <td class="px-4 py-3 text-center align-top">
                  <div class="font-extrabold text-emerald-200">{{ number_format($r['live_hours'], 2) }} س</div>
                  <div class="text-[11px] text-white/45">
                    عدد: {{ $r['live_count'] }}
                    @if($show_share) • {{ $r['share_live'] ?? 0 }}% @endif
                  </div>

                  @if($compare_enabled)
                    <div class="text-[11px] mt-1">
                      <span class="{{ ($r['delta_live'] ?? 0) >= 0 ? 'text-emerald-300' : 'text-rose-300' }}">
                        Δ {{ number_format($r['delta_live'] ?? 0, 2) }}س
                      </span>
                      @if($show_growth && !is_null($r['pct_live']))
                        <span class="text-white/40"> ({{ $r['pct_live'] }}%)</span>
                      @endif
                    </div>
                  @endif

                  @if($goal_live > 0)
                    @php $pct = min(100, ($r['live_hours'] / $goal_live) * 100); @endphp
                    <div class="mt-2">
                      <div class="h-2 rounded-full bg-white/10 overflow-hidden">
                        <div class="h-2 bg-emerald-500" style="width: {{ $pct }}%"></div>
                      </div>
                      <div class="text-[11px] text-white/45 mt-1">
                        هدف: {{ $goal_live }}س
                        @if($r['hit_live'] === true)
                          <span class="text-emerald-300 font-bold">✅</span>
                        @elseif($r['hit_live'] === false)
                          <span class="text-amber-300 font-bold">⏳</span>
                        @endif
                      </div>
                    </div>
                  @endif
                </td>

                {{-- Sahra --}}
                @if($show_sahra_col)
                  <td class="px-4 py-3 text-center align-top">
                    <div class="font-extrabold text-amber-200">{{ number_format($r['sahra_hours'], 2) }} س</div>
                    @if($show_share)
                      <div class="text-[11px] text-white/45">{{ $r['share_sahra'] ?? 0 }}%</div>
                    @endif
                  </td>
                @endif

                {{-- Guest --}}
                <td class="px-4 py-3 text-center align-top">
                  <div class="font-extrabold text-sky-200">{{ number_format($r['guest_hours'], 2) }} س</div>
                  <div class="text-[11px] text-white/45">
                    سجلات: {{ $r['guest_count'] }}
                    @if($show_share) • {{ $r['share_guest'] ?? 0 }}% @endif
                  </div>

                  @if($compare_enabled)
                    <div class="text-[11px] mt-1">
                      <span class="{{ ($r['delta_guest'] ?? 0) >= 0 ? 'text-emerald-300' : 'text-rose-300' }}">
                        Δ {{ number_format($r['delta_guest'] ?? 0, 2) }}س
                      </span>
                      @if($show_growth && !is_null($r['pct_guest']))
                        <span class="text-white/40"> ({{ $r['pct_guest'] }}%)</span>
                      @endif
                    </div>
                  @endif

                  @if($goal_guest > 0)
                    @php $pct = min(100, ($r['guest_hours'] / $goal_guest) * 100); @endphp
                    <div class="mt-2">
                      <div class="h-2 rounded-full bg-white/10 overflow-hidden">
                        <div class="h-2 bg-sky-500" style="width: {{ $pct }}%"></div>
                      </div>
                      <div class="text-[11px] text-white/45 mt-1">
                        هدف: {{ $goal_guest }}س
                        @if($r['hit_guest'] === true)
                          <span class="text-emerald-300 font-bold">✅</span>
                        @elseif($r['hit_guest'] === false)
                          <span class="text-amber-300 font-bold">⏳</span>
                        @endif
                      </div>
                    </div>
                  @endif
                </td>

                {{-- Total --}}
                <td class="px-4 py-3 text-center align-top">
                  <div class="font-extrabold text-indigo-200">{{ number_format($r['total_hours'], 2) }} س</div>
                  @if($show_share)
                    <div class="text-[11px] text-white/45">{{ $r['share_total'] ?? 0 }}%</div>
                  @endif

                  @if($compare_enabled)
                    <div class="text-[11px] mt-1">
                      <span class="{{ ($r['delta_total'] ?? 0) >= 0 ? 'text-emerald-300' : 'text-rose-300' }}">
                        Δ {{ number_format($r['delta_total'] ?? 0, 2) }}س
                      </span>
                      @if($show_growth && !is_null($r['pct_total']))
                        <span class="text-white/40"> ({{ $r['pct_total'] }}%)</span>
                      @endif
                    </div>
                  @endif

                  @if($goal_total > 0)
                    @php $pct = min(100, ($r['total_hours'] / $goal_total) * 100); @endphp
                    <div class="mt-2">
                      <div class="h-2 rounded-full bg-white/10 overflow-hidden">
                        <div class="h-2 bg-indigo-500" style="width: {{ $pct }}%"></div>
                      </div>
                      <div class="text-[11px] text-white/45 mt-1">
                        هدف: {{ $goal_total }}س
                        @if($r['hit_total'] === true)
                          <span class="text-emerald-300 font-bold">✅</span>
                        @elseif($r['hit_total'] === false)
                          <span class="text-amber-300 font-bold">⏳</span>
                        @endif
                      </div>
                    </div>
                  @endif
                </td>
              </tr>
            @empty
              <tr>
                <td colspan="{{ $show_sahra_col ? 6 : 5 }}" class="px-4 py-10 text-center text-sm text-white/50">
                  لا يوجد بيانات ضمن الفترة المحددة والفلاتر الحالية.
                </td>
              </tr>
            @endforelse
          </tbody>
        </table>
      </div>
    </div>

  </div>
</div>

<script>
function copyWa(){
  const t = document.getElementById('waText')?.value || '';
  if(!t){ alert('لا يوجد نص'); return; }
  navigator.clipboard.writeText(t).then(()=>alert('تم نسخ نص الواتساب ✅')).catch(()=>alert('تعذر النسخ'));
}
function openWa(){
  const t = document.getElementById('waText')?.value || '';
  if(!t){ alert('لا يوجد نص'); return; }
  const url = 'https://wa.me/?text=' + encodeURIComponent(t);
  window.open(url, '_blank');
}
</script>
@endsection