@extends('admin.shell')

@section('body')
  <div class="min-h-screen bg-[linear-gradient(180deg,_rgba(250,250,249,1),_rgba(248,250,252,1))]">
    <div class="mx-auto max-w-7xl px-4 pb-10 pt-16 md:px-6 lg:px-8 lg:pt-10">
      <div class="mb-8 flex flex-col gap-4 lg:flex-row lg:items-end lg:justify-between">
        <div>
          <p class="section-header">Super Admin</p>
          <h1 class="mt-2 text-4xl font-semibold tracking-tight text-foreground">Users</h1>
          <p class="mt-2 text-sm text-muted-foreground">Search accounts, open their data footprint, promote admins, or remove users entirely.</p>
        </div>

        <nav class="flex flex-wrap gap-2">
          <a href="{{ route('admin.dashboard') }}" class="rounded-full bg-secondary px-4 py-2 text-sm font-semibold text-foreground">Overview</a>
          <a href="{{ route('admin.users') }}" class="rounded-full bg-primary px-4 py-2 text-sm font-semibold text-primary-foreground">Users</a>
          <a href="{{ route('admin.spaces') }}" class="rounded-full bg-secondary px-4 py-2 text-sm font-semibold text-foreground">Spaces</a>
        </nav>
      </div>

      @if (session('status'))
        <div class="mb-4 rounded-2xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-800">{{ session('status') }}</div>
      @endif

      @if ($errors->any())
        <div class="mb-4 rounded-2xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-800">{{ $errors->first() }}</div>
      @endif

      <form method="GET" action="{{ route('admin.users') }}" class="apple-card mb-6 flex flex-col gap-3 rounded-[28px] p-4 md:flex-row">
        <input
          type="search"
          name="search"
          value="{{ $search }}"
          placeholder="Search by name or email"
          class="h-12 flex-1 rounded-2xl border border-border bg-white px-4 text-sm text-foreground outline-none ring-0 transition focus:border-primary"
        >
        <button type="submit" class="h-12 rounded-2xl bg-primary px-5 text-sm font-semibold text-primary-foreground">Search</button>
      </form>

      <div class="space-y-4">
        @foreach ($users as $user)
          <div class="apple-card rounded-[28px] p-5">
            <div class="flex flex-col gap-4 xl:flex-row xl:items-center xl:justify-between">
              <div class="min-w-0">
                <div class="flex flex-wrap items-center gap-2">
                  <a href="{{ route('admin.users.show', $user) }}" class="text-lg font-semibold text-foreground hover:text-primary">{{ $user->profile?->display_name ?: $user->name }}</a>
                  @if ($user->isSuperAdmin())
                    <span class="rounded-full bg-amber-100 px-2.5 py-1 text-[11px] font-semibold uppercase tracking-wide text-amber-700">Super admin</span>
                  @endif
                </div>
                <p class="mt-1 text-sm text-muted-foreground">{{ $user->email }}</p>
                <p class="mt-2 text-xs text-muted-foreground">
                  Joined {{ optional($user->created_at)->toDayDateTimeString() }}
                  @if ($user->profile?->default_space_id)
                    · Default space {{ $user->profile->default_space_id }}
                  @endif
                </p>
              </div>

              <div class="flex flex-col gap-3 sm:flex-row sm:items-center">
                <form method="POST" action="{{ route('admin.users.impersonate', $user) }}">
                  @csrf
                  <button type="submit" class="w-full rounded-2xl bg-sky-50 px-4 py-2.5 text-sm font-semibold text-sky-700 sm:w-auto">
                    Impersonate
                  </button>
                </form>

                <form method="POST" action="{{ route('admin.users.super-admin', $user) }}">
                  @csrf
                  @method('PATCH')
                  <input type="hidden" name="is_super_admin" value="{{ $user->isSuperAdmin() ? 0 : 1 }}">
                  <button type="submit" class="w-full rounded-2xl bg-secondary px-4 py-2.5 text-sm font-semibold text-foreground sm:w-auto">
                    {{ $user->isSuperAdmin() ? 'Remove admin' : 'Make admin' }}
                  </button>
                </form>

                <a href="{{ route('admin.users.show', $user) }}" class="rounded-2xl bg-primary px-4 py-2.5 text-center text-sm font-semibold text-primary-foreground">Open profile</a>

                <form method="POST" action="{{ route('admin.users.destroy', $user) }}" onsubmit="return confirm('Delete this user and their cascaded data?');">
                  @csrf
                  @method('DELETE')
                  <button type="submit" class="w-full rounded-2xl bg-rose-50 px-4 py-2.5 text-sm font-semibold text-rose-700 sm:w-auto">Delete</button>
                </form>
              </div>
            </div>
          </div>
        @endforeach
      </div>

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