@extends('admin.layouts.app')

@section('title', 'Users')
@section('header-title', 'Users (Admin & Staff)')

@section('content')
<div class="card">
    <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px;">
        <div class="card-title" style="margin: 0;">Users</div>
        <a href="{{ route('admin.users.create') }}" class="btn btn-primary btn-sm">+ Add User</a>
    </div>
    <div style="overflow-x: auto;">
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Email</th>
                    <th>Role</th>
                    <th>Status</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                @forelse($users as $u)
                <tr>
                    <td>{{ $u->name }}</td>
                    <td>{{ $u->email }}</td>
                    <td><span style="text-transform: capitalize;">{{ $u->role }}</span></td>
                    <td>{{ $u->is_active ? 'Active' : 'Inactive' }}</td>
                    <td>
                        <a href="{{ route('admin.users.edit', $u) }}" class="btn btn-secondary btn-sm">Edit</a>
                        @if($u->id !== auth()->id())
                        <form action="{{ route('admin.users.destroy', $u) }}" method="POST" style="display:inline;" onsubmit="return confirm('Delete this user?');">
                            @csrf @method('DELETE')
                            <button type="submit" class="btn btn-danger btn-sm">Delete</button>
                        </form>
                        @endif
                    </td>
                </tr>
                @empty
                <tr><td colspan="5" style="color: var(--text-muted);">No users yet.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    <div style="margin-top: 12px;">{{ $users->links() }}</div>
</div>
@endsection