@extends('layouts.app')
@section('title', 'Manage Users')
@section('breadcrumb')
    <a href="{{ route('admin.index') }}" style="color:var(--text-secondary);">Admin</a>
    <span class="topbar-breadcrumb-sep">/</span>
    <span style="font-weight:600;color:var(--text-primary);">Users</span>
@endsection

@section('content')
    <div class="page-header" style="display:flex;justify-content:space-between;align-items:center;">
        <h1>👥 User Management</h1>
        @can('create_user')
        <a href="{{ route('admin.users.create') }}" class="btn btn-primary">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:16px;height:16px;"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>
            Add User
        </a>
        @endcan
    </div>

    {{-- Filters --}}
    <div class="card mb-4" style="padding:16px;">
        <form method="GET" action="{{ route('admin.users') }}" style="display:flex;gap:12px;align-items:end;flex-wrap:wrap;">
            <div class="form-group" style="margin:0;flex:1;min-width:200px;">
                <label class="form-label" style="font-size:0.75rem;">Search</label>
                <input type="text" name="search" class="form-control" placeholder="Name or email..." value="{{ request('search') }}">
            </div>
            <div class="form-group" style="margin:0;min-width:150px;">
                <label class="form-label" style="font-size:0.75rem;">Role</label>
                <select name="role" class="form-control">
                    <option value="">All Roles</option>
                    @foreach($roles as $role)
                        <option value="{{ $role->name }}" {{ request('role') == $role->name ? 'selected' : '' }}>{{ $role->name }}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group" style="margin:0;min-width:130px;">
                <label class="form-label" style="font-size:0.75rem;">Status</label>
                <select name="status" class="form-control">
                    <option value="">All</option>
                    <option value="active" {{ request('status') == 'active' ? 'selected' : '' }}>Active</option>
                    <option value="inactive" {{ request('status') == 'inactive' ? 'selected' : '' }}>Inactive</option>
                </select>
            </div>
            <button type="submit" class="btn btn-secondary btn-sm" style="height:42px;">Filter</button>
            @if(request()->hasAny(['search','role','status']))
                <a href="{{ route('admin.users') }}" class="btn btn-ghost btn-sm" style="height:42px;">Clear</a>
            @endif
        </form>
    </div>

    <div class="card">
        <div class="table-wrapper">
            <table>
                <thead>
                    <tr>
                        <th>User</th>
                        <th>Email</th>
                        <th>Role</th>
                        <th>Department</th>
                        <th>Tasks</th>
                        <th>Status</th>
                        <th style="text-align:right;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($users as $user)
                        <tr>
                            <td>
                                <div class="flex items-center gap-2">
                                    <div class="avatar avatar-sm">{{ $user->initials }}</div>
                                    <div>
                                        <span class="font-semibold">{{ $user->name }}</span>
                                        @if($user->job_title)
                                            <div class="text-xs text-muted">{{ $user->job_title }}</div>
                                        @endif
                                    </div>
                                </div>
                            </td>
                            <td class="text-muted">{{ $user->email }}</td>
                            <td>
                                @foreach($user->roles as $role)
                                    <span class="badge badge-primary">{{ $role->name }}</span>
                                @endforeach
                                @if($user->roles->isEmpty())
                                    <span class="badge badge-secondary">No Role</span>
                                @endif
                            </td>
                            <td>{{ $user->department ?? '—' }}</td>
                            <td>{{ $user->assigned_tasks_count }}</td>
                            <td>
                                <span class="badge badge-{{ $user->is_active ? 'success' : 'danger' }}">
                                    {{ $user->is_active ? 'Active' : 'Inactive' }}
                                </span>
                            </td>
                            <td style="text-align:right;">
                                <div style="display:flex;gap:6px;justify-content:flex-end;">
                                    @can('edit_user')
                                    <a href="{{ route('admin.users.edit', $user) }}" class="btn btn-ghost btn-sm" title="Edit">
                                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px;"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>
                                    </a>
                                    <form method="POST" action="{{ route('admin.users.toggle', $user) }}" style="margin:0;">
                                        @csrf @method('PATCH')
                                        <button type="submit" class="btn btn-ghost btn-sm" title="{{ $user->is_active ? 'Deactivate' : 'Activate' }}">
                                            @if($user->is_active)
                                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px;"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>
                                            @else
                                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px;"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>
                                            @endif
                                        </button>
                                    </form>
                                    @endcan
                                    @can('delete_user')
                                    @if($user->id !== auth()->id())
                                        <form method="POST" action="{{ route('admin.users.delete', $user) }}" style="margin:0;" onsubmit="return confirm('Delete user {{ $user->name }}?')">
                                            @csrf @method('DELETE')
                                            <button type="submit" class="btn btn-ghost btn-sm" style="color:var(--accent-red);" title="Delete">
                                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px;"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path></svg>
                                            </button>
                                        </form>
                                    @endif
                                    @endcan
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="7" style="text-align:center;padding:32px;color:var(--text-tertiary);">No users found.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
    @if($users->hasPages())
        <div class="pagination" style="margin-top:16px;">{{ $users->withQueryString()->links() }}</div>
    @endif
@endsection