“No data found” message not centered in Expense Breakdown chart

src/components/Dashboard/ExpenseAnalysis.jsx

@@ -105,9 +105,15 @@ const ExpenseAnalysis = () => {
         )}
 
         {!isLoading && report.length === 0 && (
-            <div className="text-center py-5 text-muted">No data found</div>
+          <div
+            className="d-flex justify-content-center align-items-center text-dark flex-column"
+            style={{ minHeight: "300px" }}
+          >
+            <p className="mb-0 text-muted">No data found</p>
+          </div>
         )}
 
+
         {!isLoading && report.length > 0 && (
           <>
             {isFetching && (