feat: updated website

app.py

@@ -190,26 +190,7 @@ if page == "Summary":
         st.markdown('#### Clustering Details')
         
         # Horizontal layout for clustering metrics similar to "General Data Information"
-        st.markdown(f"""
-        <div style="display: flex; justify-content: space-around;">
-            <div style="background-color:{metric_box_color}; padding: 15px; border-radius: 8px; width: 20%; text-align: center;">
-                <h5 style="color:{primary_color};">Observations</h5>
-                <h3 style="color:{text_color};">696</h3>
-            </div>
-            <div style="background-color:{metric_box_color}; padding: 15px; border-radius: 8px; width: 20%; text-align: center;">
-                <h5 style="color:{primary_color};">Silhouette Score</h5>
-                <h3 style="color:{text_color};">0.57744</h3>
-            </div>
-            <div style="background-color:{metric_box_color}; padding: 15px; border-radius: 8px; width: 20%; text-align: center;">
-                <h5 style="color:{primary_color};">Calinski-Harabasz</h5>
-                <h3 style="color:{text_color};">422.98</h3>
-            </div>
-            <div style="background-color:{metric_box_color}; padding: 15px; border-radius: 8px; width: 20%; text-align: center;">
-                <h5 style="color:{primary_color};">Davies-Bouldin</h5>
-                <h3 style="color:{text_color};">0.63446</h3>
-            </div>
-        </div>
-        """, unsafe_allow_html=True)
+        st.metric(label="Observations", value="696")
     # Middle Column (White): 3D Cluster Model and Bar Chart
     with col2:
         st.markdown('#### 3D Customer Clusters')