css: fix rounded corners for chats in overlayed mode

sass/_chatbox.scss

@@ -484,16 +484,8 @@
         padding: 0.5em;
     }
     .chat-head {
-        border-top-left-radius: var(--chatbox-border-radius);
-        border-top-right-radius: var(--chatbox-border-radius);
-        @media screen and (max-height: $mobile-landscape-height) {
-            border-top-left-radius: 0;
-            border-top-right-radius: 0;
-        }
-        @media screen and (max-width: $mobile-portrait-length) {
-            border-top-left-radius: 0;
-            border-top-right-radius: 0;
-        }
+        border-top-left-radius: 0;
+        border-top-right-radius: 0;
     }
     .chatbox {
         min-width: var(--overlayed-chat-width) !important;
@@ -507,6 +499,20 @@
 }
 
 #conversejs.converse-overlayed  {
+
+    .chat-head, .box-flyout {
+        border-top-left-radius: var(--chatbox-border-radius);
+        border-top-right-radius: var(--chatbox-border-radius);
+        @media screen and (max-height: $mobile-landscape-height) {
+            border-top-left-radius: 0;
+            border-top-right-radius: 0;
+        }
+        @media screen and (max-width: $mobile-portrait-length) {
+            border-top-left-radius: 0;
+            border-top-right-radius: 0;
+        }
+    }
+
     .flyout {
         bottom: var(--overlayed-chatbox-hover-height);
     }