I'm trying to calculate quantity * unit cost to display a total for each line within the Visualforce page so that it changes as the user enters in new values. I also want that column to display a grand total in the footer, but when the page loads, the line totals are calculated, but the grand total doesn't. If I do get the grand total to work, it'll only work if I change the input fields. I'm not really sure how to set it up so that this will work. Any help is appreciated. Thanks!
 

<apex:page lightningStylesheets="true"
           docType="html-5.0"
           standardController="Purchase_Order_Line__c"
           extensions="createVendorInvoice"
           recordSetVar="POLines"
           action="{!retreiveLines}">
    <apex:form >
        <apex:pageBlock title="Create Vendor Invoice from PO Lines">
            <apex:pageBlockButtons >
                <apex:commandButton action="{!Cancel}" value="Cancel"/>
                <apex:commandButton action="{!createVendorInvoice}" value="Submit"/>
            </apex:pageBlockButtons>

            
            <apex:variable var="total" value="{!0}"/>
            <apex:variable var="grandTotal" value="{!0}"/>
            <apex:pageBlockTable value="{!selectedLines}" var="line" >
                <apex:column value="{!line.Name}"/>
                <apex:column value="{!line.Product__c}"/>
                <apex:column value="{!line.Order_Quantity__c}"/>
                <apex:column value="{!line.Open_Quantity__c}"/>
                <apex:column value="{!line.Quantity_Received__c}"/>
                <apex:column headerValue="Invoice Quantity">
                    <apex:actionRegion >
                        <apex:inputField value="{!line.Set_Invoice_QTY__c}">
                            <apex:actionSupport event="onchange" reRender="total"/>
                        </apex:inputField>
                    </apex:actionRegion> 
                </apex:column>
                <apex:column headerValue="Unit Price">
                    <apex:actionRegion >
                        <apex:inputField value="{!line.Unit_Cost__c}">
                            <apex:actionSupport event="onchange" reRender="total"/>
                        </apex:inputField>
                    </apex:actionRegion>    
                </apex:column>
                <apex:column headerValue="Total" id="column">
                    <apex:outputText id="total" value="{0, number, 0.00}">
                        <apex:param value="{!line.Set_Invoice_QTY__c * line.Unit_Cost__c }"/>
                        <apex:variable id="x" var="grandTotal" value="{!grandTotal + total}"/>
                    </apex:outputText>
                    <apex:facet name="footer">
                        <apex:outputText id="grandTotal" value="{0, number, 0.00}">
                            <apex:param value="{!grandTotal}" />
                        </apex:outputText>
                    </apex:facet> 
                </apex:column>  
            </apex:pageBlockTable>
        </apex:pageBlock>
    </apex:form> 
</apex:page>