ReCaptcha pop up causes instability in android webview for RTL pages

ReCaptcha works properly in normal LTR pages but in RTL(Arabic in my case), causing an unstable page in a web view in android.

I have applied overflow-x: hidden; as well in the topmost body as per this page: reCAPTCHA causes a long horizontal scroll on RTL pages but not working.

please check my codes below:

 val settings: WebSettings = binding?.webView?.settings!!
    settings.javaScriptEnabled = true
    settings.loadWithOverviewMode = true
    settings.useWideViewPort = false
    settings.setSupportZoom(true)
    settings.builtInZoomControls = false
    settings.layoutAlgorithm = WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING
    settings.cacheMode = WebSettings.LOAD_DEFAULT
    settings.domStorageEnabled = true
    settings.javaScriptCanOpenWindowsAutomatically = true
    binding?.webView?.isFocusable = true
    binding?.webView?.setBackgroundColor(Color.TRANSPARENT)
    binding?.webView?.scrollBarStyle = WebView.SCROLLBARS_OUTSIDE_OVERLAY
    binding?.webView?.isScrollbarFadingEnabled = true
    settings.allowFileAccess = true // Readable file cache
    settings.allowContentAccess = true
    binding?.webView?.isFocusable = true
    binding?.webView?.setBackgroundColor(Color.TRANSPARENT)
    binding?.webView?.scrollBarStyle = WebView.SCROLLBARS_OUTSIDE_OVERLAY
    binding?.webView?.isScrollbarFadingEnabled = true

    binding?.webView?.loadUrl("webUrl")

see the snapshots for behavior.