@extends('layouts.admin')

@section('title', 'Employer Verification Queue')
@section('page-title', 'Employer Statutory Verification Queue')

@section('content')
<!-- Metric Chips Grid -->
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.25rem; margin-bottom: 2rem;">
  
  <div class="admin-card" style="display: flex; align-items: center; gap: 1rem;">
    <div style="width: 48px; height: 48px; border-radius: var(--radius-md); background: rgba(245, 158, 11, 0.15); color: #f59e0b; display: flex; align-items: center; justify-content: center; font-size: 1.4rem;">
      <i class="fas fa-hourglass-half"></i>
    </div>
    <div>
      <span style="font-size: 0.8rem; color: var(--text-light); text-transform: uppercase; font-weight: 600;">Pending Review</span>
      <strong style="font-size: 1.6rem; font-family: var(--font-heading); display: block; color: #b45309;">{{ $pendingCount }}</strong>
    </div>
  </div>

  <div class="admin-card" style="display: flex; align-items: center; gap: 1rem;">
    <div style="width: 48px; height: 48px; border-radius: var(--radius-md); background: rgba(16, 185, 129, 0.15); color: var(--success); display: flex; align-items: center; justify-content: center; font-size: 1.4rem;">
      <i class="fas fa-check-circle"></i>
    </div>
    <div>
      <span style="font-size: 0.8rem; color: var(--text-light); text-transform: uppercase; font-weight: 600;">Verified Enterprises</span>
      <strong style="font-size: 1.6rem; font-family: var(--font-heading); display: block; color: var(--success);">{{ $verifiedCount }}</strong>
    </div>
  </div>

  <div class="admin-card" style="display: flex; align-items: center; gap: 1rem;">
    <div style="width: 48px; height: 48px; border-radius: var(--radius-md); background: rgba(239, 68, 68, 0.15); color: #ef4444; display: flex; align-items: center; justify-content: center; font-size: 1.4rem;">
      <i class="fas fa-times-circle"></i>
    </div>
    <div>
      <span style="font-size: 0.8rem; color: var(--text-light); text-transform: uppercase; font-weight: 600;">Rejected / Corrections</span>
      <strong style="font-size: 1.6rem; font-family: var(--font-heading); display: block; color: #ef4444;">{{ $rejectedCount }}</strong>
    </div>
  </div>

  <div class="admin-card" style="display: flex; align-items: center; gap: 1rem;">
    <div style="width: 48px; height: 48px; border-radius: var(--radius-md); background: rgba(0, 102, 255, 0.15); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 1.4rem;">
      <i class="fas fa-building"></i>
    </div>
    <div>
      <span style="font-size: 0.8rem; color: var(--text-light); text-transform: uppercase; font-weight: 600;">Total Employers</span>
      <strong style="font-size: 1.6rem; font-family: var(--font-heading); display: block; color: var(--accent);">{{ $totalCount }}</strong>
    </div>
  </div>

</div>

