Styling paragraphs through theme.json or the full site editor overwrites everything else

[andrewkathart]

Description

When styling the paragraph block element through theme.json or the full site editor, you're no longer able to overwrite styles on e.g. excerpt block or quote block or any block that uses the paragraph block. The issue seems to be the following selector :root :where(p) it will always win over something like :root :where(.wp-block-post-excerpt).

This doesn't seem intentional as the user won't be able to change things like font size, font weight, color etc. for blocks such as the excerpt (and many others). Right now I have to create a custom CSS rule that uses !important to be able to get the styles I want, which is very bad practice imo.

I'm thinking the solution is very simple by changing the selector to include the paragraph tag, like this :root :where(p.wp-block-post-excerpt).

Step-by-step reproduction instructions

1. Set some global paragraph styles either through the theme.json or through the site editor.
2. Try to set some global styles for the excerpt block
3. Global styles for the excerpt block won't be applied

Screenshots, screen recording, code snippet

Global paragraph styles:

Excerpt block style being overwritten by the styles above:

Environment info

No response

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure