Refine dark sidebar styling

app.py

@@ -688,6 +688,24 @@ html, body, .gradio-container {
   font-family: var(--ct-mono) !important;
 }
 
+.ct-sidebar .block,
+.ct-sidebar .form,
+.ct-sidebar .wrap,
+.ct-sidebar .container,
+.ct-sidebar .secondary-wrap,
+.ct-sidebar .input-container,
+.ct-sidebar .block > div {
+  background: transparent !important;
+  border-color: var(--ct-line) !important;
+  box-shadow: none !important;
+}
+
+.ct-sidebar .block {
+  background: var(--ct-panel) !important;
+  border: 1px solid var(--ct-line) !important;
+  border-radius: 8px !important;
+}
+
 .ct-sidebar label,
 .ct-sidebar .block span {
   color: var(--ct-muted) !important;
@@ -702,6 +720,27 @@ html, body, .gradio-container {
   border-color: var(--ct-line) !important;
 }
 
+.ct-sidebar button {
+  background: var(--ct-panel-2) !important;
+  border: 1px solid var(--ct-line) !important;
+  border-radius: 8px !important;
+  color: var(--ct-text) !important;
+  font-family: var(--ct-mono) !important;
+  min-height: 42px;
+}
+
+.ct-sidebar button:hover {
+  border-color: var(--ct-blue) !important;
+  color: #ffffff !important;
+}
+
+.ct-sidebar button.primary,
+.ct-sidebar .primary button {
+  background: #1f6feb !important;
+  border-color: #388bfd !important;
+  color: #ffffff !important;
+}
+
 .ct-main {
   padding: 22px;
   min-width: 0;
@@ -1023,6 +1062,11 @@ html, body, .gradio-container {
   margin: 8px 0 12px;
 }
 
+.ct-page-info,
+.ct-page-info * {
+  color: var(--ct-muted) !important;
+}
+
 .ct-pager {
   display: grid;
   grid-template-columns: 1fr 1fr;