diff --git a/app/(root)/dashboard/layout.theme-contrast.test.tsx b/app/(root)/dashboard/layout.theme-contrast.test.tsx
new file mode 100644
index 000000000..d0a69e254
--- /dev/null
+++ b/app/(root)/dashboard/layout.theme-contrast.test.tsx
@@ -0,0 +1,76 @@
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/vitest';
+import { describe, it, expect, vi, afterEach } from 'vitest';
+import { cleanup } from '@testing-library/react';
+import DashboardLayout from './layout';
+
+vi.mock('sonner', () => ({
+ Toaster: () =>
,
+}));
+
+afterEach(() => {
+ cleanup();
+});
+
+describe('DashboardLayout theme-contrast: Dark and Light Prefers-Color-Scheme Visual Cohesion', () => {
+ it('applies light mode text color class for sufficient contrast on light backgrounds', () => {
+ const { container } = render(
+
+ Dashboard content
+
+ );
+
+ const root = container.firstChild as HTMLElement;
+
+ // text-gray-900 ensures sufficient contrast in light mode
+ expect(root.className).toContain('text-gray-900');
+ });
+
+ it('applies dark mode text color class for sufficient contrast on dark backgrounds', () => {
+ const { container } = render(
+
+ Dashboard content
+
+ );
+
+ const root = container.firstChild as HTMLElement;
+
+ // dark:text-white ensures sufficient contrast in dark mode
+ expect(root.className).toContain('dark:text-white');
+ });
+
+ it('uses a transparent background so it does not clip foreground content colors in either theme', () => {
+ const { container } = render(
+
+ Dashboard content
+
+ );
+
+ const root = container.firstChild as HTMLElement;
+
+ // bg-transparent allows parent theme background to show through without clipping content
+ expect(root.className).toContain('bg-transparent');
+ });
+
+ it('renders children content correctly within the themed main wrapper', () => {
+ render(
+
+ Dashboard content
+
+ );
+
+ // Children must render visibly regardless of theme
+ expect(screen.getByText('Dashboard content')).toBeDefined();
+ });
+
+ it('renders the Toaster component for theme-aware notification styling', () => {
+ render(
+
+ Dashboard content
+
+ );
+
+ // Toaster (sonner) must render so notifications adapt to both themes
+ expect(screen.getByTestId('toaster')).toBeDefined();
+ });
+});