How to hide mat-tab-header with nested tab groups, hide for outer mat-tab-group without hiding for inner

Question

I have html essentially

<mat-tab-group>
    <mat-tab>
        <mat-tab-group>
            <mat-tab>
            </mat-tab>
        </mat-tab-group>
    </mat-tab>
</mat-tab-group>

How can I use css (or any method really) to hide the outer tabs groups mat-tab-header element, but not affect the inner tab header?

Answer 1

Figured it out, just had to select direct child

<mat-tab-group class="invisible-tabs">
    <mat-tab>
        <mat-tab-group>
            <mat-tab>
            </mat-tab>
        </mat-tab-group>
    </mat-tab>
</mat-tab-group>

.invisible-tabs {
  > .mat-tab-header {
    display: none;
  }
}