@extends('layouts.app')
@section('title','Users')@section('page-title','User Management')
@section('content')
<div class="page-header d-flex align-items-start justify-content-between">
    <div><h1>Users</h1><p>Manage system users, roles, and branch assignments</p></div>
    <a href="{{ route('users.create') }}" class="btn btn-brand"><i class="bi bi-person-plus me-1"></i> Add User</a>
</div>
<div class="card mb-4"><div class="card-body p-3">
    <form method="GET" class="row g-2 align-items-end">
        <div class="col-12 col-md-4"><div class="search-bar"><i class="bi bi-search"></i><input type="text" name="search" class="form-control" placeholder="Search name or email..." value="{{ request('search') }}"></div></div>
        <div class="col-6 col-md-2"><select name="role" class="form-select"><option value="">All Roles</option>@foreach(['admin','manager','staff'] as $r)<option value="{{ $r }}" {{ request('role')===$r?'selected':'' }}>{{ ucfirst($r) }}</option>@endforeach</select></div>
        <div class="col-6 col-md-2"><select name="branch" class="form-select"><option value="">All Branches</option>@foreach($branches as $b)<option value="{{ $b->id }}" {{ request('branch')==$b->id?'selected':'' }}>{{ $b->code }} — {{ $b->name }}</option>@endforeach</select></div>
        <div class="col-auto d-flex gap-2"><button type="submit" class="btn btn-brand">Filter</button><a href="{{ route('users.index') }}" class="btn btn-outline-secondary">Reset</a></div>
    </form>
</div></div>
<div class="card"><div class="card-body p-0">
    <div class="table-responsive"><table class="table table-hover mb-0">
        <thead><tr><th class="ps-4">User</th><th>Email</th><th>Role</th><th>Branch</th><th>Category</th><th>Status</th><th class="pe-4">Actions</th></tr></thead>
        <tbody>
        @forelse($users as $user)
        <tr>
            <td class="ps-4">
                <div class="d-flex align-items-center gap-3">
                    <div style="width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--accent));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;color:#fff;flex-shrink:0;">{{ strtoupper(substr($user->name,0,1)) }}</div>
                    <div><div style="font-weight:600;font-size:14px;">{{ $user->name }}</div>@if($user->phone)<div style="font-size:11px;color:var(--text-muted-c)">{{ $user->phone }}</div>@endif</div>
                </div>
            </td>
            <td style="font-size:13px;">{{ $user->email }}</td>
            <td><span class="badge-status badge-{{ $user->role }}">{{ ucfirst($user->role) }}</span></td>
            <td>@if($user->branch)<span style="font-size:12px;font-family:monospace;background:rgba(46,196,182,.1);color:var(--accent);padding:2px 8px;border-radius:6px;font-weight:700;">{{ $user->branch->code }}</span>@elseif($user->role==='admin')<span style="font-size:12px;color:var(--text-muted-c)">All Branches</span>@else<span style="font-size:12px;color:var(--text-muted-c)">—</span>@endif</td>
            <td>@if($user->category)<span class="d-flex align-items-center gap-1" style="font-size:13px;"><span class="cat-dot" style="background:{{ $user->category->color }}"></span>{{ $user->category->name }}</span>@else<span style="font-size:12px;color:var(--text-muted-c)">—</span>@endif</td>
            <td>@if($user->is_active)<span class="badge-status badge-completed">Active</span>@else<span class="badge-status badge-cancelled">Inactive</span>@endif</td>
            <td class="pe-4">
                <div class="d-flex gap-1">
                    <a href="{{ route('users.edit',$user) }}" class="btn btn-sm btn-icon btn-outline-brand" title="Edit"><i class="bi bi-pencil"></i></a>
                    @if($user->id !== auth()->id())
                    <form action="{{ route('users.destroy',$user) }}" method="POST" onsubmit="return confirm('Delete {{ addslashes($user->name) }}?')">@csrf @method('DELETE')<button type="submit" class="btn btn-sm btn-icon btn-outline-danger" title="Delete"><i class="bi bi-trash"></i></button></form>
                    @endif
                </div>
            </td>
        </tr>
        @empty<tr><td colspan="7" class="text-center py-5 text-muted"><i class="bi bi-people" style="font-size:40px"></i><p class="mt-2 mb-0">No users found.</p></td></tr>@endforelse
        </tbody>
    </table></div>
</div>
@if($users->hasPages())<div class="card-footer d-flex justify-content-between p-3" style="border-top:1px solid var(--border-c)"><small class="text-muted">{{ $users->firstItem() }}–{{ $users->lastItem() }} of {{ $users->total() }}</small>{{ $users->links() }}</div>@endif
</div>
@endsection