drag and drop not working when fileUpload in a modal

[tomasoma]

hello
i've a modal component like this (css from bootstrap 5.0.2)

<template>
  <teleport to="body">
    <section class="position-fixed top-0 start-0 vh-100 vw-100 bg-secondary bg-opacity-50 overflow-scroll" @click="close">
      <div class="position-absolute start-50 translate-middle-x py-5" :class="modalClass.join(' ')"
        @click="(e) => { e.stopPropagation() }">
        <div class="p-3 rounded shadow bg-white">
          <div class="d-flex justify-content-between align-items-center">
            <slot name="head">titre</slot>
            <i v-if="headerCloseBtn" @click="close" class="bi bi-x fs-1"></i>
          </div>
          <main>
            <slot name="body"></slot>
          </main>
          <slot></slot>
        </div>
      </div>

    </section>
  </teleport>
</template>

and when i use FileUpload in the modal body slot the drag function does not work ....
is there any tips to make it work in a modal ?
i guess the HTML element defining the dropzone is hidden by the modal ? perhaps it would be useful to be able to define a HTML element for the dropzone ?