diff --git a/app/static/index.html b/app/static/index.html
index 95bae78..97c9ea1 100644
--- a/app/static/index.html
+++ b/app/static/index.html
@@ -1536,7 +1536,12 @@
             
             try {
                 metricsDiv.style.display = 'block';
-                metricsDiv.innerHTML = '<p>Loading metrics from Prometheus...</p>';
+                
+                // Show loading message in clusterTotal div
+                const clusterTotalDiv = document.getElementById('clusterTotal');
+                const workloadDataDiv = document.getElementById('workloadData');
+                if (clusterTotalDiv) clusterTotalDiv.innerHTML = '<p>Loading metrics from Prometheus...</p>';
+                if (workloadDataDiv) workloadDataDiv.innerHTML = '';
                 
                 const response = await fetch(`/api/v1/workloads/${namespace}/${workload}/metrics?time_range=${timeRange}`);
                 const data = await response.json();
@@ -1544,11 +1549,15 @@
                 if (data.workload_metrics) {
                     renderMetricsData(data);
                 } else {
-                    metricsDiv.innerHTML = '<p>No metrics data available for this workload.</p>';
+                    if (clusterTotalDiv) clusterTotalDiv.innerHTML = '<p>No metrics data available for this workload.</p>';
+                    if (workloadDataDiv) workloadDataDiv.innerHTML = '';
                 }
             } catch (error) {
                 console.error('Error loading metrics:', error);
-                metricsDiv.innerHTML = '<p>Error loading metrics. Please try again.</p>';
+                const clusterTotalDiv = document.getElementById('clusterTotal');
+                const workloadDataDiv = document.getElementById('workloadData');
+                if (clusterTotalDiv) clusterTotalDiv.innerHTML = '<p>Error loading metrics. Please try again.</p>';
+                if (workloadDataDiv) workloadDataDiv.innerHTML = '';
             }
         }