From b9a9c018c0d2e0ff6c78ce0a1419ac28449043a4 Mon Sep 17 00:00:00 2001
From: Luca <102960244+Luca-Timo@users.noreply.github.com>
Date: Sat, 6 Jun 2026 23:25:29 +0200
Subject: [PATCH] fix(projects): render email preview with its own brand
 colors, not forced light
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The email wrapper already sets body/container/text backgrounds from the
brand email-theme settings (email_body_bg_color etc.), so a dark preview is
the configured design — forcing it light was wrong. Render the email as-is;
set the iframe color-scheme to 'normal' only so the admin's dark app theme
doesn't leak into the iframe's UA defaults. The brand's light/dark choice is
respected.
---
 .../src/pages/admin/projects/ProjectCockpitPage.tsx   | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/admin/projects/ProjectCockpitPage.tsx b/frontend/src/pages/admin/projects/ProjectCockpitPage.tsx
index 9b064e64..4875f25e 100644
--- a/frontend/src/pages/admin/projects/ProjectCockpitPage.tsx
+++ b/frontend/src/pages/admin/projects/ProjectCockpitPage.tsx
@@ -445,7 +445,16 @@ export const ProjectCockpitPage: React.FC = () => {
                       {t('projects.email.reRendered', 'Re-rendered from the current template — this email was sent before previews were captured, so it may differ slightly from what the recipient received.')}
                     </div>
                   )}
-                  <iframe title="email-preview" srcDoc={preview.html} className="w-full h-[60vh] border border-neutral-200 dark:border-neutral-700 rounded bg-white" />
+                  {/* Render the email exactly as sent — it carries its own
+                      background from the brand/email theme. isolate the
+                      iframe's color-scheme so the admin's OS dark mode doesn't
+                      tint a document that defines its own colors. */}
+                  <iframe
+                    title="email-preview"
+                    srcDoc={preview.html}
+                    style={{ colorScheme: 'normal' }}
+                    className="w-full h-[60vh] border border-neutral-200 dark:border-neutral-700 rounded"
+                  />
                 </>
               ) : (
                 <div className="text-center py-10 text-neutral-500">