@extends('layouts.dashboard')
@section('title', t('المنتجات','Products'))
@section('page-title','📦 '.t('إدارة المنتجات','Manage Products'))
@section('content')
<div class="card-header" style="margin-bottom:16px;display:flex;justify-content:space-between;align-items:center">
  <span class="badge badge-blue">{{ $products->count() }} {{ t('منتج','products') }}</span>
  <a href="{{ route('admin.products.create') }}" class="btn btn-primary">➕ {{ t('إضافة منتج','Add Product') }}</a>
</div>
<div class="card">
  <table class="data-table">
    <thead><tr><th>#</th><th>{{ t('المنتج','Product') }}</th><th>{{ t('الإصدار','Version') }}</th><th>{{ t('السعر','Price') }}</th><th>{{ t('الخطة','Min Plan') }}</th><th>{{ t('الحالة','Status') }}</th><th>{{ t('إجراءات','Actions') }}</th></tr></thead>
    <tbody>
    @forelse($products as $p)
    <tr>
      <td style="color:#94a3b8">{{ $p->sort_order }}</td>
      <td>
        <div style="display:flex;align-items:center;gap:10px">
          <div style="width:40px;height:40px;background:{{ $p->color }}22;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:20px">{{ $p->icon }}</div>
          <div><div style="font-weight:700">{{ $p->name }}</div><div style="font-size:11px;color:#64748b">/products/{{ $p->slug }}</div></div>
        </div>
      </td>
      <td><code>v{{ $p->version }}</code></td>
      <td>@if($p->is_free)<span class="badge badge-green">{{ t('مجاني','Free') }}</span>@if($p->starting_price>0)<span style="font-size:11px;display:block">+${{ number_format($p->starting_price,0) }}</span>@endif
      @else<strong>${{ number_format($p->starting_price,0) }}</strong>@endif</td>
      <td><span class="badge badge-blue">{{ $p->min_plan }}</span></td>
      <td>
        <form method="POST" action="{{ route('admin.products.toggle',$p->id) }}" style="display:inline">@csrf
          <button class="badge {{ $p->is_active?'badge-green':'badge-red' }}" style="border:none;cursor:pointer">{{ $p->is_active?'✅ '.t('نشط','Active'):'⛔ '.t('موقوف','Inactive') }}</button>
        </form>
      </td>
      <td>
        <div style="display:flex;gap:4px">
          <a href="{{ route('product.show',$p->slug) }}" target="_blank" class="btn btn-sm btn-outline">👁️</a>
          <a href="{{ route('admin.products.edit',$p->id) }}" class="btn btn-sm" style="background:#dbeafe;color:#2563eb" title="{{ t('تعديل','Edit') }}">✏️</a>
          <a href="{{ route('admin.product-plans.index',$p->id) }}" class="btn btn-sm" style="background:#fef3c7;color:#d97706" title="{{ t('الأسعار','Pricing') }}">💰</a>
          <form method="POST" action="{{ route('admin.products.delete',$p->id) }}" style="display:inline" onsubmit="return confirm('{{ t('حذف؟','Delete?') }}')">@csrf @method('DELETE')
            <button class="btn btn-sm btn-danger">🗑️</button>
          </form>
        </div>
      </td>
    </tr>
    @empty
    <tr><td colspan="7" style="text-align:center;padding:32px;color:#64748b">{{ t('لا يوجد منتجات','No products') }}</td></tr>
    @endforelse
    </tbody>
  </table>
</div>
@endsection