So, I am seeing that you have the theme editor with some styles. Those styles are going to override any other style that's why the blue background is still there.

Click on the Reset All Styles button
And of course, you need to remove the styles for the content. That way your login will be flexed all over the screen

When you put flex:0 you need to know what you are doing. Because flex: 0 its the same as flex-grow. The flex gro property "This property specifies how much of the remaining space in the flex container should be assigned to the item (the flex grow factor). "

To make the background image, or color the same, you need to find the right classes

Everytime you see that there is a background color different from what you want you need to capture the class that is giving that backgrounmd, because then you just need to change the css. Going to give you an example and you can do to the rest the same:
I copy and paste on the modules theme style sheet and i change the background

And there you go!

EDIT:
I forgot that you can also use the root to change the background
:root{
--color-background-body:url(/CONNECTION_Mobile/img/CONNECTION_Mobile.SampleBackgroundImageBlur3.png) ;
--color-background-login:url(/CONNECTION_Mobile/img/CONNECTION_Mobile.SampleBackgroundImageBlur3.png) ;
}
But there will be always some classes that will not use this variables to put the background. And you will need to do the previous step that i have shown to you.
Maybe this guided path can help you to study this little frontend details
https://www.outsystems.com/training/paths/16/becoming-a-front-end-developer-in-outsystems/
Kind Regards,
Márcio