CSS style from app.component.css not getting applied to the tabs body content

I actually got it to work after researching about @Gilsdav's comment

In my app.component.css file I changed it to

:host ::ng-deep .mat-tab-body-content{
    padding-top:20px
}

Its working now. Thanks! Learned something new today! :)

In the root directory ( where the main.ts is ) there's a style.css or style.scss ( depends on what you chose ) - placing the code there - is global.

I believe that app.component.scss applies only to app.component.html directly ( lazy load pages aren't getting that css )