Monthly Expense title and category dropdown should be in one line

src/components/Dashboard/ExpenseByProject.jsx

@@ -62,6 +62,11 @@ const ExpenseByProject = () => {
     xaxis: {
       categories: chartData.categories,
       labels: { style: { fontSize: "12px" }, rotate: -45 },
+    },
+     yaxis: {
+      labels: {
+        formatter: (val) => formatCurrency(val), 
+      },
     },
     tooltip: {
       y: {
@@ -85,12 +90,12 @@ const ExpenseByProject = () => {
     <div className="card shadow-sm rounded ">
       {/* Header */}
       <div className="card-header">
-        <div className="d-flex justify-content-start align-items-center mb-3 mt-3">
+        <div className="d-flex justify-content-start align-items-center mb-3 mt-0">
           <div className="text-start">
             <h5 className="mb-1 me-6 card-title">Monthly Expense -</h5>
             <p className="card-subtitle m-0">{projectName}</p>
           </div>
-          <div className="btn-group mb-4 ms-n8">
+          <div className="btn-group mb-5 ms-n8">
             <button
               className="btn btn-sm dropdown-toggle fs-5"
               type="button"
@@ -143,7 +148,7 @@ const ExpenseByProject = () => {
           ))}
           {viewMode === "Category" && (
             <select
-              className="form-select form-select-sm ms-auto mb-3 mt-1 mt-sm-0"
+              className="form-select me-5 form-select-sm ms-auto mb-3 mt-1 mt-sm-0"
               value={selectedType}
               onChange={(e) => setSelectedType(e.target.value)}
               disabled={typeLoading}
@@ -161,7 +166,7 @@ const ExpenseByProject = () => {
       </div>
 
       {/* Chart */}
-      <div className="card-body bg-white text-dark p-3 rounded" style={{ minHeight: "210px" }}>
+      <div className="card-body bg-white text-dark p-2 rounded" style={{ minHeight: "210px" }}>
         {isLoading ? (
           <p>Loading chart...</p>
         ) : !expenseApiData || expenseApiData.length === 0 ? (