CKEditor 5 popup controls not working in Bootstrap 3 - 2018

The problem I'm having seems similar to this: How to use CKEditor in a Bootstrap Modal? but the accepted answer does not work with the following:

• CKEditor 5, v1.11.1
• jquery 3.2.1
• Bootstrap 3.3.7

I have created a fiddle to show the issue: http://jsfiddle.net/fg3va7zq/2/

If you click "Launch modal" it will open the modal. When trying to insert a link I get this:

I cannot click inside the input to insert a link.

The following CSS was used to make sure the z-index of the link input is above the modal:

.ck-rounded-corners .ck.ck-balloon-panel, .ck.ck-balloon-panel.ck-rounded-corners {
    z-index: 10055 !important;
}

This works, and without it the link box isn't even visible.

The following js was provided on the linked answer:

$.fn.modal.Constructor.prototype.enforceFocus = function () {
    var $modalElement = this.$element;
    $(document).on('focusin.modal', function (e) {
        var $parent = $(e.target.parentNode);
        if ($modalElement[0] !== e.target && !$modalElement.has(e.target).length
            // add whatever conditions you need here:
            &&
            !$parent.hasClass('cke_dialog_ui_input_select') && !$parent.hasClass('cke_dialog_ui_input_text')) {
            $modalElement.focus()
        }
    })
};

This does not fix the issue, as demonstrated on the updated fiddle: http://jsfiddle.net/fg3va7zq/3/

Does anyone know how to fix this? The other SO posts (most of which are several years old) on this subject do not fix the issue so I have opened it as a new question.

from CKEditor 5 popup controls not working in Bootstrap 3 - 2018