Fix dialog click closing the context menu

frontend/src/resources/css/_chat.scss

@@ -321,25 +321,6 @@
     }
 }
 
-// Reply preview styles
-.reply-preview {
-    background-color: $color-dark-surface;
-    border-radius: 8px;
-    padding: 0.75rem;
-    margin-bottom: 1rem;
-    border-left: 3px solid $color-dark-primary;
-
-    .reply-preview-content {
-        color: $color-dark-on-surface-variant;
-        font-size: 0.9rem;
-        line-height: 1.4;
-
-        strong {
-            color: $color-dark-primary;
-        }
-    }
-}
-
 .message-profile-pic {
     img {
         width: 40px;
@@ -362,55 +343,6 @@
     }
 }
 
-.dialog-content {
-    padding: 1.5rem;
-    
-    h3 {
-        margin: 0 0 1rem 0;
-        color: $color-dark-on-surface;
-        font-size: 1.2rem;
-        font-weight: 600;
-    }
-    
-    mdui-text-field {
-        width: 100%;
-        margin-bottom: 1.5rem;
-    }
-    
-    .reply-preview {
-        margin-bottom: 1rem;
-        padding: 0.75rem;
-        background-color: $color-dark-surface-container;
-        border-radius: 8px;
-        border: 1px solid $color-dark-outline;
-        
-        .reply-content {
-            display: flex;
-            flex-direction: column;
-            gap: 0.25rem;
-            
-            .reply-username {
-                font-weight: 600;
-                color: $color-dark-on-surface;
-                font-size: 0.85rem;
-            }
-            
-            .reply-text {
-                color: $color-dark-on-surface-variant;
-                font-size: 0.9rem;
-                line-height: 1.4;
-            }
-        }
-    }
-    
-    .dialog-actions {
-        display: flex;
-        gap: 0.75rem;
-        justify-content: flex-end;
-        margin-top: 1rem;
-    }
-}
-
 .context-menu {
     position: fixed;
     background: $color-dark-surface;

frontend/src/resources/css/common/_components.scss

@@ -101,12 +101,17 @@ button, input {
         margin: 0 0 1rem 0;
         color: $color-dark-on-surface;
         font-size: 1.2rem;
+        font-weight: 600;
     }
-
+    
+    mdui-text-field {
+        width: 100%;
+    }
+    
     .dialog-actions {
         display: flex;
         gap: 0.75rem;
         justify-content: flex-end;
-        margin-top: 1.5rem;
+        margin-top: 1rem;
     }
 }

frontend/src/resources/css/dialogs/_reply.scss

@@ -0,0 +1,31 @@
+@use "../common/material" as *;
+
+.reply-dialog .dialog-content {
+    width: 300px;
+    overflow-x:hidden;
+
+    .reply-preview-dialog {
+        margin-bottom: 1rem;
+        padding: 16px;
+        background-color: $color-dark-surface-container;
+        border-radius: 16px;
+        
+        .reply-content {
+            display: flex;
+            flex-direction: column;
+            gap: 0.25rem;
+            
+            .reply-username {
+                font-weight: 600;
+                color: $color-dark-on-surface;
+                font-size: 0.85rem;
+            }
+            
+            .reply-text {
+                color: $color-dark-on-surface-variant;
+                font-size: 0.9rem;
+                line-height: 1.4;
+            }
+        }
+    }
+}

frontend/src/resources/css/style.scss

@@ -8,6 +8,7 @@
 @use "common/colors" as *;
 @use "common/material" as *;
 @use "electron";
+@use "dialogs/reply";
 
 @use "lib/fonts/montserrat";
 @use "lib/fonts/material-symbols";