style(DialogWidget): update dialog overlay class for improved modal handling

- Changed the class binding for the dialog overlay to differentiate between modal and non-modal states, enhancing visual clarity.
- Introduced a new class for non-modal dialogs to ensure proper positioning and z-index management.

frontend/src/components/DialogWidget.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="visible" :class="['dialog-overlay', { 'non-modal': !modal, 'is-active': isActive }]"
+  <div v-if="visible" :class="[modal ? 'dialog-overlay' : 'dialog-layer', { 'is-active': isActive }]"
     @click.self="handleOverlayClick">
     <div class="dialog" :class="{ minimized: minimized }"
       :style="{ width: dialogWidth, height: dialogHeight, top: dialogTop, left: dialogLeft, position: 'absolute' }"
@@ -193,9 +193,10 @@ export default {
   backdrop-filter: blur(10px);
 }
 
-.dialog-overlay.non-modal {
-  background: transparent;
-  backdrop-filter: none;
+.dialog-layer {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
   pointer-events: none;
 }