<turbo-stream action="update" target="visual"><template>
  <div
  id="visual-comments-18"
  data-controller="modal"
  data-modal-show-value="true"
  tabindex="-1"
  aria-hidden="true"
  class="fixed hidden top-0 left-0 right-0 z-50 w-full px-8 py-10 overflow-x-hidden overflow-y-auto md:inset-0 h-modal md:h-full">
  <div class="relative md:h-auto">
    <div class="relative bg-white rounded-xl shadow-xl overflow-x-hidden flex flex-col max-w-7xl w-full h-full ">
      <button type="button" data-modal-hide="visual-comments-18" data-action="modal#hide" class="absolute top-3 right-2 text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 flex items-center z-50 ">
        <i class="fa fa-close p-1"></i>
        <span class=" sr-only ">Fermer</span>
      </button>
      <div class="sticky top-0">
      </div>
      <div class="flex-1 overflow-y-auto">
        <div class="">
          
    <div class="flex max-h-[90vh] overflow-hidden">
    <div class=" flex flex-col relative bg-black justify-center items-center">
      <div class="relative">
              <img data-controller="annotation" data-annotation-nextpoint-value="1" class="max-h-full" src="https://eben-prod.s3.eu-west-3.amazonaws.com/vaskrlqoa7rwp2l3qi3nm4bagz1f?response-content-disposition=inline%3B%20filename%3D%22STH%20-%20APD%20-%2019.08.23.png%22%3B%20filename%2A%3DUTF-8%27%27STH%2520-%2520APD%2520-%252019.08.23.png&amp;response-content-type=image%2Fpng&amp;X-Amz-Algorithm=AWS4-HMAC-SHA256&amp;X-Amz-Credential=AKIART2ZCSFZDABJ7PEM%2F20260404%2Feu-west-3%2Fs3%2Faws4_request&amp;X-Amz-Date=20260404T063011Z&amp;X-Amz-Expires=300&amp;X-Amz-SignedHeaders=host&amp;X-Amz-Signature=d5d2990d2b4ade69e6cc96c2e992db2c116d33e006899a0aaf8a44993372bd8f" />
      </div>
      <div class="p-4 self-start">
        <div class="text-gray-50 text-lg font-semibold leading-normal truncate">STH - APD - 19.08.23.pdf</div>
        <div class="text-gray-200 text-sm leading-tight">
            5,19 Mo
        </div>
      </div>
    </div>
    <turbo-frame class="flex flex-col flex-1 bg-gray-50 min-w-[350px] max-w-[500px]" id="comments_visual_18">
  <div class="p-4 text-gray-900 text-base font-semibold leading-tight border-b border-gray-200">Commentaires</div>
  <div class="flex flex-col-reverse overflow-y-scroll scrollbar-stable-transparent flex-grow pr-2">
  </div>
    <form id="new_comment" class="flex flex-col gap-2 p-4" action="/c/projects/eef3d34a-eb5d-4e63-9aa4-3cc94b2d14a6/visuals/18/comments" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="vR3-Bga0VXuTVqfs7urKKEK8GKU_9_u8LisAC5Kd4vcigVINYv9jW3Z_99cxJIuCUtDoDSNvH8D7VhLOI1CbpQ" autocomplete="off" />
      <input autocomplete="off" type="hidden" name="comment[x]" id="comment_x" />
      <input autocomplete="off" type="hidden" name="comment[y]" id="comment_y" />
      <div class="flex gap-3">
          <div id="new_comment_point" class="opacity-0 annotation-point-comment">1</div>
        <textarea required="required" placeholder="Ajoutez votre commentaire" class="mh-12 resize-none rounded border border-gray-200 bg-gray-50 placeholder:text-gray-500 flex-1" autocomplete="off" name="comment[message]" id="comment_message">
</textarea>
      </div>
      <button class=" justify-center items-center gap-1  rounded flex bg-eben-600 text-white px-4 py-2 text-base w-fit h-fit self-end text-sm cursor-pointer disabled:opacity-50" type="submit" name="commit" value="Envoyer">
    <i class="inline-block pr-2 fas fa-paper-plane"></i>
  <span class="line-clamp-1 max-sm:text-left">Envoyer</span>
</button>
</form></turbo-frame>
</div>


        </div>
      </div>
        <div class="sticky bottom-0 ">
        </div>
    </div>
  </div>
</div>
</template></turbo-stream>