From 7822a363ddf6d1d4d5f83af01e752c0c3f9e8646 Mon Sep 17 00:00:00 2001
From: Linus Rath <139418639+rathlinus@users.noreply.github.com>
Date: Fri, 1 May 2026 17:10:17 +0200
Subject: [PATCH] fix: render below-header overflow popup outside clipped row

---
 components/email/email-viewer.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/components/email/email-viewer.tsx b/components/email/email-viewer.tsx
index 234e401c..dd3c11c6 100644
--- a/components/email/email-viewer.tsx
+++ b/components/email/email-viewer.tsx
@@ -4525,6 +4525,7 @@ export function EmailViewer({
       {/* === ATTACHMENTS below header (below-header mode, desktop only) === */}
       {attachmentPosition === 'below-header' && effectiveAttachments.length > 0 && (
         <div className="hidden lg:block bg-background border-b border-border px-4 lg:px-6 py-2">
+          <div className="relative">
           <div ref={belowHeaderRowRef} className="relative flex items-center gap-2 overflow-hidden">
             {/* Hidden ghost row used purely for measuring chip widths */}
             <div
@@ -4638,6 +4639,7 @@ export function EmailViewer({
                 +{effectiveAttachments.length - visibleBelowHeaderCount} {t('attachments').toLowerCase()}
               </button>
             )}
+          </div>
             {showAllBelowHeaderAttachments && visibleBelowHeaderCount !== null && effectiveAttachments.length > visibleBelowHeaderCount && (
               <>
                 <div className="fixed inset-0 z-40" onClick={() => setShowAllBelowHeaderAttachments(false)} />