Problem with popup validator

I have a problem with the popup validator. When popup arises, no meter I put my mouse cursor on that field or so, popup stays arisen. It would be better to remove validation after mouse click on the validated field.

Blazor validation doesn't work this way I am afraid. Once a validation error triggers it stays until the user corrects it. Nothing we can do with this regard.

Found solution to my problem with extended

.rz-message-popup {
    left: 50px;
}

but it only works if I save site.css during runtime execution which means that only then it is loaded after [radzen-theme].css.

My question is where to put my site.css to be loaded after [radzen-theme].css?

This is how my app.razor head looks like:

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="@NavigationManager.BaseUri" />
    <link rel="icon" href="S_Box_Ikonica_00001.ico" />
    <RadzenTheme Theme="fluent" @rendermode="RenderMode.InteractiveServer" />
    <link rel="stylesheet" href="css/site.css" />
    <HeadOutlet @rendermode="@InteractiveServer" />
    <meta http-equiv="Content-Security-Policy"
          content="base-uri 'self';
               img-src data: https:;
               object-src 'none';
               script-src 'self' 'unsafe-eval' 'wasm-unsafe-eval' 'unsafe-inline';
               style-src 'self' 'unsafe-inline';
               upgrade-insecure-requests;">
</head>

Your CSS is loaded after the theme as is evident by the provided code. The CSS rule probably lacks specificity and gets overridden by the theme. Adding !important usually helps in such cases.