fix bugs in drag/drop, move styling for functions to separate sheets

To clean up the multi tool page and make the pdf adapters more re-usable the style for them was moved to separate pages that are inserted into head when the adapter is created.

src/main/resources/static/css/dragdrop.css

@@ -0,0 +1,78 @@
+#drag-container {
+    position: fixed;
+    display:flex;
+    inset: 0;
+    pointer-events: none;
+    z-index: 10000;
+    visibility: hidden;
+}
+
+#drag-container:not(:empty) {
+    visibility: visible;
+}
+
+#drag-container .dragged-img {
+    position: fixed;
+    max-width: 200px;
+    max-height: 200px;
+    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.58);
+    transform-origin: top left;
+}
+
+.drag-manager_dragging {
+    width: 0px;
+    visibility: hidden;
+}
+
+.drag-manager_draghover {
+    width: 375px !important;
+}
+
+.drag-manager_draghover .insert-file-button-container {
+    display: none !important;
+}
+
+.drag-manager_draghover .button-container {
+    visibility: hidden !important;
+}
+
+html[lang-direction=ltr] .drag-manager_draghover img {
+    left: calc(50% + 62.5px) !important;
+}
+
+html[lang-direction=rtl] .drag-manager_draghover img {
+    left: unset;
+}
+
+.drag-manager_dragging-container .hide-on-drag {
+    display: none !important;
+}
+
+.drag-manager_endpoint {
+    width: 80px;
+    height: 100%;
+    background-color: #FFFFFF10;
+    transition: width 0.1s;
+    animation: end-drop-expand .3s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.drag-manager_endpoint svg {
+    width: 50px;
+    height: 50px;
+}
+
+.drag-manager_endpoint.drag-manager_draghover {
+    width: 150px !important;
+}
+
+@keyframes end-drop-expand {
+    from {
+        width: 0;
+    }
+    to {
+        width: 80px;
+    }
+}