Fix WP Rocket deactivation modal style applied to the checkboxes in the plugins page in WordPress 6.3

[camilamadronero]

Before submitting an issue please check that you’ve completed the following steps:

• Made sure you’re on the latest version - Y
• Used the search feature to ensure that the bug hasn’t been reported before - Y

Describe the bug
WP Rocket deactivation modal styles are applied to the checkboxes in the plugins page from WordPress 6.3, causing possible UI interference. The boxes are clickable under these conditions.

Alfonso found out that the .wpr-modal-overlay selector has a z-index of 0, see: https://jmp.sh/iPcnMmXT
And the plugin the checkboxes also have a z-index of 1: https://i.imgur.com/pRCi6ZC.png

And, the changes were made in WordPress 6.3 here: https://core.trac.wordpress.org/ticket/21516 and WordPress/wordpress-develop@0b69111.

It seems to be our issue because other deactivation pop-ups use other values for z-indez, see: http://recordit.co/orURs9lJHH.

To Reproduce
Steps to reproduce the behavior:

1. In a site with WordPress 6.3 and WP Rocket, go to the plugins page
2. Click on WP Rocket > Deactivate button.
3. See the issue with the checkboxes.
4. You can click the boxes too.

Expected behavior
WP Rocket deactivation modal style is not applied to the checkboxes anymore.

Additional context
Slack thread: https://wp-media.slack.com/archives/C08N8J6VC/p1692293488219549.

[CrochetFeve0251]

Reproduce the problem

I was able to reproduce the issue.

Identify the root cause

The root cause of the issue is the layover from the modal being too low.

Scope a solution

A solution would be to set the z-index from the layover to 100.
For that we wil just need to add the following CSS:

.wpr-modal-overlay {
   z-index: 100;
}

Estimate the effort

Effort XS