diff --git a/ipi-survey-platform/src/pages/Admin/ValidationReview.jsx b/ipi-survey-platform/src/pages/Admin/ValidationReview.jsx
index 7004a69..9d7e3d8 100644
--- a/ipi-survey-platform/src/pages/Admin/ValidationReview.jsx
+++ b/ipi-survey-platform/src/pages/Admin/ValidationReview.jsx
@@ -856,6 +856,19 @@ setAdditionalForecastMonths([
     return `${quarter} ${year}`;
   };
 
+  const sumQuarterValues = (...values) =>
+    values.reduce((total, value) => total + (Number(value) || 0), 0);
+
+  const formatQuarterValue = (value) => {
+    const numericValue = Number(value) || 0;
+
+    if (Number.isInteger(numericValue)) {
+      return numericValue.toString();
+    }
+
+    return numericValue.toFixed(2).replace(/\.?0+$/, '');
+  };
+
   if (loading) {
     return (
       <div className="min-h-screen bg-[#F6F5F1]">
@@ -1096,6 +1109,52 @@ setAdditionalForecastMonths([
                 (!product.previous_cost_period_one || Number(product.previous_cost_period_one) === 0) &&
                 (!product.previous_cost_period_two || Number(product.previous_cost_period_two) === 0) &&
                 (!product.previous_cost_period_three || Number(product.previous_cost_period_three) === 0);
+
+              const historicalData = showPreviousNext
+                ? getCurrentYearForecastData(product?.product?.id)
+                : null;
+
+              const previousQuantityTotal = sumQuarterValues(
+                product.previous_quantity_period_one,
+                product.previous_quantity_period_two,
+                product.previous_quantity_period_three
+              );
+              const currentQuantityTotal = sumQuarterValues(
+                product.current_quantity_period_one,
+                product.current_quantity_period_two,
+                product.current_quantity_period_three
+              );
+              const historicalQuantityTotal = sumQuarterValues(
+                historicalData?.forecast_quantity_period_one,
+                historicalData?.forecast_quantity_period_two,
+                historicalData?.forecast_quantity_period_three
+              );
+              const forecastQuantityTotal = sumQuarterValues(
+                product.forecast_quantity_period_one,
+                product.forecast_quantity_period_two,
+                product.forecast_quantity_period_three
+              );
+
+              const previousCostTotal = sumQuarterValues(
+                product.previous_cost_period_one,
+                product.previous_cost_period_two,
+                product.previous_cost_period_three
+              );
+              const currentCostTotal = sumQuarterValues(
+                product.current_cost_period_one,
+                product.current_cost_period_two,
+                product.current_cost_period_three
+              );
+              const historicalCostTotal = sumQuarterValues(
+                historicalData?.forecast_cost_period_one,
+                historicalData?.forecast_cost_period_two,
+                historicalData?.forecast_cost_period_three
+              );
+              const forecastCostTotal = sumQuarterValues(
+                product.forecast_cost_period_one,
+                product.forecast_cost_period_two,
+                product.forecast_cost_period_three
+              );
               
               return (
               <section key={product.id || idx} className="rounded-[16px] bg-white p-6 shadow-[0_16px_32px_rgba(15,23,42,0.08)] ring-1 ring-[#E5E7EB] space-y-5">
@@ -1216,10 +1275,16 @@ setAdditionalForecastMonths([
                       </div>
                     )}
                   </div>
-                  <table className="min-w-full text-sm text-left border-collapse">
+                 <table 
+  className="text-sm text-left border-collapse"
+  style={{ 
+    tableLayout: 'fixed', 
+    width: '100%' 
+  }}
+>
                     <thead>
                       <tr>
-                        <th rowSpan="2" className="bg-[#F2ECCF] text-[#92722A] px-4 py-3 text-xs font-semibold uppercase align-middle border-r border-[#E5E7EB] w-[180px]">
+                        <th rowSpan="2" className="bg-[#F2ECCF] text-[#92722A] px-4 py-1 text-xs font-semibold uppercase align-middle border-r border-[#E5E7EB]">
                           Metric
                         </th>
                         
@@ -1227,18 +1292,18 @@ setAdditionalForecastMonths([
                           <>
                             {/* 12 columns when showPreviousNext is true */}
                             {!shouldHidePreviousQuarter && (
-                              <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                              <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB] ">
                                 {previousLabel || 'Q1 2024'} (PREVIOUS QUARTER)
                               </th>
                             )}
-                            <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                            <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
                               {currentLabel || 'Q2 2024'} (CURRENT QUARTER)
                             </th>
-                            <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                            <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
                               {additionalForecastLabel || ''} (PREVIOUS FORECAST)
                             </th>
                             {!shouldHideForecast && (
-                              <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                              <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
                                 {forecastLabel || 'Q3 2024'} (NEXT QUARTER FORECAST)
                               </th>
                             )}
@@ -1247,15 +1312,15 @@ setAdditionalForecastMonths([
                           <>
                             {/* 9 columns when showPreviousNext is false */}
                             {!shouldHidePreviousQuarter && (
-                              <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                              <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
                                 {previousLabel || 'Q1 2024'} (PREVIOUS QUARTER)
                               </th>
                             )}
-                            <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                            <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
                               {currentLabel || 'Q2 2024'} (CURRENT QUARTER)
                             </th>
                             {!shouldHideForecast && (
-                              <th colSpan="3" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
+                              <th colSpan="4" className="bg-[#F2ECCF] text-[#92722A] px-4 py-2 text-xs font-semibold uppercase text-center border border-[#E5E7EB]">
                                 {forecastLabel || 'Q3 2024'} (NEXT QUARTER FORECAST)
                               </th>
                             )}
@@ -1278,6 +1343,9 @@ setAdditionalForecastMonths([
                                 <th className="bg-[#F4F8FF] px-3 py-2 font-medium text-[#286CFF] border border-[#E5E7EB] text-center min-w-[100px]">
                                   {previousMonths?.previous_period_three || 'Mar'}
                                 </th>
+                                <th className="bg-[#F4F8FF] px-3 py-2 font-semibold text-[#286CFF] border border-[#E5E7EB] text-center min-w-[110px]">
+                                  {previousLabel || 'Q1 2024'}
+                                </th>
                               </>
                             )}
 
@@ -1291,6 +1359,9 @@ setAdditionalForecastMonths([
                             <th className="bg-[#F3FAF4] px-3 py-2 font-medium text-[#2F663C] border border-[#E5E7EB] text-center min-w-[100px]">
                               {currentMonths?.current_period_three || 'Jun'}
                             </th>
+                            <th className="bg-[#F3FAF4] px-3 py-2 font-semibold text-[#2F663C] border border-[#E5E7EB] text-center min-w-[110px]">
+                              {currentLabel || 'Q2 2024'}
+                            </th>
 
                             {/* Previous Forecast Months */}
                             <th className="bg-purple-100 px-3 py-2 font-medium text-[#4C1D95] border border-[#E5E7EB] text-center min-w-[100px]">
@@ -1302,6 +1373,9 @@ setAdditionalForecastMonths([
                             <th className="bg-purple-100 px-3 py-2 font-medium text-[#4C1D95] border border-[#E5E7EB] text-center min-w-[100px]">
                               {additionalForecastMonths?.[2] || 'Sep'}
                             </th>
+                            <th className="bg-purple-100 px-3 py-2 font-semibold text-[#4C1D95] border border-[#E5E7EB] text-center min-w-[110px]">
+                              {additionalForecastLabel || ''}
+                            </th>
 
                             {/* Next Year Forecast Months */}
                             {!shouldHideForecast && (
@@ -1315,6 +1389,9 @@ setAdditionalForecastMonths([
                                 <th className="bg-[#FFF6EC] px-3 py-2 font-medium text-[#F29F0E] border border-[#E5E7EB] text-center min-w-[100px]">
                                   {forecastMonths?.forecast_period_three || 'Dec'}
                                 </th>
+                                <th className="bg-[#FFF6EC] px-3 py-2 font-semibold text-[#F29F0E] border border-[#E5E7EB] text-center min-w-[110px]">
+                                  {forecastLabel || 'Q3 2024'}
+                                </th>
                               </>
                             )}
                           </>
@@ -1332,6 +1409,9 @@ setAdditionalForecastMonths([
                                 <th className="bg-[#F4F8FF] px-3 py-2 font-medium text-[#286CFF] border border-[#E5E7EB] text-center min-w-[100px]">
                                   {previousMonths?.previous_period_three || 'Mar'}
                                 </th>
+                                <th className="bg-[#F4F8FF] px-3 py-2 font-semibold text-[#286CFF] border border-[#E5E7EB] text-center min-w-[110px]">
+                                  {previousLabel || 'Q1 2024'}
+                                </th>
                               </>
                             )}
 
@@ -1345,6 +1425,9 @@ setAdditionalForecastMonths([
                             <th className="bg-[#F3FAF4] px-3 py-2 font-medium text-[#2F663C] border border-[#E5E7EB] text-center min-w-[100px]">
                               {currentMonths?.current_period_three || 'Jun'}
                             </th>
+                            <th className="bg-[#F3FAF4] px-3 py-2 font-semibold text-[#2F663C] border border-[#E5E7EB] text-center min-w-[110px]">
+                              {currentLabel || 'Q2 2024'}
+                            </th>
 
                             {/* Next Year Forecast Months */}
                             {!shouldHideForecast && (
@@ -1358,6 +1441,9 @@ setAdditionalForecastMonths([
                                 <th className="bg-[#FFF6EC] px-3 py-2 font-medium text-[#F29F0E] border border-[#E5E7EB] text-center min-w-[100px]">
                                   {forecastMonths?.forecast_period_three || 'Sep'}
                                 </th>
+                                <th className="bg-[#FFF6EC] px-3 py-2 font-semibold text-[#F29F0E] border border-[#E5E7EB] text-center min-w-[110px]">
+                                  {forecastLabel || 'Q3 2024'}
+                                </th>
                               </>
                             )}
                           </>
@@ -1411,6 +1497,11 @@ setAdditionalForecastMonths([
                                     )}
                                   </div>
                                 </td>
+                                <td className="px-3 py-3 border border-[#E5E7EB] text-center bg-[#F9FBFF]">
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{formatQuarterValue(previousQuantityTotal)}</span>
+                                  </div>
+                                </td>
                               </>
                             )}
 
@@ -1455,33 +1546,42 @@ setAdditionalForecastMonths([
                                 )}
                               </div>
                             </td>
+                            <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(previousQuantityTotal, currentQuantityTotal, shouldHidePreviousQuarter, 'quantity')} ${getBorderClass(previousQuantityTotal, currentQuantityTotal, shouldHidePreviousQuarter, 'quantity')}`}>
+                              <div className="flex flex-col items-center justify-center">
+                                <span className="font-medium">{formatQuarterValue(currentQuantityTotal)}</span>
+                                {!shouldHidePreviousQuarter && getVarianceDisplay(previousQuantityTotal, currentQuantityTotal)}
+                              </div>
+                            </td>
 
                             {/* HISTORICAL Data (from API) */}
-                            {showPreviousNext && (() => {
-                              const historicalData = getCurrentYearForecastData(product?.product?.id);
-                              return (
-                                <>
-                                  <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(product.current_quantity_period_three, historicalData.forecast_quantity_period_one, false, 'quantity')} ${getBorderClass(product.current_quantity_period_three, historicalData.forecast_quantity_period_one, false, 'quantity')}`}>
-                                    <div className="flex flex-col items-center justify-center">
-                                      <span className="font-medium">{historicalData.forecast_quantity_period_one || '0'}</span>
-                                      {getVarianceDisplay(product.current_quantity_period_three, historicalData.forecast_quantity_period_one)}
-                                    </div>
-                                  </td>
-                                  <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_quantity_period_one, historicalData.forecast_quantity_period_two, false, 'quantity')} ${getBorderClass(historicalData.forecast_quantity_period_one, historicalData.forecast_quantity_period_two, false, 'quantity')}`}>
-                                    <div className="flex flex-col items-center justify-center">
-                                      <span className="font-medium">{historicalData.forecast_quantity_period_two || '0'}</span>
-                                      {getVarianceDisplay(historicalData.forecast_quantity_period_one, historicalData.forecast_quantity_period_two)}
-                                    </div>
-                                  </td>
-                                  <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_quantity_period_two, historicalData.forecast_quantity_period_three, false, 'quantity')} ${getBorderClass(historicalData.forecast_quantity_period_two, historicalData.forecast_quantity_period_three, false, 'quantity')}`}>
-                                    <div className="flex flex-col items-center justify-center">
-                                      <span className="font-medium">{historicalData.forecast_quantity_period_three || '0'}</span>
-                                      {getVarianceDisplay(historicalData.forecast_quantity_period_two, historicalData.forecast_quantity_period_three)}
-                                    </div>
-                                  </td>
-                                </>
-                              );
-                            })()}
+                            {showPreviousNext && (
+                              <>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(product.current_quantity_period_three, historicalData.forecast_quantity_period_one, false, 'quantity')} ${getBorderClass(product.current_quantity_period_three, historicalData.forecast_quantity_period_one, false, 'quantity')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{historicalData.forecast_quantity_period_one || '0'}</span>
+                                    {getVarianceDisplay(product.current_quantity_period_three, historicalData.forecast_quantity_period_one)}
+                                  </div>
+                                </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_quantity_period_one, historicalData.forecast_quantity_period_two, false, 'quantity')} ${getBorderClass(historicalData.forecast_quantity_period_one, historicalData.forecast_quantity_period_two, false, 'quantity')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{historicalData.forecast_quantity_period_two || '0'}</span>
+                                    {getVarianceDisplay(historicalData.forecast_quantity_period_one, historicalData.forecast_quantity_period_two)}
+                                  </div>
+                                </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_quantity_period_two, historicalData.forecast_quantity_period_three, false, 'quantity')} ${getBorderClass(historicalData.forecast_quantity_period_two, historicalData.forecast_quantity_period_three, false, 'quantity')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{historicalData.forecast_quantity_period_three || '0'}</span>
+                                    {getVarianceDisplay(historicalData.forecast_quantity_period_two, historicalData.forecast_quantity_period_three)}
+                                  </div>
+                                </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(currentQuantityTotal, historicalQuantityTotal, false, 'quantity')} ${getBorderClass(currentQuantityTotal, historicalQuantityTotal, false, 'quantity')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{formatQuarterValue(historicalQuantityTotal)}</span>
+                                    {getVarianceDisplay(currentQuantityTotal, historicalQuantityTotal)}
+                                  </div>
+                                </td>
+                              </>
+                            )}
                             
                             {/* NEXT YEAR FORECAST Data (original from submission) */}
                             {!shouldHideForecast && (
@@ -1504,6 +1604,12 @@ setAdditionalForecastMonths([
                                     {getVarianceDisplay(product.forecast_quantity_period_two, product.forecast_quantity_period_three)}
                                   </div>
                                 </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(showPreviousNext ? historicalQuantityTotal : currentQuantityTotal, forecastQuantityTotal, false, 'quantity')} ${getBorderClass(showPreviousNext ? historicalQuantityTotal : currentQuantityTotal, forecastQuantityTotal, false, 'quantity')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{formatQuarterValue(forecastQuantityTotal)}</span>
+                                    {getVarianceDisplay(showPreviousNext ? historicalQuantityTotal : currentQuantityTotal, forecastQuantityTotal)}
+                                  </div>
+                                </td>
                               </>
                             )}
                           </>
@@ -1543,6 +1649,13 @@ setAdditionalForecastMonths([
                                 </div>
                               </td>
                             )}
+                            {!shouldHidePreviousQuarter && (
+                              <td className="px-3 py-3 border border-[#E5E7EB] text-center bg-[#F9FBFF]">
+                                <div className="flex flex-col items-center justify-center">
+                                  <span className="font-medium">{formatQuarterValue(previousQuantityTotal)}</span>
+                                </div>
+                              </td>
+                            )}
 
                             {/* Current Quarter – Month 1 */}
                             <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(shouldHidePreviousQuarter ? null : product.previous_quantity_period_three, product.current_quantity_period_one, shouldHidePreviousQuarter ? false : isPreviousQuarterAllZeros, 'quantity')} ${getBorderClass(shouldHidePreviousQuarter ? null : product.previous_quantity_period_three, product.current_quantity_period_one, shouldHidePreviousQuarter ? false : isPreviousQuarterAllZeros, 'quantity')}`}>
@@ -1576,6 +1689,12 @@ setAdditionalForecastMonths([
                                 )}
                               </div>
                             </td>
+                            <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(previousQuantityTotal, currentQuantityTotal, shouldHidePreviousQuarter, 'quantity')} ${getBorderClass(previousQuantityTotal, currentQuantityTotal, shouldHidePreviousQuarter, 'quantity')}`}>
+                              <div className="flex flex-col items-center justify-center">
+                                <span className="font-medium">{formatQuarterValue(currentQuantityTotal)}</span>
+                                {!shouldHidePreviousQuarter && getVarianceDisplay(previousQuantityTotal, currentQuantityTotal)}
+                              </div>
+                            </td>
 
                             {/* Next Year Forecast – Month 1 */}
                             {!shouldHideForecast && (
@@ -1615,6 +1734,14 @@ setAdditionalForecastMonths([
                                 </div>
                               </td>
                             )}
+                            {!shouldHideForecast && (
+                              <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(currentQuantityTotal, forecastQuantityTotal, false, 'quantity')} ${getBorderClass(currentQuantityTotal, forecastQuantityTotal, false, 'quantity')}`}>
+                                <div className="flex flex-col items-center justify-center">
+                                  <span className="font-medium">{formatQuarterValue(forecastQuantityTotal)}</span>
+                                  {getVarianceDisplay(currentQuantityTotal, forecastQuantityTotal)}
+                                </div>
+                              </td>
+                            )}
                           </>
                         )}
                       </tr>
@@ -1662,6 +1789,11 @@ setAdditionalForecastMonths([
                                     )}
                                   </div>
                                 </td>
+                                <td className="px-3 py-3 border border-[#E5E7EB] text-center bg-[#F9FBFF]">
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{formatQuarterValue(previousCostTotal)}</span>
+                                  </div>
+                                </td>
                               </>
                             )}
 
@@ -1684,33 +1816,42 @@ setAdditionalForecastMonths([
                                 {getVarianceDisplay(product.current_cost_period_two, product.current_cost_period_three)}
                               </div>
                             </td>
+                            <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(previousCostTotal, currentCostTotal, shouldHidePreviousQuarter, 'value')} ${getBorderClass(previousCostTotal, currentCostTotal, shouldHidePreviousQuarter, 'value')}`}>
+                              <div className="flex flex-col items-center justify-center">
+                                <span className="font-medium">{formatQuarterValue(currentCostTotal)}</span>
+                                {!shouldHidePreviousQuarter && getVarianceDisplay(previousCostTotal, currentCostTotal)}
+                              </div>
+                            </td>
 
                             {/* HISTORICAL Cost (from API) */}
-                            {showPreviousNext && (() => {
-                              const historicalData = getCurrentYearForecastData(product?.product?.id);
-                              return (
-                                <>
-                                  <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(product.current_cost_period_three, historicalData.forecast_cost_period_one, false, 'value')} ${getBorderClass(product.current_cost_period_three, historicalData.forecast_cost_period_one, false, 'value')}`}>
-                                    <div className="flex flex-col items-center justify-center">
-                                      <span className="font-medium">{historicalData.forecast_cost_period_one || '0'}</span>
-                                      {getVarianceDisplay(product.current_cost_period_three, historicalData.forecast_cost_period_one)}
-                                    </div>
-                                  </td>
-                                  <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_cost_period_one, historicalData.forecast_cost_period_two, false, 'value')} ${getBorderClass(historicalData.forecast_cost_period_one, historicalData.forecast_cost_period_two, false, 'value')}`}>
-                                    <div className="flex flex-col items-center justify-center">
-                                      <span className="font-medium">{historicalData.forecast_cost_period_two || '0'}</span>
-                                      {getVarianceDisplay(historicalData.forecast_cost_period_one, historicalData.forecast_cost_period_two)}
-                                    </div>
-                                  </td>
-                                  <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_cost_period_two, historicalData.forecast_cost_period_three, false, 'value')} ${getBorderClass(historicalData.forecast_cost_period_two, historicalData.forecast_cost_period_three, false, 'value')}`}>
-                                    <div className="flex flex-col items-center justify-center">
-                                      <span className="font-medium">{historicalData.forecast_cost_period_three || '0'}</span>
-                                      {getVarianceDisplay(historicalData.forecast_cost_period_two, historicalData.forecast_cost_period_three)}
-                                    </div>
-                                  </td>
-                                </>
-                              );
-                            })()}
+                            {showPreviousNext && (
+                              <>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(product.current_cost_period_three, historicalData.forecast_cost_period_one, false, 'value')} ${getBorderClass(product.current_cost_period_three, historicalData.forecast_cost_period_one, false, 'value')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{historicalData.forecast_cost_period_one || '0'}</span>
+                                    {getVarianceDisplay(product.current_cost_period_three, historicalData.forecast_cost_period_one)}
+                                  </div>
+                                </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_cost_period_one, historicalData.forecast_cost_period_two, false, 'value')} ${getBorderClass(historicalData.forecast_cost_period_one, historicalData.forecast_cost_period_two, false, 'value')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{historicalData.forecast_cost_period_two || '0'}</span>
+                                    {getVarianceDisplay(historicalData.forecast_cost_period_one, historicalData.forecast_cost_period_two)}
+                                  </div>
+                                </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(historicalData.forecast_cost_period_two, historicalData.forecast_cost_period_three, false, 'value')} ${getBorderClass(historicalData.forecast_cost_period_two, historicalData.forecast_cost_period_three, false, 'value')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{historicalData.forecast_cost_period_three || '0'}</span>
+                                    {getVarianceDisplay(historicalData.forecast_cost_period_two, historicalData.forecast_cost_period_three)}
+                                  </div>
+                                </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(currentCostTotal, historicalCostTotal, false, 'value')} ${getBorderClass(currentCostTotal, historicalCostTotal, false, 'value')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{formatQuarterValue(historicalCostTotal)}</span>
+                                    {getVarianceDisplay(currentCostTotal, historicalCostTotal)}
+                                  </div>
+                                </td>
+                              </>
+                            )}
                             
                             {/* NEXT YEAR FORECAST Cost (original from submission) */}
                             {!shouldHideForecast && (
@@ -1733,6 +1874,12 @@ setAdditionalForecastMonths([
                                     {getVarianceDisplay(product.forecast_cost_period_two, product.forecast_cost_period_three)}
                                   </div>
                                 </td>
+                                <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(showPreviousNext ? historicalCostTotal : currentCostTotal, forecastCostTotal, false, 'value')} ${getBorderClass(showPreviousNext ? historicalCostTotal : currentCostTotal, forecastCostTotal, false, 'value')}`}>
+                                  <div className="flex flex-col items-center justify-center">
+                                    <span className="font-medium">{formatQuarterValue(forecastCostTotal)}</span>
+                                    {getVarianceDisplay(showPreviousNext ? historicalCostTotal : currentCostTotal, forecastCostTotal)}
+                                  </div>
+                                </td>
                               </>
                             )}
                           </>
@@ -1772,6 +1919,13 @@ setAdditionalForecastMonths([
                                 </div>
                               </td>
                             )}
+                            {!shouldHidePreviousQuarter && (
+                              <td className="px-3 py-3 border border-[#E5E7EB] text-center bg-[#F9FBFF]">
+                                <div className="flex flex-col items-center justify-center">
+                                  <span className="font-medium">{formatQuarterValue(previousCostTotal)}</span>
+                                </div>
+                              </td>
+                            )}
 
                             {/* Current Cost – Month 1 */}
                             <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(shouldHidePreviousQuarter ? null : product.previous_cost_period_three, product.current_cost_period_one, shouldHidePreviousQuarter ? false : isPreviousQuarterCostAllZeros, 'value')} ${getBorderClass(shouldHidePreviousQuarter ? null : product.previous_cost_period_three, product.current_cost_period_one, shouldHidePreviousQuarter ? false : isPreviousQuarterCostAllZeros, 'value')}`}>
@@ -1805,6 +1959,12 @@ setAdditionalForecastMonths([
                                 )}
                               </div>
                             </td>
+                            <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(previousCostTotal, currentCostTotal, shouldHidePreviousQuarter, 'value')} ${getBorderClass(previousCostTotal, currentCostTotal, shouldHidePreviousQuarter, 'value')}`}>
+                              <div className="flex flex-col items-center justify-center">
+                                <span className="font-medium">{formatQuarterValue(currentCostTotal)}</span>
+                                {!shouldHidePreviousQuarter && getVarianceDisplay(previousCostTotal, currentCostTotal)}
+                              </div>
+                            </td>
 
                             {/* Forecast Cost – Month 1 */}
                             {!shouldHideForecast && (
@@ -1844,6 +2004,14 @@ setAdditionalForecastMonths([
                                 </div>
                               </td>
                             )}
+                            {!shouldHideForecast && (
+                              <td className={`px-3 py-3 border border-[#E5E7EB] text-center ${getCellClass(currentCostTotal, forecastCostTotal, false, 'value')} ${getBorderClass(currentCostTotal, forecastCostTotal, false, 'value')}`}>
+                                <div className="flex flex-col items-center justify-center">
+                                  <span className="font-medium">{formatQuarterValue(forecastCostTotal)}</span>
+                                  {getVarianceDisplay(currentCostTotal, forecastCostTotal)}
+                                </div>
+                              </td>
+                            )}
                           </>
                         )}
                       </tr>
@@ -1855,11 +2023,11 @@ setAdditionalForecastMonths([
                         {showPreviousNext ? (
                           <>
                             {!shouldHidePreviousQuarter && (
-                              <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                              <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                                 –
                               </td>
                             )}
-                            <td colSpan="3" className="px-4 py-3 text-center bg-[#E9F6EC] text-[#1E7C34] font-medium border border-[#E5E7EB]">
+                            <td colSpan="4" className="px-4 py-3 text-center bg-[#E9F6EC] text-[#1E7C34] font-medium border border-[#E5E7EB]">
                               {product.other_variation_reason || 
                                 (product?.variation_reason?.reason ? 
                                   (product.variation_reason.reason.startsWith('Other (specify)') ? '' : product.variation_reason.reason) 
@@ -1867,11 +2035,11 @@ setAdditionalForecastMonths([
                               }
                             </td>
                             {/* Previous Forecast (colSpan 3) */}
-                            <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                            <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                               –
                             </td>
                             {!shouldHideForecast && (
-                              <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                              <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                                 –
                               </td>
                             )}
@@ -1879,11 +2047,11 @@ setAdditionalForecastMonths([
                         ) : (
                           <>
                             {!shouldHidePreviousQuarter && (
-                              <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                              <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                                 –
                               </td>
                             )}
-                            <td colSpan="3" className="px-4 py-3 text-center bg-[#E9F6EC] text-[#1E7C34] font-medium border border-[#E5E7EB]">
+                            <td colSpan="4" className="px-4 py-3 text-center bg-[#E9F6EC] text-[#1E7C34] font-medium border border-[#E5E7EB]">
                               {product.other_variation_reason || 
                                 (product?.variation_reason?.reason ? 
                                   (product.variation_reason.reason.startsWith('Other (specify)') ? '' : product.variation_reason.reason) 
@@ -1891,7 +2059,7 @@ setAdditionalForecastMonths([
                               }
                             </td>
                             {!shouldHideForecast && (
-                              <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                              <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                                 –
                               </td>
                             )}
@@ -1906,18 +2074,18 @@ setAdditionalForecastMonths([
                         {showPreviousNext ? (
                           <>
                             {!shouldHidePreviousQuarter && (
-                              <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                              <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                                 –
                               </td>
                             )}
-                            <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                            <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                               –
                             </td>
-                            <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                            <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                               –
                             </td>
                             {!shouldHideForecast && (
-                              <td colSpan="3" className="px-4 py-3 text-center bg-[#FFF2E0] text-[#D97706] font-medium border border-[#E5E7EB]">
+                              <td colSpan="4" className="px-4 py-3 text-center bg-[#FFF2E0] text-[#D97706] font-medium border border-[#E5E7EB]">
                                 {product.other_zero_target_reason || 
                                   (product?.zero_target_reason?.reason ? 
                                     (product.zero_target_reason.reason.startsWith('Other (specify)') ? '' : product.zero_target_reason.reason) 
@@ -1929,15 +2097,15 @@ setAdditionalForecastMonths([
                         ) : (
                           <>
                             {!shouldHidePreviousQuarter && (
-                              <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                              <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                                 –
                               </td>
                             )}
-                            <td colSpan="3" className="text-center text-[#6B7280] border border-[#E5E7EB]">
+                            <td colSpan="4" className="text-center text-[#6B7280] border border-[#E5E7EB]">
                               –
                             </td>
                             {!shouldHideForecast && (
-                              <td colSpan="3" className="px-4 py-3 text-center bg-[#FFF2E0] text-[#D97706] font-medium border border-[#E5E7EB]">
+                              <td colSpan="4" className="px-4 py-3 text-center bg-[#FFF2E0] text-[#D97706] font-medium border border-[#E5E7EB]">
                                 {product.other_zero_target_reason || 
                                   (product?.zero_target_reason?.reason ? 
                                     (product.zero_target_reason.reason.startsWith('Other (specify)') ? '' : product.zero_target_reason.reason)