Here is the structure.
Now, my parent has main global css stylesheet with bootstrap and all color-palettes. In my child, I gave another stylesheet with ViewEncapsulation.Emulated to scope it. But my Grand child takes css of parent and not child. Even though, according to hierarchy child is grand-child's parent. What to do if I want grand-child to take the styles of child and not parent.
background: red none;
So every button should be red let's say.
my child is the admin-console. So its a whole new look and feel.
background: gray none;
grand-child.component.html has a button. So I expect it would be gray as it is scoped inside child. But it becomes red.