I have a constant sum matrix question where I'm asking participants to report out IN MINUTES… is there a  way to convert it into *hours on the total (gray line) rather than it displaying as an additional line? 

*I do have Javascript set up but it’s displaying as an additional line rather than the “total” line in gray. Also something is incorrect with the JS  - as you can see below the total is truly 180 minutes, which is 3 hours, but somehow the JS is coming up with 5.1hours.

Qualtrics.SurveyEngine.addOnload(function () {
    const qContainer = this.getQuestionContainer();
    const inputs = qContainer.querySelectorAll('inputytype="text"]');

    // Create a display element for the total in hours
    const totalDisplay = document.createElement('div');
    totalDisplay.style.marginTop = '15px';
    totalDisplay.style.fontWeight = 'bold';
    totalDisplay.textContent = 'Total Time: 0 hours';
    qContainer.appendChild(totalDisplay);

    // Function to calculate and update total in hours
    function updateTotal() {
        let totalMinutes = 0;

        inputs.forEach(input => {
            const val = parseFloat(input.value);
            if (!isNaN(val)) {
                totalMinutes += val;
            }
        });

        const totalHours = (totalMinutes / 60).toFixed(2);
        totalDisplay.textContent = `Total Time: ${totalHours} hours`;
    }

    // Attach listener to each input
    inputs.forEach(input => {
        input.addEventListener('input', updateTotal);
    });

    updateTotal(); // Initial update

-------I also have tried displaying it in hours and minutes using the below code and it also is not totaling correctly:

 

Qualtrics.SurveyEngine.addOnload(function () {
    const qContainer = this.getQuestionContainer();
    const inputs = qContainer.querySelectorAll('inputstype="text"]');

    // Create a display element for the total in hours and minutes
    const totalDisplay = document.createElement('div');
    totalDisplay.style.marginTop = '15px';
    totalDisplay.style.fontWeight = 'bold';
    totalDisplay.textContent = 'Total Time: 0 hours 0 minutes';
    qContainer.appendChild(totalDisplay);

    // Function to calculate and update total in hours and minutes
    function updateTotal() {
        let totalMinutes = 0;
        inputs.forEach(input => {
            const val = parseFloat(input.value);
            if (!isNaN(val)) {
                totalMinutes += val;
            }
        });

        const hours = Math.floor(totalMinutes / 60);
        const minutes = Math.round(totalMinutes % 60); // Use round to avoid decimals from float errors

        // Handle pluralization for clarity
        const hourLabel = hours === 1 ? 'hour' : 'hours';
        const minuteLabel = minutes === 1 ? 'minute' : 'minutes';

        totalDisplay.textContent = `Total Time: ${hours} ${hourLabel} ${minutes} ${minuteLabel}`;
    }

    // Attach listener to each input
    inputs.forEach(input => {
        input.addEventListener('input', updateTotal);
    });

    updateTotal(); // Initial update
});