@extends('tyro-dashboard::layouts.admin')

@section('title', 'Profiles')

@section('content')
  <div class="page-header">
    <div>
      <h1 class="page-title">Profiles</h1>
      <p class="page-subtitle">Every card profile across all companies. Click a row to open its editor.</p>
    </div>
  </div>

  @if (session('status'))
    <div class="alert alert-success">{{ session('status') }}</div>
  @endif
  @if ($errors->any())
    <div class="alert alert-danger">
      <ul class="mb-0 ps-3">@foreach ($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
    </div>
  @endif

  <form method="GET" class="card mb-4" style="padding: 1rem;">
    <div class="d-flex flex-wrap" style="display:flex;gap:.75rem;align-items:center;">
      <input type="text" name="q" value="{{ $search }}" placeholder="Search name, email, slug, company…"
             style="flex:1 1 240px;padding:.5rem .75rem;border:1px solid var(--border,#e2e8f0);border-radius:.5rem;">
      <select name="company" style="padding:.5rem .75rem;border:1px solid var(--border,#e2e8f0);border-radius:.5rem;">
        <option value="">All companies</option>
        @foreach ($companies as $c)
          <option value="{{ $c->id }}" @selected($companyId === $c->id)>{{ $c->name }}</option>
        @endforeach
      </select>
      <button type="submit" class="btn btn-primary" style="padding:.5rem 1rem;">Filter</button>
      @if ($search !== '' || $companyId)
        <a href="{{ route('admin.profiles.index') }}" style="color:var(--muted,#6b7280);">Clear</a>
      @endif
    </div>
  </form>

  <div class="card" style="overflow:hidden;">
    <table class="table" style="width:100%;border-collapse:collapse;">
      <thead style="background:var(--muted-bg,#f8fafc);text-align:left;">
        <tr>
          <th style="padding:.75rem 1rem;">Profile</th>
          <th style="padding:.75rem 1rem;">Owner</th>
          <th style="padding:.75rem 1rem;">Company</th>
          <th style="padding:.75rem 1rem;">Slug</th>
          <th style="padding:.75rem 1rem;">Status</th>
          <th style="padding:.75rem 1rem;text-align:right;">Actions</th>
        </tr>
      </thead>
      <tbody>
        @forelse ($profiles as $profile)
          <tr style="border-top:1px solid var(--border,#e2e8f0);">
            <td style="padding:.75rem 1rem;">
              <div style="font-weight:600;">{{ $profile->full_name }}</div>
              <div style="color:var(--muted,#6b7280);font-size:.875rem;">{{ $profile->role_title ?: '—' }}</div>
            </td>
            <td style="padding:.75rem 1rem;">
              <div>{{ $profile->user?->name ?? '—' }}</div>
              <div style="color:var(--muted,#6b7280);font-size:.875rem;">{{ $profile->user?->email }}</div>
            </td>
            <td style="padding:.75rem 1rem;">
              {{ $profile->user?->company?->name ?? '—' }}
            </td>
            <td style="padding:.75rem 1rem;">
              <form method="POST" action="{{ route('admin.profiles.slug', $profile) }}" style="display:flex;gap:.25rem;align-items:center;">
                @csrf
                <input type="text" name="slug" value="{{ $profile->slug }}"
                       style="font-family:monospace;font-size:.85rem;padding:.25rem .5rem;border:1px solid var(--border,#e2e8f0);border-radius:.375rem;width:8.5rem;">
                <button type="submit" class="btn btn-sm" style="padding:.25rem .5rem;font-size:.75rem;color:var(--muted,#6b7280);" title="Save slug">
                  Save
                </button>
              </form>
            </td>
            <td style="padding:.75rem 1rem;">
              @if ($profile->is_published)
                <span style="display:inline-block;padding:.125rem .5rem;border-radius:9999px;background:#d1fae5;color:#065f46;font-size:.75rem;font-weight:600;">Live</span>
              @else
                <span style="display:inline-block;padding:.125rem .5rem;border-radius:9999px;background:#f1f5f9;color:#475569;font-size:.75rem;font-weight:600;">Draft</span>
              @endif
            </td>
            <td style="padding:.75rem 1rem;text-align:right;white-space:nowrap;">
              <a href="{{ route('public.profile.show', $profile->slug) }}" class="btn btn-sm" style="padding:.375rem .75rem;font-size:.875rem;color:var(--muted,#6b7280);" target="_blank" rel="noopener">
                View
              </a>
              <a href="{{ route('card.edit', $profile->user) }}" class="btn btn-sm btn-primary" style="padding:.375rem .75rem;font-size:.875rem;">
                Edit
              </a>
              <form method="POST" action="{{ route('admin.profiles.toggle', $profile) }}" style="display:inline;">
                @csrf
                <button type="submit" class="btn btn-sm" style="padding:.375rem .75rem;font-size:.875rem;color:{{ $profile->is_published ? '#b45309' : '#065f46' }};">
                  {{ $profile->is_published ? 'Unpublish' : 'Publish' }}
                </button>
              </form>
            </td>
          </tr>
        @empty
          <tr>
            <td colspan="6" style="padding:2rem;text-align:center;color:var(--muted,#6b7280);">
              No profiles match. {{ $search !== '' || $companyId ? 'Try clearing your filters.' : '' }}
            </td>
          </tr>
        @endforelse
      </tbody>
    </table>
  </div>

  <div class="mt-3">
    {{ $profiles->links() }}
  </div>
@endsection