<style>
    .modal .select2-container {
        width: 100% !important;
    }
    .modal .select2-container .select2-selection {
        width: 100% !important;
    }
</style>
<div class="modal fade custom-slide" id="{{ $id }}" tabindex="-1" aria-labelledby="{{ $id }}Label" aria-hidden="true">
    <div class="modal-dialog animate__animated animate__rollIn {{ $size }}">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="{{ $id }}Label">{{ $title }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                {{ $slot }}
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                @if($actionButton)
                    <button type="{{$buttonType}}" class="btn btn-primary" id="{{ $id }}SaveBtn">Save</button>
                @endif
            </div>
        </div>
    </div>
</div>