Add preserve-parent-color value for forced-color-adjust property (#…

…37394)

* Add `preserve-parent-color` value for `forced-color-adjust` property

* Apply suggestions from code review

* Apply suggestions from code review

* Update files/en-us/web/css/@media/forced-colors/index.md

---------

Co-authored-by: Estelle Weyl <[email protected]>
Co-authored-by: Estelle Weyl <[email protected]>

files/en-us/web/css/@media/forced-colors/index.md

@@ -55,11 +55,13 @@ The system colors that are forced for the above properties depend on the context
 
 In addition to these adjustments, browsers will help ensure text legibility by drawing "backplates" behind text. This is particularly important for preserving contrast when text is placed on top of images.
 
-There are two cases where the user agent does not force the values for the above properties — when a {{cssxref("forced-color-adjust")}} value of `none` is applied to an element, or when a system color is specified by the author.
+There are some cases where the user agent does not force the values for the above properties:
 
-When forced-color-adjust is set to `none` on an element, none of the forced color values will apply, and author styles will be applied as normal. Additionally, the backplate for text will be disabled.
+When {{cssxref("forced-color-adjust")}} is set to `none` on an element, none of the forced color values will apply, and author styles will be applied as normal. Additionally, the backplate for text will be disabled.
 
-When a system color is specified, it will be used instead of the value that would otherwise have been forced.
+When {{cssxref("forced-color-adjust")}} is set to `preserve-parent-color` on an element, and the {{cssxref("color")}} value on the element does not inherit from its parent, then the element will behave the same as setting `preserve-parent-color` to `none`.
+
+When a [system color](/en-US/docs/Web/CSS/system-color) is specified, it will be used instead of the value that would otherwise have been forced.
 
 You can also use system colors with any property _other_ than those listed above, to ensure that the rest of the page integrates with the restricted color palette available in forced colors mode.
 

files/en-us/web/css/forced-color-adjust/index.md

@@ -14,6 +14,7 @@ The **`forced-color-adjust`** [CSS](/en-US/docs/Web/CSS) property allows authors
 ```css
 forced-color-adjust: auto;
 forced-color-adjust: none;
+forced-color-adjust: preserve-parent-color;
 
 /* Global values */
 forced-color-adjust: inherit;
@@ -31,6 +32,8 @@ The `forced-color-adjust` property's value must be one of the following keywords
   - : The element's colors are adjusted by the {{Glossary("user agent")}} in forced colors mode. This is the default.
 - `none`
   - : The element's colors are not automatically adjusted by the {{Glossary("user agent")}} in forced colors mode.
+- `preserve-parent-color`
+  - : In forced colors mode, if the {{cssxref("color")}} property inherits from its parent (i.e. there is no [cascaded value](/en-US/docs/Web/CSS/Cascade) or the cascaded value is `currentcolor`, {{cssxref("inherit")}}, or another keyword that inherits from the parent), then it computes to the [used color](/en-US/docs/Web/CSS/used_value) of its parent's `color` property. In all other cases, it behaves the same as `none`.
 
 ## Usage notes
 
@@ -50,7 +53,7 @@ This property should only be used to makes changes that will support a user's co
 
 In the example below the first box will use the color scheme that the user has set. For example in Windows High Contrast mode black scheme it will have a black background and white text. The second box will preserve the site colors set on the `.box` class.
 
-By using the [`forced-colors`](/en-US/docs/Web/CSS/@media/forced-colors) media feature you could add any other optimizations for forced color mode alongside the `forced-color-adjust` property.
+By using the {{cssxref("@media/forced-colors", "forced-colors")}} media feature, you could add any other optimizations for forced color mode alongside the `forced-color-adjust` property.
 
 #### CSS