{% extends "base.html" %}
{% block title %}Create User{% endblock %}
{% block content %}
<div class="container mt-4">
    <h2>Create User</h2>
    <form method="post" class="row g-3">
        {% csrf_token %}
        <div class="col-md-6">
            <label for="username" class="form-label">Username</label>
            <input type="text" class="form-control" id="username" name="username" required>
        </div>
        <div class="col-md-6">
            <label for="email" class="form-label">Email</label>
            <input type="email" class="form-control" id="email" name="email" required>
        </div>
        <div class="col-md-6">
            <label for="first_name" class="form-label">First Name</label>
            <input type="text" class="form-control" id="first_name" name="first_name" required>
        </div>
        <div class="col-md-6">
            <label for="last_name" class="form-label">Last Name</label>
            <input type="text" class="form-control" id="last_name" name="last_name" required>
        </div>
        <div class="col-md-6">
            <label for="role" class="form-label">Role</label>
            <select class="form-select" id="role" name="role">
                <option value="ADMIN">Admin</option>
                <option value="STAFF">Staff</option>
                <option value="CUSTOMER">Customer</option>
                <option value="RIDER">Rider</option>
            </select>
        </div>
        <div class="col-md-6 d-flex align-items-center">
            <div class="form-check mt-2">
                <input class="form-check-input" type="checkbox" id="banned" name="banned">
                <label class="form-check-label" for="banned">Banned</label>
            </div>
        </div>
        <div class="col-md-6">
            <label for="password" class="form-label">Password</label>
            <input type="password" class="form-control" id="password" name="password" required>
        </div>
        <div class="col-12">
            <button type="submit" class="btn btn-primary">Create User</button>
            <a href="{% url 'user-management' %}" class="btn btn-secondary">Back</a>
        </div>
    </form>
</div>
{% endblock %}