<section class="facility-form-overview">
    {{> molecules-new-disp-step1 }}
    {{> molecules-new-disp-step2 }}
    {{> molecules-new-disp-step3 }}
</section>
<script>
    // Get the current date and time
    const now = new Date();

    // Format the date and time based on the user's locale
    const formattedDateTime = now.toLocaleString();  // Automatically uses the system's locale

    // Insert the current date and time into the first <time> field
    document.getElementById('current-time').setAttribute('datetime', now.toISOString());
    document.getElementById('current-time').textContent = formattedDateTime;

    // Calculate the next time (one hour later)
    const nextTime = new Date(now.getTime() + 60 * 60 * 1000);  // Adds one hour (60 minutes * 60 seconds * 1000 ms)

    // Format the next time based on the user's locale
    const formattedNextTime = nextTime.toLocaleString();

    // Insert the next time into the second <time> field
    document.getElementById('next-time').setAttribute('datetime', nextTime.toISOString());
    document.getElementById('next-time').textContent = formattedNextTime;
</script>