<?= $this->extend('layout/main') ?>
<?= $this->section('content') ?>

<style>
    /* Botones de acción */
    .acciones a {
        color: #2d5a86;
        margin-right: 10px;
        font-size: 1.1rem;
        transition: color 0.3s ease, background-color 0.3s ease;
        padding: 6px;
        border-radius: 5px;
        text-decoration: none;
    }
    .acciones a:hover {
        background-color: rgba(77, 130, 188, 0.1);
        color: #16A6BA;
    }
    .acciones a.eliminar:hover {
        background-color: rgba(255, 0, 0, 0.1);
        color: darkred;
    }

    /* Cabecera de la tabla */
    thead {
        background-color: #2d5a86;
        color: white;
    }
    thead th {
        text-align: center !important;
        vertical-align: middle !important;
    }

    /* Celdas del cuerpo */
    tbody td {
        text-align: center;
        vertical-align: middle;
    }
    tbody td.acciones {
        text-align: left;
    }

    /* Botones */
    .btn-buscar,
    .btn-crear {
        background-color: #2d5a86;
        color: white;
    }
    .btn-buscar:hover,
    .btn-crear:hover {
        background-color: #16A6BA;
        color: white;
    }

    /* Inputs al enfocar */
    input.form-control:focus {
        border: 2px solid #16A6BA;
        box-shadow: 0 0 6px rgba(22, 166, 186, 0.5);
        outline: none;
    }
</style>

<section class="content">
  <div class="container-fluid">
    <h1>Usuarios</h1>

    <form method="get" class="form-inline mb-3">
      <input type="text" name="search" class="form-control mr-2" placeholder="Buscar usuario" value="<?= esc($search) ?>">
      <button type="submit" class="btn btn-primary">Filtrar</button>
    </form>

    <table class="table table-bordered">
      <thead>
        <tr>
          <th>ID</th>
          <th>Usuario</th>
          <th>Email</th>
          <th>Activo</th>
          <th>Creado</th>
        </tr>
      </thead>
      <tbody>
        <?php foreach ($users as $user): ?>
        <tr>
          <td><?= $user['id'] ?></td>
          <td><?= esc($user['username']) ?></td>
          <td><?= esc($user['email']) ?></td>
          <td><?= $user['active'] ? 'Sí' : 'No' ?></td>
          <td><?= $user['created_at'] ?></td>
        </tr>
        <?php endforeach; ?>
      </tbody>
    </table>

    <?= $pager->links() ?>
  </div>
</section>
<?= $this->endSection() ?>
