Adjusts the max-width of the tooltip

[Jordi-PV]

Context

• Before this PR, the tooltips of the buttons in the Yoast sidebar would be cut off when the text spanned more than one line. This issue was particularly noticeable for the AI Optimize buttons when the blocks are not supported.

This PR addresses the issue by adjusting the max-width of the tooltips, ensuring they fit properly within the sidebar and remain fully visible.

Summary

This PR can be summarized in the following changelog entry:

• [wordpress-seo-premium] Fixes a bug where tooltips would exceed the width of the sidebar.

Relevant technical choices:

• I've corrected the width property of the yoast-tooltip-multiline by adding the @supports rule to avoid duplicated code. Unfortunately, IE 11 doesn't support the max-content property see caniuse.. The 210px value of the max-width property, shorten the tooltip and align it with the assessment text making it fit properly within the sidebar and remain fully visible. Refer to this conversation for the UX approval.

Test instructions

Test instructions for the acceptance test before the PR gets merged

This PR can be acceptance tested by following these steps:

1. Activate Yoast Free and Premium
2. Enable the Use AI feature in the Yoast settings.
3. Create a new post with some non-supported blocks content for AI Optimize.

• Classic
• Yoast estimated reading time
• Yoast related ToC
• Yoast Breadcrumbs
• Yoast Related Links
• Yoast FAQ
• Yoast How-to
• Image with captions
• Gallery with captions
• Verse
• Audio
• Cover
• Pullquote
• Code

💡 Use for example the following text inside a Yoast How-to block:

A beginner‘s guide to Yoast SEO

    1. The first-time configuration.
     You will get the option to start the first-time configuration right after installing Yoast SEO. 

    2. The tip of the technical iceberg
    There are many aspects to SEO and many more settings you can tweak in the plugin. But we set the first-time configuration so that it correctly configures the plugin’s general settings for your website. And there’s also loads of other stuff that Yoast SEO handles for you, to give you a head start on your technical SEO.

    4.The focus keyphrase
    The focus keyphrase field is the first in the Yoast SEO sidebar and the meta box. In your Yoast SEO sidebar, on the right side of your editor, you’ll find this field at the top:
    In this field, you can enter the phrase you’d like this specific post or page to rank for in the search engines. By adding this keyphrase (or keyword), Yoast SEO will give you feedback on how well you’ve optimized the content for that specific keyphrase. It’s good to note that adding a keyphrase here doesn’t mean that Google will ‘know’ that you want the page to rank for that keyphrase. It simply helps Yoast SEO give you helpful feedback, so adding the keyphrase without looking at any of the feedback will not do anything for your rankings.
    You can add this keyphrase at any moment, but we suggest adding it immediately as a reminder to keep your content focused on this topic. Wondering how to choose the perfect focus keyphrase? Read our [guide on choosing a focus keyphrase](https://yoast.com/focus-keyword/), as it will help you select the right keyphrase you want to (and can) rank for. You can select a keyphrase post-by-post, but if you’re serious about your rankings, you must conduct [keyword research](https://yoast.com/keyword-research-ultimate-guide/) first.
    Yoast SEO Premium allows you to [set related keyphrases and synonyms](https://yoast.com/use-synonyms-and-related-keywords/) too, which is great if you want to take your SEO copywriting to the next level. You need user-focused and high-quality content to rank high in a (competitive) market. Because [Google is getting smarter](https://yoast.com/premium-seo-analysis-as-smart-as-google/), Yoast SEO Premium recognizes [variations of your keyphrase](https://yoast.com/features/synonyms-related-keyphrases-word-forms/) and helps you write natural and user-friendly content.

5. Open the Readability analysis tab in the Yoast sidebar.
6. Confirm that the Sentence length and Paragraph length assessments are red and have a DISABLED ai optimize button.
7. Hover over the button and confirm that a tooltip with the text Your blocks are not supported by Yoast AI Optimize. This means you cannot use this feature with your current content. is shown.
8. Confirm that the tooltip fits within the sidebar and doesn't exceed it.

Relevant test scenarios

• Changes should be tested with the browser console open
• Changes should be tested on different posts/pages/taxonomies/custom post types/custom taxonomies
• Changes should be tested on different editors (Default Block/Gutenberg/Classic/Elementor/other)
• Changes should be tested on different browsers
• Changes should be tested on multisite

Test instructions for QA when the code is in the RC

• QA should use the same steps as above.

QA can test this PR by following these steps:

Impact check

This PR affects the following parts of the plugin, which may require extra testing:

UI changes

• This PR changes the UI in the plugin. I have added the 'UI change' label to this PR.

Other environments

• This PR also affects Shopify. I have added a changelog entry starting with [shopify-seo], added test instructions for Shopify and attached the Shopify label to this PR.

Documentation

• I have written documentation for this change. For example, comments in the Relevant technical choices, comments in the code, documentation on Confluence / shared Google Drive / Yoast developer portal, or other.

Quality assurance

• I have tested this code to the best of my abilities.
• During testing, I had activated all plugins that Yoast SEO provides integrations for.
• I have added unit tests to verify the code works as intended.
• If any part of the code is behind a feature flag, my test instructions also cover cases where the feature flag is switched off.
• I have written this PR in accordance with my team's definition of done.
• I have checked that the base branch is correctly set.

Innovation

• No innovation project is applicable for this PR.
• This PR falls under an innovation project. I have attached the innovation label.
• I have added my hours to the WBSO document.

Fixes https://github.com/Yoast/wordpress-seo-premium/issues/4566