<!-- Filter Toolbar & Table Card -->
<div class="admin-card">
  
  <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 1rem;">
    
    <!-- Status Filter Tabs -->
    <div style="display: flex; gap: 0.4rem; flex-wrap: wrap;">
      <a href="{{ route('admin.employers.index', ['status' => 'pending', 'district' => $selectedDistrict]) }}" class="btn {{ $currentStatus === 'pending' ? 'btn-primary' : 'btn-outline' }} btn-sm">
        Pending Review ({{ $pendingCount }})
      </a>
      <a href="{{ route('admin.employers.index', ['status' => 'verified', 'district' => $selectedDistrict]) }}" class="btn {{ $currentStatus === 'verified' ? 'btn-primary' : 'btn-outline' }} btn-sm">
        Verified ({{ $verifiedCount }})
      </a>
      <a href="{{ route('admin.employers.index', ['status' => 'rejected', 'district' => $selectedDistrict]) }}" class="btn {{ $currentStatus === 'rejected' ? 'btn-primary' : 'btn-outline' }} btn-sm">
        Rejected ({{ $rejectedCount }})
      </a>
      <a href="{{ route('admin.employers.index', ['status' => 'all', 'district' => $selectedDistrict]) }}" class="btn {{ $currentStatus === 'all' ? 'btn-primary' : 'btn-outline' }} btn-sm">
        All Employers
      </a>
    </div>

    <!-- District Scoping Filter -->
    <form method="GET" action="{{ route('admin.employers.index') }}" style="display: flex; gap: 0.5rem; align-items: center;">
      <input type="hidden" name="status" value="{{ $currentStatus }}">
      
      @if($officer->isDistrictOfficer() && !$officer->isAdmin())
        <span class="badge" style="background: rgba(0, 102, 255, 0.15); color: var(--accent); padding: 0.4rem 0.75rem;">
          <i class="fas fa-map-marker-alt"></i> Assigned: {{ $officer->assigned_district }}
        </span>
      @else
        <select name="district" class="form-control" onchange="this.form.submit()" style="padding: 0.4rem 0.75rem; font-size: 0.85rem; max-width: 200px;">
          <option value="">All Maharashtra Districts</option>
          @foreach($districts as $d)
            <option value="{{ $d->name }}" {{ $selectedDistrict === $d->name ? 'selected' : '' }}>
              {{ $d->name }}
            </option>
          @endforeach
        </select>
      @endif
    </form>

  </div>

  <!-- Employers Table -->
  <div class="table-responsive">
    <table class="admin-table">
      <thead>
        <tr>
          <th>Company / Entity</th>
          <th>District / Division</th>
          <th>PAN / GSTIN</th>
          <th>Signatory Contact</th>
          <th>Proofs Uploaded</th>
          <th>Status</th>
          <th style="text-align: right;">Action</th>
        </tr>
      </thead>
      <tbody>
        @forelse($employers as $emp)
          <tr>
            <td>
              <strong style="font-size: 0.95rem; display: block; color: var(--text-heading);">{{ $emp->company_name }}</strong>
              <span style="font-size: 0.8rem; color: var(--text-light);">
                {{ $emp->entity_type }} • {{ $emp->industry_sector ?? 'General' }}
              </span>
            </td>
            <td>
              <strong style="font-size: 0.88rem;">{{ $emp->district ?? 'Unassigned' }}</strong>
              <span style="font-size: 0.78rem; color: var(--text-light); display: block;">{{ $emp->state }}</span>
            </td>
            <td>
              <div style="font-family: monospace; font-size: 0.85rem;">
                <span title="PAN"><strong style="color: var(--text-heading);">PAN:</strong> {{ $emp->pan ?? 'N/A' }}</span><br>
                <span title="GSTIN" style="color: var(--text-light); font-size: 0.8rem;">GST: {{ $emp->gstin ?? 'Not Provided' }}</span>
              </div>
            </td>
            <td>
              <div style="font-size: 0.85rem;">
                <strong>{{ $emp->signatory_name ?? 'N/A' }}</strong>
                @if($emp->signatory_email)
                  <span style="font-size: 0.78rem; color: var(--text-light); display: block;">{{ $emp->signatory_email }}</span>
                @endif
              </div>
            </td>
            <td>
              <div style="display: flex; gap: 0.4rem; font-size: 0.85rem;">
                <span title="Certificate of Incorporation" style="color: {{ $emp->incorporation_cert_path ? 'var(--success)' : 'var(--text-light)' }};">
                  <i class="fas fa-file-alt"></i>
                </span>
                <span title="GST Registration Certificate" style="color: {{ $emp->gst_cert_path ? 'var(--success)' : 'var(--text-light)' }};">
                  <i class="fas fa-file-invoice-dollar"></i>
                </span>
                <span title="Company PAN Card" style="color: {{ $emp->pan_card_path ? 'var(--success)' : 'var(--text-light)' }};">
                  <i class="fas fa-id-card"></i>
                </span>
                <span title="Signatory ID Proof" style="color: {{ $emp->signatory_id_path ? 'var(--success)' : 'var(--text-light)' }};">
                  <i class="fas fa-user-check"></i>
                </span>
              </div>
            </td>
            <td>
              @if($emp->isVerified())
                <span class="badge" style="background: rgba(16, 185, 129, 0.15); color: var(--success); font-weight: 600;">
                  <i class="fas fa-check-circle"></i> Verified
                </span>
              @elseif($emp->isRejected())
                <span class="badge" style="background: rgba(239, 68, 68, 0.15); color: #ef4444; font-weight: 600;">
                  <i class="fas fa-times-circle"></i> Rejected
                </span>
              @elseif($emp->isPending())
                <span class="badge" style="background: rgba(245, 158, 11, 0.15); color: #b45309; font-weight: 600;">
                  <i class="fas fa-hourglass-half"></i> Pending
                </span>
              @else
                <span class="badge" style="background: rgba(100, 116, 139, 0.15); color: #64748b;">
                  Draft
                </span>
              @endif
            </td>
            <td style="text-align: right;">
              <a href="{{ route('admin.employers.show', $emp->id) }}" class="btn btn-outline btn-sm">
                Audit & Review <i class="fas fa-arrow-right"></i>
              </a>
            </td>
          </tr>
        @empty
          <tr>
            <td colspan="7" style="text-align: center; padding: 2rem; color: var(--text-light);">
              <i class="fas fa-folder-open" style="font-size: 2rem; margin-bottom: 0.5rem; display: block; opacity: 0.4;"></i>
              No employer applications match the selected status or district filter.
            </td>
          </tr>
        @endforelse
      </tbody>
    </table>
  </div>

  @if($employers->hasPages())
    <div style="margin-top: 1.5rem; border-top: 1px solid var(--border-light); padding-top: 1rem;">
      {{ $employers->links() }}
    </div>
  @endif

</div>
@endsection