@extends('layout.admin')
@section('title','Target Campaigns')

@section('content')
<div class="max-w-6xl mx-auto px-4 py-6">
  <div class="flex items-center justify-between mb-4">
    <h1 class="text-xl font-extrabold text-slate-800">🎯 Target Campaigns</h1>
    <a href="{{ route('admin.targets.create') }}"
       class="inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-indigo-600 text-white font-semibold hover:opacity-95">
      <i class="fa-solid fa-plus"></i> New Campaign
    </a>
  </div>

  @if(session('success'))
    <div class="mb-4 rounded-lg border border-emerald-200 bg-emerald-50 text-emerald-700 px-3 py-2">
      {{ session('success') }}
    </div>
  @endif
  @if($errors->any())
    <div class="mb-4 rounded-lg border border-rose-200 bg-rose-50 text-rose-700 px-3 py-2">
      {{ $errors->first() }}
    </div>
  @endif

  <div class="overflow-x-auto rounded-xl border border-slate-200 bg-white">
    <table class="min-w-full text-sm">
      <thead class="bg-slate-50">
        <tr class="text-left text-slate-600">
          <th class="px-3 py-2">Title</th>
          <th class="px-3 py-2">Type</th>
          <th class="px-3 py-2">Req</th>
          <th class="px-3 py-2">Level</th>
          <th class="px-3 py-2">Bonus</th>
          <th class="px-3 py-2">Window</th>
          <th class="px-3 py-2">Active</th>
          <th class="px-3 py-2 text-right">Actions</th>
        </tr>
      </thead>
      <tbody>
        @forelse($items as $cp)
          <tr class="border-t">
            <td class="px-3 py-2 font-semibold text-slate-900">{{ $cp->title }}</td>
            <td class="px-3 py-2">
              <span class="px-2 py-0.5 rounded bg-slate-100 text-slate-700">
                {{ ucfirst(str_replace('_',' ',$cp->project_type)) }}
              </span>
            </td>
            <td class="px-3 py-2">{{ $cp->required_count }}</td>
            <td class="px-3 py-2">{{ $cp->project_type==='referral' ? ($cp->referral_level ?? '-') : '-' }}</td>
            <td class="px-3 py-2">
              ৳{{ number_format($cp->bonus_amount,2) }}
              <span class="text-xs text-slate-500">({{ $cp->bonus_wallet==='voucher'?'voucher':'cash' }})</span>
            </td>
            <td class="px-3 py-2 text-slate-600">
              {{ $cp->start_at->format('d M y') }} – {{ $cp->end_at->format('d M y') }}
            </td>
            <td class="px-3 py-2">
              @if($cp->is_active)
                <span class="px-2 py-0.5 rounded bg-emerald-50 text-emerald-700 border border-emerald-200 text-xs font-bold">ON</span>
              @else
                <span class="px-2 py-0.5 rounded bg-rose-50 text-rose-700 border border-rose-200 text-xs font-bold">OFF</span>
              @endif
            </td>
            <td class="px-3 py-2">
              <div class="flex items-center gap-2 justify-end">
                <form method="POST" action="{{ route('admin.targets.toggle',$cp->id) }}">
                  @csrf @method('PATCH')
                  <button class="px-3 py-1.5 rounded border text-xs font-semibold
                                 {{ $cp->is_active ? 'border-rose-300 text-rose-700 bg-rose-50' : 'border-emerald-300 text-emerald-700 bg-emerald-50' }}">
                    {{ $cp->is_active ? 'Turn OFF' : 'Turn ON' }}
                  </button>
                </form>

                <a href="{{ route('admin.targets.edit',$cp->id) }}"
                   class="px-3 py-1.5 rounded border border-slate-300 text-slate-700 text-xs font-semibold hover:bg-slate-50">
                  Edit
                </a>

                <form method="POST" action="{{ route('admin.targets.destroy',$cp->id) }}"
                      onsubmit="return confirm('Delete this campaign?');">
                  @csrf @method('DELETE')
                  <button class="px-3 py-1.5 rounded border border-slate-300 text-slate-700 text-xs font-semibold hover:bg-slate-50">
                    Delete
                  </button>
                </form>
              </div>
            </td>
          </tr>
        @empty
          <tr><td colspan="8" class="px-3 py-6 text-center text-slate-500">No campaigns yet.</td></tr>
        @endforelse
      </tbody>
    </table>
  </div>
</div>
@endsection