fix: make the tint of selected rows work the same way in dark and light mode

components/email/__tests__/thread-list-item.test.tsx

@@ -243,3 +243,48 @@ describe('ThreadListItem shift-range checkbox', () => {
     expect(selected.has('e3')).toBe(true);
   });
 });
+
+describe('ThreadListItem row tint', () => {
+  const rowClasses = (container: HTMLElement) =>
+    container.querySelector('[data-email-id="email-1"]')!.className.split(' ');
+
+  beforeEach(() => {
+    useSettingsStore.setState({
+      emailKeywords: [...DEFAULT_KEYWORDS],
+      showPreview: false,
+      mailLayout: 'split',
+      tintListRowsByTag: true,
+    });
+    useEmailStore.setState({
+      selectedEmailIds: new Set(['email-1']),
+      selectedMailbox: 'inbox',
+    });
+  });
+
+  it('keeps a checked row tinted, and says so to either theme', () => {
+    const { container } = renderRow(makeEmail({ keywords: { $seen: true, '$label:red': true } }));
+    const classes = rowClasses(container);
+
+    expect(classes).toContain('bg-red-50');
+    expect(classes).toContain('dark:bg-red-950/30');
+    expect(classes).not.toContain('bg-accent/40');
+    expect(classes).toContain('ring-primary/20');
+  });
+
+  it('washes a checked row that has no tint to keep', () => {
+    const { container } = renderRow(makeEmail({ keywords: { $seen: true } }));
+    const classes = rowClasses(container);
+
+    expect(classes).toContain('bg-accent/40');
+    expect(classes).toContain('ring-primary/20');
+  });
+
+  it('leaves the tint alone when the setting is off', () => {
+    useSettingsStore.setState({ tintListRowsByTag: false });
+    const { container } = renderRow(makeEmail({ keywords: { $seen: true, '$label:red': true } }));
+    const classes = rowClasses(container);
+
+    expect(classes).not.toContain('bg-red-50');
+    expect(classes).toContain('bg-accent/40');
+  });
+});

components/email/thread-list-item.tsx

@@ -202,9 +202,11 @@ const SingleEmailItem = React.forwardRef<HTMLDivElement, SingleEmailItemProps>(
           !resolvedRowTint && (selected || isChecked) && "hover:bg-accent hover:shadow-sm",
           resolvedRowTint && "hover:brightness-95 dark:hover:brightness-110",
           isUnread && !resolvedRowTint && "bg-accent/30",
-          isChecked && "ring-2 ring-primary/20 bg-accent/40",
+          isChecked && "ring-2 ring-primary/20",
+          isChecked && !resolvedRowTint && "bg-accent/40",
           isDragging && "opacity-50 scale-[0.98] ring-2 ring-primary/30",
-          isPressed && "bg-muted scale-[0.98] ring-2 ring-primary/30"
+          isPressed && "scale-[0.98] ring-2 ring-primary/30",
+          isPressed && !resolvedRowTint && "bg-muted"
         )}
         onClick={handleClick}
         onDoubleClick={(e) => {
@@ -640,8 +642,10 @@ export const ThreadListItem = React.forwardRef<HTMLDivElement, ThreadListItemPro
             rowTint && "hover:brightness-95 dark:hover:brightness-110",
             hasUnread && !rowTint && !isSelected && "bg-accent/30",
             isExpanded && "border-b border-border/50",
-            isChecked && "ring-2 ring-primary/20 bg-accent/40",
-            isThreadPressed && "bg-muted scale-[0.98] ring-2 ring-primary/30"
+            isChecked && "ring-2 ring-primary/20",
+            isChecked && !rowTint && "bg-accent/40",
+            isThreadPressed && "scale-[0.98] ring-2 ring-primary/30",
+            isThreadPressed && !rowTint && "bg-muted"
           )}
           onClick={handleHeaderClick}
           onDoubleClick={(e) => {