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

assets/admin/pages/ClinicDetailPage.tsx

@@ -350,7 +350,7 @@ function EditModal({ clinic, onClose, onSaved }: {
 
   const [activeTab, setActiveTab] = useState<'basic' | 'tags' | 'social'>('basic');
 
-  return (
+  return createPortal(
     <div className="overlay" onClick={onClose}>
       <div className="modal" style={{ maxWidth: 560, maxHeight: '90vh', overflowY: 'auto' }} onClick={e => e.stopPropagation()}>
         <div className="modal-head">
@@ -455,7 +455,8 @@ function EditModal({ clinic, onClose, onSaved }: {
           </div>
         </form>
       </div>
-    </div>
+    </div>,
+    document.body,
   );
 }
 
@@ -1301,24 +1302,22 @@ export default function ClinicDetailPage() {
         onCancel={() => setDetachDoctorConfirm(null)}
       />
 
-      {/* Edit modal — portal to escape Leaflet transform context */}
-      {editOpen && createPortal(
+      {/* Edit modal — self-portals to escape transform context */}
+      {editOpen && (
         <EditModal
           clinic={clinic}
           onClose={() => setEditOpen(false)}
           onSaved={() => { qc.invalidateQueries({ queryKey: ['clinic-detail', uuid] }); qc.invalidateQueries({ queryKey: ['admin-clinics'] }); }}
-        />,
-        document.body,
+        />
       )}
 
       {/* Invite doctor modal */}
-      {inviteOpen && uuid && createPortal(
+      {inviteOpen && uuid && (
         <InviteDoctorModal
           clinicUuid={uuid}
           onClose={() => setInviteOpen(false)}
           onInvited={() => { qc.invalidateQueries({ queryKey: ['clinic-invitations', uuid] }); setDoctorsTab('invitations'); }}
-        />,
-        document.body,
+        />
       )}
 
       {/* Delete confirm */}