feat: add 'Always Light Mode' setting for email display

components/email/email-viewer.tsx

@@ -1036,8 +1036,9 @@ export function EmailViewer({
     return /prefers-color-scheme\s*:\s*dark/i.test(emailContent.html);
   }, [emailContent.html, emailContent.isHtml]);
 
+  const emailAlwaysLightMode = useSettingsStore((state) => state.emailAlwaysLightMode);
   const [emailViewDarkOverride, setEmailViewDarkOverride] = useState<boolean | null>(null);
-  const isDark = emailViewDarkOverride !== null ? emailViewDarkOverride : resolvedTheme === 'dark';
+  const isDark = emailAlwaysLightMode ? false : (emailViewDarkOverride !== null ? emailViewDarkOverride : resolvedTheme === 'dark');
 
   const emailIframeSrcDoc = useMemo(() => {
     if (!emailContent.isHtml) return '';

components/email/thread-conversation-view.tsx

@@ -225,6 +225,7 @@ function EmailCard({
   const resolvedTheme = useThemeStore((state) => state.resolvedTheme);
   const density = useSettingsStore((state) => state.density);
   const mailAttachmentAction = useSettingsStore((state) => state.mailAttachmentAction);
+  const emailAlwaysLightMode = useSettingsStore((state) => state.emailAlwaysLightMode);
   const sender = email.from?.[0];
   const isUnread = !email.keywords?.$seen;
   const isStarred = email.keywords?.$flagged;
@@ -363,7 +364,7 @@ function EmailCard({
             node.setAttribute('rel', 'noopener noreferrer');
           }
 
-          if (resolvedTheme === 'dark') {
+          if (resolvedTheme === 'dark' && !emailAlwaysLightMode) {
             if (htmlNode.style) {
               const originalStyles = htmlNode.style.cssText;
               const transformedStyles = transformInlineStyles(originalStyles, 'dark');
@@ -415,7 +416,7 @@ function EmailCard({
     }
 
     return { html: "", isHtml: false };
-  }, [email, allowExternal, resolvedTheme, cidBlobUrls]);
+  }, [email, allowExternal, resolvedTheme, emailAlwaysLightMode, cidBlobUrls]);
 
   return (
     <div className={cn(
@@ -513,7 +514,8 @@ function EmailCard({
           <div style={{ padding: 'var(--density-card-p)' }}>
             <div
               className={cn(
-                "prose prose-sm max-w-none dark:prose-invert",
+                "prose prose-sm max-w-none",
+                !emailAlwaysLightMode && "dark:prose-invert",
                 "prose-p:my-2 prose-headings:my-3",
                 "prose-a:text-primary prose-a:no-underline hover:prose-a:underline",
                 "[&_table]:border-collapse [&_td]:p-2 [&_th]:p-2",

components/settings/email-settings.tsx

@@ -19,6 +19,7 @@ export function EmailSettings() {
     emailsPerPage,
     externalContentPolicy,
     mailAttachmentAction,
+    emailAlwaysLightMode,
     trustedSenders,
     updateSetting,
   } = useSettingsStore();
@@ -104,6 +105,14 @@ export function EmailSettings() {
         />
       </SettingItem>
 
+      {/* Always Light Mode for Emails */}
+      <SettingItem label={t('always_light_mode.label')} description={t('always_light_mode.description')}>
+        <ToggleSwitch
+          checked={emailAlwaysLightMode}
+          onChange={(checked) => updateSetting('emailAlwaysLightMode', checked)}
+        />
+      </SettingItem>
+
       {/* External Content */}
       <SettingItem label={t('external_content.label')} description={t('external_content.description')}>
         <Select