Update assets/styles.css

assets/styles.css

@@ -485,19 +485,25 @@ body, .gradio-container {
     }
 }
 
-/* ---------- Download Data Button (compact, hijau) ---------- */
+/* ---------- Download Data Button (compact, hijau, center) ---------- */
 .download-data-btn {
     display: inline-flex !important;
     width: fit-content !important;
     max-width: fit-content !important;
     flex: 0 0 auto !important;
-    align-self: flex-start !important;
-    margin: 4px 0 16px !important;
+    align-self: center !important;
+    margin: 4px auto 16px !important;
 }
 
+/* Cover kedua kemungkinan struktur DOM Gradio: class bisa menempel
+   langsung di elemen <a>/<button>, atau di div pembungkusnya. */
+.download-data-btn,
 .download-data-btn a,
-.download-data-btn button {
+.download-data-btn button,
+a.download-data-btn,
+button.download-data-btn {
     width: auto !important;
+    max-width: fit-content !important;
     background: var(--good) !important;
     background-color: var(--good) !important;
     border: 1px solid var(--good) !important;
@@ -510,15 +516,21 @@ body, .gradio-container {
     white-space: nowrap !important;
 }
 
+.download-data-btn:hover,
 .download-data-btn a:hover,
-.download-data-btn button:hover {
+.download-data-btn button:hover,
+a.download-data-btn:hover,
+button.download-data-btn:hover {
     background: #5FC28C !important;
     background-color: #5FC28C !important;
     border-color: #5FC28C !important;
 }
 
+.download-data-btn:disabled,
 .download-data-btn a:disabled,
-.download-data-btn button:disabled {
+.download-data-btn button:disabled,
+a.download-data-btn:disabled,
+button.download-data-btn:disabled {
     opacity: 0.6 !important;
     cursor: not-allowed !important;
 }