Update static/style.css

static/style.css

@@ -60,7 +60,16 @@ button:hover {
 }
 
 /* === Custom Dropdown Styles === */
+.dropdown {
+    position: relative;
+}
+
 .options {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    width: 100%;
+    z-index: 999;
     background-color: var(--bg-statusline1) !important;
     color: var(--fg0);
     backdrop-filter: none !important;
@@ -69,8 +78,6 @@ button:hover {
     scrollbar-width: thin;
     scrollbar-color: #665c54 var(--bg-statusline1);
     border-radius: 0.5rem;
-    z-index: 50;
-    position: relative;
 }
 
 /* Scrollbar WebKit */
@@ -86,37 +93,30 @@ button:hover {
     border-radius: 4px;
     border: 2px solid var(--bg-statusline1);
 }
-
-/* Scrollbar hover override */
 .options::-webkit-scrollbar-thumb:hover {
     background-color: #7c6f64 !important;
 }
-
-/* Option Hover State */
 .options div:hover {
     background-color: var(--blue) !important;
     color: var(--fg1) !important;
     font-weight: 600;
     cursor: pointer;
 }
+.options div {
+    padding: 0.5rem 0.75rem;
+}
 
 /* Footer (Credits) */
 footer {
-  margin-top: 1rem;
-  padding-top: 1rem;
-  font-size: 0.875rem;
-  color: var(--fg1);
-  opacity: 0.7;
+    margin-top: 1rem;
+    padding-top: 1rem;
+    font-size: 0.875rem;
+    color: var(--fg1);
+    opacity: 0.7;
 }
 
-/* Improve spacing under chat form */
 form#chatForm {
-  margin-bottom: 0.5rem;
-}
-
-/* Improve padding inside the options dropdown */
-.options div {
-  padding: 0.5rem 0.75rem;
+    margin-bottom: 0.5rem;
 }
 
 /* === Loader Dots Animation === */
@@ -166,7 +166,6 @@ form#chatForm {
   max-height: 1000px;
 }
 
-/* Hide/show label vs model name */
 #configPanel.minimal .model-label {
   display: none;
 }
@@ -177,7 +176,6 @@ form#chatForm {
   display: none;
 }
 
-/* Layout for each model zone */
 .model-zone {
   display: flex;
   flex-direction: column;