¿Cómo podría agregar un estilo a la pestaña mat? Resulta que en un componente tengo dos mat-tabs pero quiero dejar los mat-tabs con diferente estilo, ¿es esto factible? Actualmente tengo este código css donde quiero agregarle este estilo a uno, pero a otro el que tiene angular por defecto.

por ejemplo, tengo un estilo mat-tabs modificado como el siguiente, que quiero poner en una pestaña de las dos que tengo en mi componente

 host::ng-deep.mat-tab-label-container { overflow: visible ; margin-bottom: 6px ; .mat-tab-labels { background-color: transparent; justify-content: center; .mat-tab-label { height: 30px ; padding: 0px 50px ; min-width: 70px ; opacity: 1 ; } .mat-tab-label-active { background-color: transparent ; } } .mat-tab-label-active{ color: #43a9f8 ; opacity: 1 ; } .mat-tab-label:focus { color: #43a9f8 ; font-weight: 700 ; font-size: 15px ; } .mat-tab-label { color: #969da2 ; font-weight: 700 ; height: 30px ; font-size: 15px ; } } :host::ng-deep.mat-tab-group.mat-primary { .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { background-color: transparent ; height: 4px ; &::before { content: '' ; display: block ; width: 30.5% ; background-color: #43a9f8 ; height: 6px ; border-radius: 10px ; left: 34.5% ; position: relative ; } } } :host::ng-deep.mat-tab-body-content { padding: 15px 30px ; overflow: hidden ; height: auto; }

A la otra pestaña quiero que siga teniendo el estilo del scc principal

 .mat-tab-label-container { .mat-tab-labels { background-color: $primary-color; justify-content: center; .mat-tab-label { height: 65px; padding: 0px 15px; min-width: 70px; opacity: 1; } .mat-tab-label-active { background-color: #f59c00; } .mat-tab-label, .mat-tab-link { font-size: 0.6875rem; color: #fff; font-weight: 300; } .mat-tab-label-content { flex-direction: column; img { width: 21px; height: 21px; } } } .mat-ink-bar { visibility: hidden; } } .mat-tab-body-content { padding: 10px 30px !important; height: 325px; }

He intentado agregar mat-tab-group en una clase pero no me funciona.

 <mat-tab-group class="blabla" dynamicHeight> <mat-tab label="Short tab"> <div class="example-small-box mat-elevation-z4"> Small content </div> </mat-tab> <mat-tab label="Long tab"> <div class="example-large-box mat-elevation-z4"> Large content </div> </mat-tab> </mat-tab-group>

¿Cómo podría tener diferentes estilos en las pestañas del tapete?