@extends('layouts.admin')
@section('title', 'System Users')
@section('page-title', 'System Users (RBAC)')
@section('page-subtitle', 'Manage staff accounts and role-based access')
@section('content')
<div class="flex justify-between items-center mb-6">
    <div class="text-sm text-gray-500">Total: <strong>{{ $users->total() }}</strong> system users</div>
    <a href="{{ route('admin.users.create') }}" class="bg-indigo-700 text-white px-4 py-2 rounded-lg hover:bg-indigo-800">
        <i class="fas fa-user-plus mr-2"></i>Add User
    </a>
</div>
<div class="card overflow-hidden">
    <div class="overflow-x-auto">
        <table class="w-full text-sm">
            <thead class="bg-gray-50 border-b">
                <tr>
                    <th class="px-4 py-3 text-left">Name</th>
                    <th class="px-4 py-3 text-left">Email</th>
                    <th class="px-4 py-3 text-left">Phone</th>
                    <th class="px-4 py-3 text-left">Role</th>
                    <th class="px-4 py-3 text-left">Branch</th>
                    <th class="px-4 py-3 text-center">Status</th>
                    <th class="px-4 py-3 text-center">Actions</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100">
                @forelse($users as $user)
                <tr class="hover:bg-gray-50">
                    <td class="px-4 py-3 font-medium">{{ $user->name }}</td>
                    <td class="px-4 py-3 text-gray-600">{{ $user->email }}</td>
                    <td class="px-4 py-3">{{ $user->phone }}</td>
                    <td class="px-4 py-3">
                        @php $roleColors = ['admin'=>'bg-red-100 text-red-800','manager'=>'bg-purple-100 text-purple-800','cashier'=>'bg-blue-100 text-blue-800','agent'=>'bg-green-100 text-green-800','loan_officer'=>'bg-yellow-100 text-yellow-800','pos'=>'bg-indigo-100 text-indigo-800','auditor'=>'bg-pink-100 text-pink-800']; @endphp
                        <span class="px-2 py-0.5 rounded text-xs font-medium {{ $roleColors[$user->role] ?? 'bg-gray-100 text-gray-700' }}">
                            {{ $user->role_label }}
                        </span>
                    </td>
                    <td class="px-4 py-3 text-gray-500">{{ $user->branch ?? '-' }}</td>
                    <td class="px-4 py-3 text-center">
                        <span class="px-2 py-0.5 rounded text-xs {{ $user->is_active ? 'bg-green-100 text-green-800' : 'bg-gray-100 text-gray-500' }}">
                            {{ $user->is_active ? 'Active' : 'Inactive' }}
                        </span>
                    </td>
                    <td class="px-4 py-3 text-center">
                        <a href="{{ route('admin.users.edit', $user->id) }}" class="text-yellow-600 hover:text-yellow-800 mr-2"><i class="fas fa-edit"></i></a>
                        @if($user->id !== session('admin_user_id'))
                        <form action="{{ route('admin.users.destroy', $user->id) }}" method="POST" class="inline" onsubmit="return confirm('Deactivate this user?')">
                            @csrf @method('DELETE')
                            <button type="submit" class="text-red-500 hover:text-red-700"><i class="fas fa-ban"></i></button>
                        </form>
                        @endif
                    </td>
                </tr>
                @empty
                <tr><td colspan="7" class="px-4 py-8 text-center text-gray-500">No users found.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    <div class="px-4 py-3 border-t">{{ $users->links() }}</div>
</div>
@endsection