Popovers appearing behind other content

[Licen-it]

Detailed description

Describe in detail the issue you're having.

Since the tooltips are now living under the same hood of their trigger, if up the line any node is defining a z-index property, the z-index: 6000; set by the tooltip is irrelevant since it will be 6000 within the parent z-index level. This is causing, in certain situations, the tooltip (or any popover) to appear behind other content (i'm using [autoAlign]="true"). In v4 this wasn't happening since the tooltip was placed inside the placeholder or appended to the body which would solve the z-index issue. The screenshot below shows the effect of another similar problem: position: sticky The tooltip trigger is inside an element with position: sticky and the element below has the same property (all the cells in that columns have that property). This is making the tooltip position: absolute to appear behind the following position: sticky the same way it would happen if there was a z-index

Is this a feature request (new component, new icon), a bug, or a general issue?

bug

Is this issue related to a specific component?

Any popover

What did you expect to happen? What happened instead? What would you like to see changed?

The popover should ignore the parent z-index and appear over other elements in the page

What browser are you working in?

any

What version of the Carbon Design System are you using?

latest

What offering/product do you work on? Any pressing ship or release dates we should be aware of?

Zelta

Steps to reproduce the issue

1. Create a tooltip
2. place it in a container with z-index: -1;
3. sorround the container with other elements
4. trigger the tooltip

Screenshot