<div class="row gy-4">
    <div class="col-md-5">
        <div class="card shadow-sm">
            <div class="card-body">
                <h4 class="card-title">Add User</h4>
                <?php if (!empty($message)): ?>
                    <div class="alert alert-success"><?= htmlspecialchars($message) ?></div>
                <?php endif; ?>
                <?php if (!empty($error)): ?>
                    <div class="alert alert-danger"><?= htmlspecialchars($error) ?></div>
                <?php endif; ?>
                <form method="post" action="index.php?route=admin/users/store">
                    <?= $csrf ?>
                    <div class="mb-3">
                        <label class="form-label">Name</label>
                        <input type="text" name="name" class="form-control" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">ID Pengguna (12 digit)</label>
                        <input type="text" name="login_id" class="form-control" pattern="\d{12}" maxlength="12" placeholder="Contoh: 123456789012" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Email (untuk notifikasi)</label>
                        <input type="email" name="email" class="form-control">
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Password</label>
                        <input type="password" name="password" class="form-control" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Role</label>
                        <select name="role_id" class="form-select" required>
                            <option value="">Pilih role</option>
                            <?php foreach ($roles as $role): ?>
                                <option value="<?= $role['id'] ?>"><?= ucfirst($role['name']) ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                    <div class="form-check mb-3">
                        <input class="form-check-input" type="checkbox" name="active" id="active" checked>
                        <label class="form-check-label" for="active">Active</label>
                    </div>
                    <button class="btn btn-primary w-100">Save</button>
                </form>
            </div>
        </div>
    </div>
    <div class="col-md-7">
        <div class="card shadow-sm">
            <div class="card-body">
                <h4 class="card-title">Senarai Pengguna</h4>
                <?php
                $roleLabels = [
                    'admin' => 'Admin',
                    'approver' => 'Approver (Pelulus)',
                    'staff' => 'Staff',
                    'others' => 'Lain-lain',
                ];
                ?>
                <div class="row g-3">
                    <?php foreach ($roleLabels as $roleKey => $label): ?>
                        <?php $list = $usersByRole[$roleKey] ?? []; ?>
                        <div class="col-12">
                            <div class="border rounded-3 p-3 bg-light-subtle">
                                <div class="d-flex justify-content-between align-items-center mb-2">
                                    <h5 class="mb-0"><?= $label ?></h5>
                                    <span class="badge bg-primary-subtle text-primary"><?= count($list) ?> pengguna</span>
                                </div>
                                <?php if (empty($list)): ?>
                                    <p class="text-muted small mb-0">Tiada pengguna dalam kategori ini.</p>
                                <?php else: ?>
                                    <div class="vstack gap-3">
                                        <?php foreach ($list as $user): ?>
                                            <div class="p-3 rounded border bg-white shadow-sm">
                                                <div class="mb-2">
                                                    <span class="fw-semibold"><?= htmlspecialchars($user['name']) ?></span>
                                                    <span class="badge bg-secondary ms-2">ID: <?= htmlspecialchars($user['login_id']) ?></span>
                                                    <span class="badge <?= $user['active'] ? 'bg-success' : 'bg-danger' ?> ms-2">
                                                        <?= $user['active'] ? 'Aktif' : 'Tidak Aktif' ?>
                                                    </span>
                                                </div>
                                                <form method="post" class="row gy-2 gx-2 align-items-center">
                                                    <?= $csrf ?>
                                                    <input type="hidden" name="user_id" value="<?= $user['id'] ?>">
                                                    <div class="col-12 col-md-4">
                                                        <label class="form-label small text-muted mb-1">Nama</label>
                                                        <input type="text" name="name" class="form-control form-control-sm" value="<?= htmlspecialchars($user['name']) ?>" required>
                                                    </div>
                                                    <div class="col-12 col-md-4">
                                                        <label class="form-label small text-muted mb-1">Email (notifikasi)</label>
                                                        <input type="email" name="email" class="form-control form-control-sm" value="<?= htmlspecialchars($user['email'] ?? '') ?>" placeholder="contoh@email.com">
                                                    </div>
                                                    <div class="col-6 col-md-2">
                                                        <label class="form-label small text-muted mb-1">Status</label>
                                                        <select name="active" class="form-select form-select-sm">
                                                            <option value="1" <?= $user['active'] ? 'selected' : '' ?>>Active</option>
                                                            <option value="0" <?= !$user['active'] ? 'selected' : '' ?>>Inactive</option>
                                                        </select>
                                                    </div>
                                                    <div class="col-6 col-md-2 d-flex gap-1">
                                                        <button class="btn btn-sm btn-success w-100" formaction="index.php?route=admin/users/update">Save</button>
                                                        <button class="btn btn-sm btn-outline-danger w-100" formaction="index.php?route=admin/users/delete" onclick="return confirm('Padam pengguna ini?')">Delete</button>
                                                    </div>
                                                </form>
                                                <form method="post" class="d-flex gap-2 mt-2">
                                                    <?= $csrf ?>
                                                    <input type="hidden" name="user_id" value="<?= $user['id'] ?>">
                                                    <input type="password" name="password" class="form-control form-control-sm" placeholder="Reset password" required>
                                                    <button class="btn btn-sm btn-outline-primary" formaction="index.php?route=admin/users/reset">Reset Password</button>
                                                </form>
                                            </div>
                                        <?php endforeach; ?>
                                    </div>
                                <?php endif; ?>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        </div>
    </div>
</div>

