Update static/style.css

static/style.css

@@ -27,7 +27,6 @@
     --aqua: #8ec07c;
 }
 
-/* Base Styling */
 body {
     background-color: var(--bg0);
     color: var(--fg0);
@@ -59,7 +58,6 @@ button:hover {
     color: var(--fg0) !important;
 }
 
-/* === Custom Dropdown Styles === */
 .dropdown {
     position: relative;
     overflow: visible;
@@ -71,7 +69,7 @@ button:hover {
     top: 100%;
     left: 50%;
     transform: translateX(-50%);
-    width: 220px;
+    width: 240px;
     z-index: 9999;
     background-color: var(--bg-statusline1) !important;
     color: var(--fg0);
@@ -82,10 +80,9 @@ button:hover {
     scrollbar-color: #665c54 var(--bg-statusline1);
     border-radius: 0.5rem;
     white-space: nowrap;
-    text-align: left;
+    text-align: center;
 }
 
-/* Scrollbar WebKit */
 .options::-webkit-scrollbar {
     width: 8px;
 }
@@ -109,10 +106,9 @@ button:hover {
 }
 .options div {
     padding: 0.5rem 0.75rem;
-    text-align: left;
+    text-align: center;
 }
 
-/* Footer (Credits) */
 footer {
     margin-top: 1rem;
     padding-top: 1rem;
@@ -125,7 +121,6 @@ form#chatForm {
     margin-bottom: 0.5rem;
 }
 
-/* === Loader Dots Animation === */
 @keyframes bounce {
   0%, 80%, 100% {
     transform: scale(0);
@@ -154,7 +149,6 @@ form#chatForm {
   background-color: var(--aqua);
 }
 
-/* === Config Panel Behavior === */
 #configPanel {
   max-height: 1000px;
   overflow: visible;
@@ -163,48 +157,35 @@ form#chatForm {
   justify-content: space-around;
 }
 
-.model-zone {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  text-align: center;
-}
-
-/* --- Minimal Mode --- */
-#configPanel.minimal .model-label,
-#configPanel.minimal .dropdown {
+#configPanel.minimal .model-zone .model-label,
+#configPanel.minimal .model-zone .dropdown {
   display: none;
 }
 
-#configPanel.minimal .model-name {
-  display: block;
-  font-weight: bold;
-  margin-top: 0.25rem;
+#configPanel.minimal .model-zone .model-name,
+#configPanel.minimal .model-zone .loader {
+  display: inline-block;
 }
 
-#configPanel.minimal .loader {
+#configPanel.expanded .model-zone .model-name {
   display: none;
-  justify-content: center;
-  margin-top: 0.25rem;
 }
 
-#configPanel.minimal .model-zone.loading .loader {
-  display: flex;
-}
-
-/* --- Expanded Mode --- */
-#configPanel.expanded .model-label,
-#configPanel.expanded .dropdown,
-#configPanel.expanded .model-name {
+#configPanel.expanded .model-zone .model-label,
+#configPanel.expanded .model-zone .dropdown {
   display: block;
 }
 
-#configPanel.expanded .loader {
-  display: none;
+.model-zone {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
 }
 
-#configPanel.expanded .model-zone.loading .loader {
-  display: flex;
+.model-name {
+  font-weight: bold;
+  padding: 0.5rem 0;
 }
 
 #chatContainer {