feat: implement Portal component and refactor modals to use it for improved positioning

assets/admin/components/ui/ConfirmDialog.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { XMarkIcon, ExclamationTriangleIcon } from '@heroicons/react/24/outline';
+import Portal from './Portal';
 
 interface Props {
   open: boolean;
@@ -27,6 +28,7 @@ export default function ConfirmDialog({
   if (!open) return null;
 
   return (
+    <Portal>
     <div className="overlay" onClick={onCancel}>
       <div className="modal" style={{ maxWidth: 420 }} onClick={(e) => e.stopPropagation()}>
         <div className="modal-head">
@@ -61,5 +63,6 @@ export default function ConfirmDialog({
         </div>
       </div>
     </div>
+    </Portal>
   );
 }