Site messages should follow a proper design format, ensuring that errors, warnings, and status messages are clearly distinguishable and user-friendly.

Please check styled all three Status , Error and Warning message.

This is js or dependency error, please check and find the better solution.
That is not an CSS issue @rahuly072
1st solution is, check after disabled big pipe module.

I am looking into it.

Hi @anoopsingh92, after disabling Bigpipe module the issue is not coming. But instead of disabling Bigpipe module we can go with this solution

use Drupal\Core\Render\Element\StatusMessages;

function flexi_style_preprocess_block__system_messages_block(&$variables) {
  $variables['content'] = StatusMessages::renderMessages();
  $variables['#cache']['max-age'] = 0;
}

you can see this core issue for reference: https://www.drupal.org/project/drupal/issues/3456176#comment-15738200 🐛 10.3 upgrade now missing status-message theme sugestions Active . Kindly share your review on the changes.

Thanks @sandip-poddar for identify the issue.
You didn't make any changes in the CSS file, can you please checkout this file from the MR css/base/elements.css

Yes @anoopsingh92, I am doing it.

Please verify the MR.

@anoopsingh92,
Since the issue has been solved and MR has been merged, can we move this issue to fixed now?

Automatically closed - issue fixed for 2 weeks with no activity.