chore: update unit testing cursor rule for theme mocks (MetaMask#27825)

## **Description**

Updates `.cursor/rules/unit-testing-guidelines.mdc` with clearer
guidance for theme-related mocks in unit tests:

- Prefer `mockTheme` (real design tokens) instead of hardcoded hex
values.
- Mock `useTailwind()` with the correct return shape (supports
`tw.style(...)`, and only add `tw.color(...)` when the component under
test uses it).

This is intended to reduce churn and align new tests with the
`@metamask/design-tokens/color-no-hex` ESLint rule.

Related / prior `color-no-hex` PRs:
- MetaMask#26958
- MetaMask#26963
- MetaMask#27008
- MetaMask#27030
- MetaMask#27031
- MetaMask#27149
- MetaMask#27150
- MetaMask#27151

## **Changelog**

CHANGELOG entry: null

## **Related issues**

Fixes:

## **Manual testing steps**

```gherkin
Feature: Cursor unit testing guidelines

  Scenario: guidance for theme-related mocks is clear
    Given a developer is writing or updating a unit test
    When they follow the updated theme mocking guidance
    Then they can avoid hardcoded hex colors and mock useTailwind without type/shape mismatches
```

## **Screenshots/Recordings**

### **Before**

N/A

### **After**

N/A

## **Pre-merge author checklist**

- [x] I've followed MetaMask Contributor Docs and MetaMask Mobile Coding
Standards.
- [x] I've completed the PR template to the best of my ability
- [x] I've included tests if applicable (N/A)
- [x] I've documented my code using JSDoc format if applicable (N/A)
- [x] I've applied the right labels on the PR (see labeling guidelines).
Not required for external contributors.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> **Low Risk**
> Low risk: documentation-only change that updates testing guidance
without affecting runtime behavior.
> 
> **Overview**
> Updates `.cursor/rules/unit-testing-guidelines.mdc` to add **Theme
Mocking Rules** that steer tests toward using the shared `mockTheme` and
away from hardcoded hex design tokens (to align with
`@metamask/design-tokens/color-no-hex`).
> 
> Adds concrete mock examples for `useTheme`, `useStyles`, and
`useTailwind()` (including the correct return shape), plus an explicit
anti-pattern example of local hex color mock objects.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
6227068. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: georgewrmarshall

.cursor/rules/unit-testing-guidelines.mdc

@@ -234,6 +234,66 @@ See [PR #25548](https://github.com/MetaMask/metamask-mobile/pull/25548) for refa
 - **Mock all external dependencies** including APIs, services, hooks
 - **Use realistic mock data** that reflects real usage
 
+### Theme Mocking Rules
+
+- **Prefer shared `mockTheme` from `app/util/theme`** instead of hard-coded color literals in tests.
+- **Never hardcode design token hex values** in assertions or theme mocks (enforced by `@metamask/design-tokens/color-no-hex`).
+- **Avoid local hex color objects** for `useTheme`, `useStyles`, or tailwind mock color functions.
+- **If a test only needs a specific theme field**, derive it from `mockTheme` (or spread `mockTheme` and override minimally).
+
+```ts
+// ✅ CORRECT: use shared mockTheme for useTheme mocks
+import { mockTheme } from '../../util/theme';
+
+jest.mock('../../util/theme', () => ({
+  useTheme: () => mockTheme,
+}));
+```
+
+```ts
+// ✅ CORRECT: return { styles, theme } for useStyles mocks
+import { mockTheme } from '../../util/theme';
+
+jest.mock('../../../../../component-library/hooks', () => ({
+  useStyles: jest.fn((styleFn, vars) => ({
+    styles: styleFn({ theme: mockTheme, vars }),
+    theme: mockTheme,
+  })),
+}));
+```
+
+```ts
+// ✅ CORRECT: mock useTailwind with the right shape
+jest.mock('@metamask/design-system-twrnc-preset', () => ({
+  useTailwind: () => ({
+    // Most components only need tw.style(...)
+    style: jest.fn(() => ({})),
+  }),
+}));
+```
+
+```ts
+// ✅ ALSO CORRECT: match real useTailwind() return type (callable function + helpers)
+import { mockTheme } from '../../util/theme';
+
+jest.mock('@metamask/design-system-twrnc-preset', () => ({
+  useTailwind: () => {
+    const tw = () => ({});
+    tw.style = jest.fn(() => ({}));
+    return tw;
+  },
+}));
+```
+
+```ts
+// ❌ AVOID: local hex color mocks
+const mockColors = {
+  text: { default: '#000000' },
+  background: { default: '#FFFFFF' },
+  border: { muted: '#E5E7EB' },
+};
+```
+
 ```ts
 // ✅ CORRECT
 import { apiService } from '../services/api';