@extends('layouts.dashboard')
@section('title','اشتراكي')
@section('page-title','🔑 اشتراكي')

@section('content')
@if($subscription)
<div class="license-card">
  <div style="font-size:16px;font-weight:700">مفتاح اللايسنس</div>
  <div class="license-key-display">
    <span>{{ $subscription['license_key'] }}</span>
    <button class="copy-btn" onclick="navigator.clipboard.writeText('{{ $subscription['license_key'] }}').then(()=>toast('✅ تم النسخ!'))">📋 نسخ</button>
  </div>
</div>

<div class="card" style="background:#fff;border-radius:10px;padding:24px;border:1px solid #e2e8f0;margin-bottom:20px">
  <h3 style="font-weight:700;margin-bottom:16px">تفاصيل الاشتراك</h3>
  <table class="data-table">
    <tr><td><strong>الباقة</strong></td><td><span class="badge badge-blue">{{ $subscription['plan_name'] }}</span></td></tr>
    <tr><td><strong>الحالة</strong></td><td><span class="badge badge-{{ $subscription['status']==='active'?'green':'red' }}">{{ $subscription['status']==='active'?'✅ نشط':'⛔ موقوف' }}</span></td></tr>
    <tr><td><strong>المواقع المسموحة</strong></td><td>{{ $subscription['sites_allowed'] }} موقع</td></tr>
    <tr><td><strong>تاريخ الانتهاء</strong></td><td>{{ $subscription['expires_at']??'مدى الحياة ♾️' }}</td></tr>
  </table>
</div>

<div class="card" style="background:#fff;border-radius:10px;padding:24px;border:1px solid #e2e8f0">
  <h3 style="font-weight:700;margin-bottom:16px">المواقع المفعّل عليها</h3>
  <div style="overflow-x:auto">
  <table class="data-table">
    <thead><tr><th>الدومين</th><th>تاريخ التفعيل</th><th>آخر تحقق</th></tr></thead>
    <tbody>
    @forelse($subscription['activations']??[] as $a)
    <tr><td><code>{{ $a['domain'] }}</code></td><td>{{ \Illuminate\Support\Str::limit($a['activated_at']??'',10,'') }}</td><td>{{ \Illuminate\Support\Str::limit($a['last_check']??'—',10,'') }}</td></tr>
    @empty
    <tr><td colspan="3" style="text-align:center;color:#64748b">لم يُفعَّل بعد</td></tr>
    @endforelse
    </tbody>
  </table>
  </div>
</div>

@else
<div class="card" style="background:#fff;border-radius:10px;padding:40px;text-align:center;border:1px solid #e2e8f0">
  <div style="font-size:48px;margin-bottom:12px">🔒</div>
  <h3 style="font-weight:700;margin-bottom:8px">لا يوجد اشتراك نشط</h3>
  <a href="{{ route('products.show','ms-seo-pro') }}#pricing" class="btn btn-primary">عرض الباقات ←</a>
</div>
@endif
@endsection