fix: resolve dark mode contrast issues on legal pages

[AnkitRewar11]

Description
This PR fixes #7677

In dark mode, text on Code of Conduct and Terms of Service pages was invisible (dark text on dark background). On Privacy page, the data processing table was rendering in light mode regardless of user's theme preference. Issue resolved only after manually switching theme.

Root Cause

• terms.style.js had no color properties defined, so text became invisible in dark mode
• privacy/index.js — SistentThemeProvider was rendering with wrong initial theme before ThemeManager resolved correct theme from localStorage
• sub-processors/index.js — SistentThemeProvider was not re-mounting on theme change
• cookie-notice/index.js - used the same table rendering pattern and was affected by the same theme initialization behavior.

Changes Made

• terms.style.js: added props.theme.whiteToBlack color for all text elements to ensure proper contrast in dark and light mode
• privacy/index.js: added didLoad flag to defer SistentThemeProvider render until theme is fully resolved, preventing incorrect light mode flash on table
• sub-processors/index.js: added key={isDark ? "dark" : "light"} and didLoad flag to SistentThemeProvider to force re-mount on theme change
• cookie-notice/index.js: added didLoad flag and key prop to SistentThemeProvider (same table setup as privacy page)

Affected Pages

1. Code of Conduct
2. Terms of Service
3. Privacy Policy
4. Cookie Notice
5. Sub-Processors

Notes for Reviewers
No new dependencies added. Changes are scoped only to legal pages.

Signed commits

• Yes, I signed my commits.

Screen.Recording.2026-06-12.003525.mp4

[AnkitRewar11]

Hey @Rajesh-Nagarajan-11, @banana-three-join, @KatalKavya96, @rishiraj38 👋
I closed the previous PR since it got cluttered with merge commits and opened a new clean PR with all the requested changes.
Whenever you have some time, could you please take a look and let me know if anything else needs to be updated?

[github-actions]

Preview deployment for PR #7789 removed.

This PR preview was automatically pruned because we keep only the 6 most recently updated previews on GitHub Pages to stay within deployment size limits.

If needed, push a new commit to this PR to generate a fresh preview.

[KatalKavya96]

@AnkitRewar11 I can see the issue on the Code of Conduct and Terms of Service pages, and both the issue description and reproduction steps also point to these two pages only.

Could you please clarify why changes were made to additional pages as well? The expected fix seems to be limited to Code of Conduct and Terms of Service.

[AnkitRewar11]

@KatalKavya96 These pages were affected because they all share the same terms.style.js component. The dark mode contrast fix was made in this shared file, so it automatically applied to all legal pages using it.

Also, Privacy Policy, Cookie Notice, and Sub-Processors use the same dark mode setup (SistentThemeProvider + useStyledDarkMode), so they needed the same fix for consistent rendering.

Limiting the change to only Code of Conduct and Terms of Service would have left the same issue on the other legal pages.

[KatalKavya96]

@AnkitRewar11 Ok, fair enough. Thanks for clarifying.

I rechecked the preview as well, and the fix looks good overall. Since the PR covers both the shared terms.style.js contrast issue and the theme rendering issue on Privacy Policy, Cookie Notice, and Sub-Processors, could you please update the PR description to mention this clearly?

Rest all looks good to me.

[Bhumikagarggg]

@AnkitRewar11 Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂

[AnkitRewar11]

@rishiraj38 @Rajesh-Nagarajan-11 please take a look.

[Bhumikagarggg]

@AnkitRewar11 Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂

[Sbragul26]

LGTM 👍

[Sbragul26]

createTheme is currently being called inside the component, so a new theme object is created on every render. Since the theme looks static, what are your thoughts on moving it outside the component so it’s created only once and avoids unnecessary re-creation on each render?

[AnkitRewar11]

@Sbragul26 You're right bro. This change will prevent unnecessary work on each render and significantly improve performance. I've updated it. Thanks for the heads-up!