upload order form button + download order form. use in custom liquid block

<style>.file-upload-container {display: flex;align-items: center;}.file-name {margin-left: 10px;font-style: italic;}</style>
<div class="product-form__input">
  <label class="form__label">Axle Order Form</label>
  <div class="file-upload-container">
    <input id="file-axle-order-form" form="{{ 'product-form-' | append: section.id }}" 
    name="properties[Axle Order Form]"  style="display: none;" type="file" required />
    <button id="button-axle-order-form" class="button">Upload File</button>
    <p id="fileName-axle-order-form" class="file-name">No file chosen</p>
    </div>
    <p id="errorMessage" class="error-message" style="display: none;margin-top:0;color:red">Please upload your file(s).</p>
</div>
<script>
document.getElementById('file-axle-order-form').addEventListener('change', function(event) {
      const files = event.target.files;
      let fileName;
      if (files.length === 0) {fileName = 'No file chosen';} 
      else if (files.length === 1) {fileName = files[0].name;document.getElementById('errorMessage').style.display = 'none'; } 
      else {fileName = files.length + ' files';document.getElementById('errorMessage').style.display = 'none';}
      document.getElementById('fileName-axle-order-form').textContent = fileName;
  });
  document.getElementById('button-axle-order-form').addEventListener('click', function() {
    document.getElementById('file-axle-order-form').click();
  });
</script>

    <script>
    document.addEventListener('DOMContentLoaded', () => {
        document.querySelector('.product-form__submit').addEventListener('click', function(event) {
        const inputFile = document.getElementById('file-axle-order-form');
        if (!inputFile.files.length && inputFile.required) {
            document.getElementById('errorMessage').style.display = 'block'; 
        }
    });})</script>


    <script>
    document.addEventListener("DOMContentLoaded", ()=>{document.querySelector("form[novalidate]").removeAttribute("novalidate")})
    </script>
<div> <a href="https://cdn.shopify.com/s/files/1/0728/4093/7722/files/CRP-Axle-Order-Form.pdf?v=1740524771">Download Axle Order Form</a> </div>