
<div class="modal fade" id="teamModal" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content border-0">
            <form id="teamForm">

                <!-- Modal Header -->
                <div class="modal-header border-0">
                    <h3 class="modal-title fs-5">
                        <span id="teamTitle" class="pe-3">Team Modal Title</span>
                        <div class="border-company border-bottom border-2 w-100 pt-1"></div>
                    </h3>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button>
                </div>
                <!-- End Modal Header -->

                <!-- Modal Body -->
                <div class="modal-body">
                        
                        <!-- Team Number -->
                        <div class="col-md-6 d-flex">
                            <div class="input-group">
                                <span class="input-group-text" data-bs-toggle="tooltip" data-bs-placement="left" data-bs-title="Team number">
                                    <i class="bi bi-tag"></i>
                                </span>
                                <input type="number" name="teamNumber" id="teamNumber" class="form-control" min="1" max="9999" value="1">
                            </div>
                            <button type="button" id="teamNumberNext" class="btn btn-outline-company border-secondary-subtle ms-3" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-title="Find next available number">
                                <i class="bi bi-arrow-clockwise"></i>
                            </button>
                        </div>
                        <div class="col-md-6 mt-2 text-danger" id="teamNumberError" style="display: hidden"></div>
                        <!-- End Team Number -->

                </div>
                <!-- End Modal Body -->

                <!-- Modal Footer -->
                <div class="modal-footer border-0 d-flex">
                    <button class="btn btn-outline-danger me-auto" id="teamDelete" style="display: none;">Delete Team</button>
                    <button type="submit" class="btn btn-company px-4" id="saveTeam">Save</button>
                </div>
                <!-- End Modal Footer -->

            </form>
        </div>
    </div>
</div>