{{ block title }}
   <center>  Report of missed units </center>
{{ endblock }}

{{ block content }}
<style>
    .box {
        border: 1px solid lightgrey; /* Light grey border */
        padding: 20px; /* Adds space around the text inside the box */
        background-color: #f7f7f7; /* Optional: Light grey background */
    }
</style>
<br>
<div class = "box">
<center>

 Please, estimate <b> how many work units did you miss </b>
    because of the issue. <br> <br>
    <i> Only integer numbers are valid. </i>
<br>

{{ formfields }}
     </center>
    </div>
<br>
<center>
      <script>
    document.addEventListener("DOMContentLoaded", function() {
        let inputField = document.querySelector("input[name = 'missed_units']");
        if (inputField && inputField.value) {
            inputField.value = ''; // Clear initial value
        }
    });
</script>



{{ next_button }}
</center>

{{ endblock }}