@extends('layouts.app')

@section('content')
<div class="topbar">
    <div>
        <h1>Usuarios</h1>
        <p>Administra accesos, estado de usuarios y perfiles operativos.</p>
    </div>
    <div class="actions">
        <a class="btn" href="{{ route('usuarios.create') }}">Nuevo usuario</a>
        @if(auth()->user()->hasPermission('roles.manage'))
            <a class="btn-outline" href="{{ route('perfiles.index') }}">Ver perfiles y permisos</a>
        @endif
    </div>
</div>

<div class="stats panel">
    <div class="stat"><div class="k">Total usuarios</div><div class="v">{{ $totals['total'] }}</div></div>
    <div class="stat"><div class="k">Usuarios activos</div><div class="v">{{ $totals['active'] }}</div></div>
    <div class="stat"><div class="k">Usuarios inactivos</div><div class="v">{{ $totals['inactive'] }}</div></div>
    <div class="stat"><div class="k">Roles configurados</div><div class="v">{{ $roles->count() }}</div></div>
</div>

<div class="panel">
    <form method="GET" class="grid-3">
        <div class="field">
            <label>Búsqueda</label>
            <input type="text" name="q" value="{{ request('q') }}" placeholder="Nombre, correo o usuario">
        </div>
        <div class="field">
            <label>Perfil</label>
            <select name="rol">
                <option value="">Todos</option>
                @foreach($roles as $role)
                    <option value="{{ $role->name }}" @selected(request('rol') === $role->name)>{{ $role->display_name }}</option>
                @endforeach
            </select>
        </div>
        <div class="field">
            <label>Estado</label>
            <select name="estado">
                <option value="">Todos</option>
                <option value="activos" @selected(request('estado') === 'activos')>Activos</option>
                <option value="inactivos" @selected(request('estado') === 'inactivos')>Inactivos</option>
            </select>
        </div>
        <div class="actions">
            <button class="btn" type="submit">Buscar</button>
            <a class="btn-outline" href="{{ route('usuarios.index') }}">Limpiar</a>
        </div>
    </form>
</div>

<div class="panel table-wrap">
    <table class="table">
        <thead>
            <tr>
                <th>Usuario</th>
                <th>Correo</th>
                <th>Perfiles</th>
                <th>Estado</th>
                <th>Último acceso</th>
                <th>Acciones</th>
            </tr>
        </thead>
        <tbody>
            @forelse($users as $user)
                <tr>
                    <td>
                        <strong>{{ $user->name }}</strong><br>
                        <span class="helper">{{ $user->username ?: 'Sin usuario' }}</span>
                    </td>
                    <td>{{ $user->email }}</td>
                    <td>
                        @forelse($user->roles as $role)
                            <span class="badge">{{ $role->display_name }}</span>
                        @empty
                            <span class="badge off">Sin perfil</span>
                        @endforelse
                    </td>
                    <td>
                        <span class="badge {{ $user->is_active ? 'ok' : 'off' }}">{{ $user->is_active ? 'Activo' : 'Inactivo' }}</span>
                    </td>
                    <td>{{ optional($user->last_login_at)->format('Y-m-d H:i') ?: 'Sin acceso' }}</td>
                    <td>
                        <div class="actions">
                            <a class="btn-outline" href="{{ route('usuarios.edit', $user) }}">Editar</a>
                            <form method="POST" action="{{ route('usuarios.toggle', $user) }}">
                                @csrf
                                @method('PATCH')
                                <button class="{{ $user->is_active ? 'btn-danger' : 'btn-warning' }}" type="submit">
                                    {{ $user->is_active ? 'Desactivar' : 'Activar' }}
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
            @empty
                <tr><td colspan="6">No hay usuarios registrados con ese filtro.</td></tr>
            @endforelse
        </tbody>
    </table>

    <div style="margin-top:16px;">
        {{ $users->links() }}
    </div>
</div>
@endsection