refactor(tests): reorganizing test-tabs-color-scheme and adding scenario (#3844)

## Description

Reorganizing test-tabs-color-scheme and adding scenario

Closes:
software-mansion/react-native-screens-labs#1111

## Changes

- test-tabs-color-scheme moved to separate scenario-directory and rename
to index.tsx file.
- Manual scenario for this screen was also added to directory.
- Small changes on screen - changing colors to make text be visible in
light and dark mode.

## Before & after - visual documentation

### Before
In dark mode text was not visible:

<img width="1206" height="2622" alt="Simulator Screenshot - iPhone 17
Pro - 2026-04-07 at 15 39 09"
src="https://github.com/user-attachments/assets/31f2f9ec-82ce-4a90-a492-689d0ba21ad5"
/>

### After
Color changes:
<img width="1206" height="2622" alt="Simulator Screenshot - iPhone 17
Pro - 2026-04-07 at 15 38 34"
src="https://github.com/user-attachments/assets/4172494b-28d6-4b9a-8bcf-32d5d89bb800"
/>

Author: LKuchno

…re-tests/tabs/test-tabs-color-scheme.tsx …ts/tabs/test-tabs-color-scheme/index.tsxapps/src/tests/single-feature-tests/tabs/test-tabs-color-scheme.tsx renamed to apps/src/tests/single-feature-tests/tabs/test-tabs-color-scheme/index.tsx apps/src/tests/single-feature-tests/tabs/test-tabs-color-scheme.tsx renamed to apps/src/tests/single-feature-tests/tabs/test-tabs-color-scheme/index.tsx

@@ -41,15 +41,15 @@ function ConfigScreen() {
   return (
     <ScrollView style={styles.container} contentContainerStyle={styles.content}>
       <View style={styles.section}>
-        <Text>
+        <Text style={styles.text}>
           There are 3 sources of color scheme, in ascending order of precedence:
           system, React Native and our property on TabsHost.
         </Text>
       </View>
 
       <View style={styles.section}>
         <Text style={styles.heading}>System color scheme</Text>
-        <Text>
+        <Text style={styles.text}>
           Switch system color scheme via quick settings in notification drawer
           (Android/iOS) or Cmd+Shift+A (iOS simulator).
         </Text>
@@ -133,8 +133,12 @@ const styles = StyleSheet.create({
     fontSize: 24,
     fontWeight: 'bold',
     marginBottom: 5,
+    color: 'rgb(0, 122, 255)',
   },
   section: {
     marginBottom: 10,
   },
+  text: {
+    color: 'gray'
+  },
 });

apps/src/tests/single-feature-tests/tabs/test-tabs-color-scheme/scenario.md

@@ -0,0 +1,73 @@
+# Test Scenario: colorScheme
+
+**E2E test:** NO
+
+## Prerequisites
+
+- iOS device/simulator (use Cmd+Shift+A to toggle appearance on simulator)
+- Android emulator (use CLI):
+  - `adb shell "cmd uimode night yes"`
+  - `adb shell "cmd uimode night no"`
+
+Assumption: 
+
+- System and RN color scheme settings are working correctly.
+- Here only the `colorScheme` prop on TabsHost is tested, verified against different system/RN combinations.
+
+## Steps
+
+### Baseline
+
+1. Launch the app and navigate to the scenario
+   
+- [ ] Expected: Config tab is shown. Pickers default to `unspecified` / `inherit`
+
+---
+
+### TabsHost `inherit` — follows RN/system
+
+2. Set system/RN to **light**, TabsHost colorScheme = `inherit`
+   
+- [ ] Expected: Tab bar appears **light**
+
+3. Set system/RN to **dark**, keep TabsHost colorScheme = `inherit`
+   
+- [ ] Expected: Tab bar appears **dark** — TabsHost defers to RN/system
+
+---
+
+### TabsHost `light` — overrides RN/system
+
+4. Set system/RN to **dark**, set TabsHost colorScheme = `light`
+   
+- [ ] Expected: Tab bar appears **light** — TabsHost overrides dark from RN/system
+
+5. Set system/RN to **light**, keep TabsHost colorScheme = `light`
+   
+- [ ] Expected: Tab bar stays **light**
+
+6. Cycle through `inherit` → `dark` → `light` → `dark` → `inherit`
+   
+- [ ] Expected: Tab bar color scheme updates immediately with each change, no crash or layout freeze
+
+---
+
+### TabsHost `dark` — overrides RN/system
+
+7. Set system/RN to **light**, set TabsHost colorScheme = `dark`
+   
+- [ ] Expected: Tab bar appears **dark** — TabsHost overrides light from RN/system
+
+8. Set system/RN to **dark**, keep TabsHost colorScheme = `dark`
+   
+- [ ] Expected: Tab bar stays **dark**
+
+9. Cycle through `inherit` → `light` → `dark` → `light` → `inherit`
+
+---
+
+### Keyboard tab — simple check
+
+10. Switch to the **Keyboard** tab, open the keyboard via TextInput (or Cmd+K on iOS simulator)
+   
+- [ ] Expected: Keyboard appearance matches the currently active color scheme — verify for both light and dark values.