diff --git a/addons/mail/static/src/less/chat_window.less b/addons/mail/static/src/less/chat_window.less
index a02fd81bb0d..cf21202863b 100644
--- a/addons/mail/static/src/less/chat_window.less
+++ b/addons/mail/static/src/less/chat_window.less
@@ -3,7 +3,7 @@
 @o-mail-chatter-gap: 10px; // has to be defined here as this file is both in
                            // backend and other assets (livechat)
 @o-chat-header-height: 46px;
-@o-chat-window-zindex: 1101; // blockUI's z-index is 1100 > @zindex-modal
+@o-chat-window-zindex: @zindex-modal + 1;
 
 .o_chat_window {
     .o-flex-display();
@@ -145,6 +145,17 @@
     }
 }
 
+.o_ui_blocked .o_chat_window {
+    // We cannot put the z-index of chat windows directly to be greater than
+    // blockUI's as ui-autocomplete dropdowns (which are below blockUI) would
+    // appear under the chat windows (and ui-autocomplete is used to choose the
+    // person you want to chat with). So we only raise the z-index value when
+    // the ui is really blocked (in that case, the ui-autocomplete dropdowns
+    // will disappear under the chat windows but this is not really an issue as
+    // there should not be any at that time).
+    z-index: 1101; // blockUI's z-index is 1100
+}
+
 .o_no_chat_window .o_chat_window {
     display: none;
 }
diff --git a/addons/web/static/src/js/core/misc.js b/addons/web/static/src/js/core/misc.js
index 983b26d3606..99c21c14038 100644
--- a/addons/web/static/src/js/core/misc.js
+++ b/addons/web/static/src/js/core/misc.js
@@ -59,12 +59,14 @@ function blockUI() {
     var throbber = new Throbber();
     throbbers.push(throbber);
     throbber.appendTo($(".oe_blockui_spin_container"));
+    $(document.body).addClass('o_ui_blocked');
     return tmp;
 }
 
 function unblockUI() {
     _.invoke(throbbers, 'destroy');
     throbbers = [];
+    $(document.body).removeClass('o_ui_blocked');
     return $.unblockUI.apply($, arguments);
 }