Fix select/multiselect to dark theme using role/testid selectors

app/ui_streamlit.py

@@ -88,6 +88,65 @@ span.chip { display:inline-block; padding:3px 8px; border-radius:999px; backgrou
 .hero-text { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:#fff; }
 .hero-text h1 { margin:0; font-size:28px; font-weight:700; color:#f97316; }
 .hero-text p  { margin:6px 0 0; font-size:15px; color:#fcd34d; } /* gold */
+
+
+
+/* ===== FORCE DARK SELECT / MULTISELECT (works across Streamlit versions) ===== */
+
+/* Closed control (the visible box) */
+[data-testid="stSelectbox"] div[role="combobox"],
+[data-testid="stMultiSelect"] div[role="combobox"],
+div[role="combobox"][aria-haspopup="listbox"] {
+  background-color: #1e293b !important;
+  color: #f8fafc !important;
+  border: 1px solid #334155 !important;
+  border-radius: 8px !important;
+}
+
+/* Input text & caret */
+[data-testid="stSelectbox"] div[role="combobox"] input,
+[data-testid="stMultiSelect"] div[role="combobox"] input,
+div[role="combobox"] input {
+  color: #f8fafc !important;
+}
+div[role="combobox"] input::placeholder { color: #94a3b8 !important; }
+div[role="combobox"] svg { color: #f8fafc !important; fill: #f8fafc !important; }
+
+/* Multiselect selected chips */
+[data-testid="stMultiSelect"] [data-baseweb="tag"],
+[data-testid="stMultiSelect"] [aria-label="remove"] {
+  background-color: #334155 !important;
+  color: #e2e8f0 !important;
+  border-radius: 999px !important;
+}
+
+/* Open dropdown panel (menu) */
+div[role="listbox"],
+ul[role="listbox"],
+div[data-baseweb="menu"] {
+  background-color: #0b1220 !important;
+  color: #f8fafc !important;
+  border: 1px solid #334155 !important;
+  border-radius: 10px !important;
+}
+
+/* Options inside the menu */
+[role="listbox"] [role="option"],
+div[data-baseweb="menu"] [role="option"] {
+  background: transparent !important;
+  color: #f8fafc !important;
+}
+[role="listbox"] [role="option"]:hover,
+div[data-baseweb="menu"] [role="option"]:hover {
+  background: #1f2937 !important;
+}
+[role="listbox"] [role="option"][aria-selected="true"],
+div[data-baseweb="menu"] [role="option"][aria-selected="true"] {
+  background: #334155 !important;
+  color: #f8fafc !important;
+}
+
+
 </style>
 """, unsafe_allow_html=True)