I am having an issue with layout layers I guess.

I have a mat-dialog component, which has a form inside of it with select (custom made, not mat-select).
The dropdown of the select has position absolute, but it is still being cut by mat-dialog.

Also the same type of behavior goes with mat-tabs.

I have tried to play with overflow and z-index, but as I don’t actually understand the origin of the problem, I can’t really blindly fix it.

My designer expecting the content of dropdown to be on the front layer even in dialog container. T_T Does anybody know the backdoor fot this issue?