fix(feedback): Fix cases where the outline of inputs were wrong (#18647)

The integration was using `"colorScheme: "dark"` we include css only
dark mode. But some properties, like `outline` were not specified, the
system does a good job by default. However, adding `color-scheme: only
light` into the css meant that the light-mode outlines were used in all
cases, even when we asked for dark mode.

This changes things so that we have the correct values for
`color-scheme` if a specific value is picked. This ensures that the
`outline` and `:focus` colors set by the system are correct in all
cases.

**Test Plan**
I tested with my system set to each of: light, dark, automatic And then
with the integration setting set to each of: `colorScheme: 'light'`,
`colorScheme: 'dark'` and `colorScheme: 'system'`. To test i just opened
up the feedback widget and clicked to focus an input box.

**Screenshots**

| Before | After |
| --- | --- |
| <img width="443" height="199" alt="SCR-20251230-pleg"
src="https://github.com/user-attachments/assets/ade46ef2-16c0-4de8-b630-6ac0cf66f440"
/> | <img width="466" height="275" alt="SCR-20251230-plch"
src="https://github.com/user-attachments/assets/a6ddbcbe-9d1b-4515-9833-84c62f0e6ed9"
/>

Author: ryan953

packages/feedback/src/core/createMainStyles.ts

@@ -71,7 +71,7 @@ export function createMainStyles({
   font-family: var(--font-family);
   font-size: var(--font-size);
 
-  ${colorScheme !== 'system' ? 'color-scheme: only light;' : ''}
+  ${colorScheme !== 'system' ? `color-scheme: only ${colorScheme};` : ''}
 
   ${getThemedCssVariables(
     colorScheme === 'dark' ? { ...DEFAULT_DARK, ...themeDark } : { ...DEFAULT_LIGHT, ...themeLight },
@@ -83,12 +83,13 @@ ${
     ? `
 @media (prefers-color-scheme: dark) {
   :host {
+    color-scheme: only dark;
+
     ${getThemedCssVariables({ ...DEFAULT_DARK, ...themeDark })}
   }
 }`
     : ''
 }
-}
 `;
 
   if (styleNonce) {