From c67008442011b237850d01323af10292a7d887fa Mon Sep 17 00:00:00 2001
From: Agent Zero <agent@media-on.de>
Date: Mon, 27 Jul 2026 17:22:24 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20dropdown=20as=20portal=20in=20document.b?=
 =?UTF-8?q?ody=20with=20z-9999=20=E2=80=94=20no=20longer=20hidden=20by=20s?=
 =?UTF-8?q?idebar?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/contacts/ContactFolderTree.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/contacts/ContactFolderTree.tsx b/frontend/src/components/contacts/ContactFolderTree.tsx
index 05935e4..3cc57ee 100644
--- a/frontend/src/components/contacts/ContactFolderTree.tsx
+++ b/frontend/src/components/contacts/ContactFolderTree.tsx
@@ -1,4 +1,5 @@
 import React, { useState, useEffect, useRef, useCallback } from 'react';
+import { createPortal } from 'react-dom';
 import clsx from 'clsx';
 import { useTranslation } from 'react-i18next';
 import {
@@ -100,10 +101,10 @@ function FolderDropdown({
   const left = Math.max(4, Math.min(state.anchorRect.right - 160, window.innerWidth - 170));
   const maxHeight = Math.min(300, window.innerHeight - top - 8);
 
-  return (
+  return createPortal(
     <div
       ref={ref}
-      className="fixed z-50 bg-white border border-secondary-200 rounded-lg shadow-lg py-1 min-w-[160px]"
+      className="fixed z-[9999] bg-white border border-secondary-200 rounded-lg shadow-lg py-1 min-w-[160px]"
       style={{ top, left, maxHeight: maxHeight > 0 ? maxHeight : undefined, overflowY: 'auto' }}
     >
       {items.map((item, i) => (
@@ -119,7 +120,8 @@ function FolderDropdown({
           {item.label}
         </button>
       ))}
-    </div>
+    </div>,
+    document.body
   );
 }