<div class="modal fade" id="editUserModal">

    <div class="modal-dialog modal-lg">

        <form method="POST" id="editUserForm">

            @csrf
            @method('PUT')

            <div class="modal-content">

                <div class="modal-header">

                    <h5>Edit User</h5>

                    <button type="button" class="btn-close" data-bs-dismiss="modal">
                    </button>

                </div>

                <div class="modal-body">

                    <div class="row">

                        <div class="col-md-6 mb-3">
                            <label>Full Name</label>

                            <input type="text" name="name" id="edit_name" class="form-control" required>
                        </div>

                        <div class="col-md-6 mb-3">
                            <label>Username</label>

                            <input type="text" name="username" id="edit_username" class="form-control" required>
                        </div>

                        <div class="col-md-6 mb-3">
                            <label>Phone</label>

                            <input type="text" name="phone" id="edit_phone" class="form-control">
                        </div>

                        <div class="col-md-6 mb-3">
                            <label>Role</label>

                            <select name="role" id="edit_role" class="form-select">

                                @foreach ($roles as $role)
                                    <option value="{{ $role->name }}">
                                        {{ $role->name }}
                                    </option>
                                @endforeach

                            </select>

                        </div>

                        <div class="col-md-6 mb-3" id="edit-border-wrapper" style="display:none;">

                            <label>Border Station</label>

                            <select name="border_station_id" id="edit_border_station_id" class="form-select">

                                <option value="">
                                    Select Border
                                </option>

                                @foreach ($borderStations as $station)
                                    <option value="{{ $station->id }}">
                                        {{ $station->name }}
                                    </option>
                                @endforeach

                            </select>

                        </div>

                        <div class="col-md-6 mb-3">

                            <label>Status</label>

                            <select name="status" id="edit_status" class="form-select">

                                <option value="1">Active</option>
                                <option value="0">Disabled</option>

                            </select>

                        </div>

                        <div class="col-md-6 mb-3">

                            <label>New Password</label>

                            <input type="password" name="password" class="form-control">

                            <small class="text-muted">
                                Leave blank to keep current password
                            </small>

                        </div>

                    </div>

                </div>

                <div class="modal-footer">

                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                        Close
                    </button>

                    <button type="submit" class="btn btn-primary">
                        Update User
                    </button>

                </div>

            </div>

        </form>

    </div>

</div>
