Oct 06: [FIX] Bug fixed 'dragable_and_resizable_wizard'

dragable_and_resizable_wizard/static/src/css/dragable.css

@@ -1,7 +1,28 @@
-.modal-content{
-  resize: both;
-  overflow: auto;
+/* Style the modal container itself */
+.modal-dialog {
+    width: auto !important;      /* Let modal take natural width */
+    max-width: none !important;  /* Disable Bootstrap's default max-width */
+    height: auto;                /* Natural height */
+    max-height: none;            /* No restriction on max height */
+    display: flex;               /* Use flex for centering */
+    justify-content: center;     /* Center modal horizontally */
 }
-.modal-header{
-    cursor: pointer;
+
+/* Style the modal content box */
+.modal-content {
+    resize: both;                /* Allow user to resize horizontally & vertically */
+    overflow: auto;              /* Scrollbars if content exceeds size */
+    width: 60%;                  /* Initial width (default on load) */
+    height: auto;                /* Initial height adjusts to content */
+    min-width: 400px;            /* Prevent shrinking too small */
+    min-height: 200px;           /* Minimum visible height */
+    max-width: 100%;             /* Allow expansion up to viewport width */
+    max-height: 100%;            /* Allow expansion up to viewport height */
+    box-shadow: 0 5px 15px rgba(0,0,0,0.3); /* Add shadow for depth */
+}
+
+/* Optional: style modal header */
+.modal-header {
+    cursor: move; /* Change cursor to indicate draggable look */
+    /* Note: actual drag functionality needs JS */
 }