<?php
/**
 * @var array $roles
 * @var array $branches
 */
?>
<div class="page-title mb-4">
    <h5><i class="fas fa-user-plus me-2 text-gold"></i>Create User</h5>
</div>

<div class="glass-card p-0">
    <div class="card-header">
        <div class="card-header-left">
            <i class="fas fa-user card-icon"></i>
            <h6 class="card-title">User Information</h6>
        </div>
        <div>
            <span class="text-muted small"><span class="text-danger">*</span> Required fields</span>
        </div>
    </div>
    <div class="card-body">
        <form method="POST" action="<?= url('users/store') ?>">
            <?= csrf_field() ?>

            <div class="row g-3">
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">First Name <span class="text-danger">*</span></label>
                        <input type="text" name="first_name" class="form-control bg-transparent" required
                               value="<?= e(old('first_name')) ?>" maxlength="50">
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Last Name <span class="text-danger">*</span></label>
                        <input type="text" name="last_name" class="form-control bg-transparent" required
                               value="<?= e(old('last_name')) ?>" maxlength="50">
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Email <span class="text-danger">*</span></label>
                        <input type="email" name="email" class="form-control bg-transparent" required
                               value="<?= e(old('email')) ?>" maxlength="100">
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Username <span class="text-danger">*</span></label>
                        <input type="text" name="username" class="form-control bg-transparent" required
                               value="<?= e(old('username')) ?>" maxlength="50">
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Password <span class="text-danger">*</span></label>
                        <input type="password" name="password" class="form-control bg-transparent" required minlength="8">
                        <small class="text-muted">Minimum 8 characters</small>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Phone</label>
                        <input type="text" name="phone" class="form-control bg-transparent"
                               value="<?= e(old('phone')) ?>" maxlength="20">
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Role</label>
                        <select name="role_id" class="form-select bg-transparent">
                            <option value="">No Role</option>
                            <?php foreach ($roles as $role): ?>
                                <option value="<?= $role->id ?>" <?= old('role_id') == $role->id ? 'selected' : '' ?>>
                                    <?= e($role->name) ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Branch</label>
                        <select name="branch_id" class="form-select bg-transparent">
                            <option value="">No Branch</option>
                            <?php foreach ($branches as $branch): ?>
                                <option value="<?= $branch->id ?>" <?= old('branch_id') == $branch->id ? 'selected' : '' ?>>
                                    <?= e($branch->name) ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Status</label>
                        <select name="status" class="form-select bg-transparent">
                            <option value="active" <?= old('status') === 'active' ? 'selected' : '' ?>>Active</option>
                            <option value="inactive" <?= old('status') === 'inactive' ? 'selected' : '' ?>>Inactive</option>
                            <option value="suspended" <?= old('status') === 'suspended' ? 'selected' : '' ?>>Suspended</option>
                        </select>
                    </div>
                </div>
                <div class="col-12">
                    <div class="form-check">
                        <input type="hidden" name="is_superadmin" value="0">
                        <input type="checkbox" name="is_superadmin" id="is_superadmin" class="form-check-input" value="1"
                               <?= old('is_superadmin') === '1' ? 'checked' : '' ?>>
                        <label class="form-check-label" for="is_superadmin">Superadmin (bypasses all permission checks)</label>
                    </div>
                </div>
            </div>

            <div class="mt-4 d-flex gap-2">
                <button type="submit" class="btn btn-gold">
                    <i class="fas fa-save me-1"></i>Create User
                </button>
                <a href="<?= url('users') ?>" class="btn btn-outline-gold">Cancel</a>
            </div>
        </form>
    </div>
</div>
