Cómo mostrar Dialog en pantalla completa con una superposición cuando Dialog incrustado dentro de Iframe

Aplicación principal: Representar a la barra lateral (color blanco en el fondo)

Encuadro App: Representar a color de fondo gris

La aplicación iframe está incrustada dentro de la aplicación principal. ahora, cuando se muestra el cuadro de diálogo, quiero evitar el evento de clic de la aplicación principal.

la conclusión es cuando el cuadro de diálogo es visible, quiero evitar que otra acción haga clic, si hacemos clic en el menú de la barra lateral inicio/usuario/panel/prueba, el cuadro de diálogo se cierra automáticamente. No debe estar cerca y evitar clics externos.

Quiero lograr con CSS solo si es posible.

Leí y probé muchos blogs medianos, artículos, comunidad de desarrolladores, problemas de GitHub, pero no obtuve una respuesta adecuada.