Description

In the editor, the color options for the search block changes the submit button in the form.
But when you add colors using theme.json, the colors are added to the form element.

In addition, the color contrast warning is always visible in the editor no matter what colors are selected.

Step-by-step reproduction instructions

1. Add a theme.json with colors for the search block to your test theme. (Example code below)
2. In either editor, add a search block.
3. See that the colors of the block are affecting the form, not the button in the block.
4. View the front and see the same result.

Screenshots, screen recording, code snippet

Theme.json:

{
	"version": 1,
	"styles": {
		"blocks": {
			"core/search": {
				"color": {
					"background": "var(--wp--preset--color--black)"
				}
			}
		}
	}
}

CSS output:

.wp-block-search {
    background-color: var(--wp--preset--color--black);
}

Screenshot:

Environment info

WordPress 5.8
Gutenberg 11.3.0

Pre-checks

• I have searched the existing issues.
• I have tested with all plugins deactivated except Gutenberg.