Vypsání výdejního místa PPL skrz posluchač addEventListener

<h1>PPL</h1>

    <style>

      /* CSS for the modal overlay */
      .modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.75);
        display: none;
      }

      /* CSS for the modal box */
      .modal-box {
        position: absolute;
        width:98%;
        left:15px;
        margin: 0 auto;
        height: 720px;
        display: none;
        z-index:99999;
      }

      #close-modal-button {
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 9999;
        font-weight:bold;color:#fff; background:#174290; padding:.5em;width:100px;cursor:pointer
      }

      .ppl-parcelshop-map {
        height: 100%;
        max-height: 640px;
      }
    </style>
    


    <button id="modal-button">Open Modal</button>

    <!-- Modal overlay -->
    <div class="modal-overlay"></div>

    <!-- Modal box -->
    <div class="modal-box">
      <input id="close-modal-button" value="Zavřít okno" />
      <div id="ppl-parcelshop-map" data-countries="cz"></div>
    </div>

    <script>
    
    
    
      // Get the modal elements
      var modalOverlay = document.querySelector(".modal-overlay");
      var modalBox = document.querySelector(".modal-box");
      var closeButton = document.querySelector("#close-modal-button");

      // Get the button that opens the modal
      var modalButton = document.querySelector("#modal-button");

      // When the user clicks the button, show the modal
      modalButton.addEventListener("click", function () {
        modalOverlay.style.display = "block";
        modalBox.style.display = "block";
        modalBox.style.top = window.pageYOffset + 15 + "px";

        // Create a link element to load the main.css file
        var link = document.createElement("link");
        link.rel = "stylesheet";
        link.href = "https://www.ppl.cz/sources/map/main.css";

        // Create a script element to load the main.js file
        var script = document.createElement("script");
        script.src = "https://www.ppl.cz/sources/map/main.js";

        // Add the script+href link to the document head
        document.head.appendChild(link);
        document.head.appendChild(script);
      });

      // When the user clicks the close button, hide the modal
      closeButton.addEventListener("click", function () {
        modalOverlay.style.display = "none";
        modalBox.style.display = "none";
      });
      
      
     document.addEventListener( "Ppl-parcelshop-map", (event) => { console.log("Vybraný parcel shop:", event.detail) } );    
     
          
    </script>

document.addEventListener( "Ppl-parcelshop-map", (event) => { document.getElementById('element').innerHTML = "Vybraný parcel shop:" + event.detail });