.mat-ink-bar, .mat-tab-label {
  height: 32px;
  border-radius: 25px;
}

.mat-tab-group .mat-tab-list .mat-ink-bar {
  z-index: -1;
  bottom: 4px;
  @include bgColor($palette-primary, 'lighter');
}

.mat-tab-label {
  height: 40px;
  min-width: 5rem;
  @include textColor($palette-primary, 'default');
  opacity: 1;

  .mat-ripple-element {
    opacity: 0.2;
    z-index: -1;
    background-color: map_get($palette-primary, 'lighter');
  }
}

.mat-tab-label-active {
  @include textColor($palette-primary, 'default');
}



.mat-tab-nav-bar, .mat-tab-header {
  padding: .5rem 0;
  border-bottom: none !important;
}

.mat-tab-label .mat-badge-medium.mat-badge-after {
  margin-top: -9px  ;
  .mat-badge-content {
    position: relative;
    top: -3px;
    right: 0;
    margin-right: -12px;
  }
}

.pad-tab-header-t-5 .mat-tab-header { @extend .pt-5; }
.pad-tab-header-t-4 .mat-tab-header { @extend .pt-4; }
.pad-tab-header-t-3 .mat-tab-header { @extend .pt-3; }
.pad-tab-header-t-2 .mat-tab-header { @extend .pt-2; }
.pad-tab-header-t-1 .mat-tab-header { @extend .pt-1; }

.pad-tab-header-r-5 .mat-tab-header { @extend .pr-5; }
.pad-tab-header-r-4 .mat-tab-header { @extend .pr-4; }
.pad-tab-header-r-3 .mat-tab-header { @extend .pr-3; }
.pad-tab-header-r-2 .mat-tab-header { @extend .pr-2; }
.pad-tab-header-r-1 .mat-tab-header { @extend .pr-1; }

.pad-tab-header-l-5 .mat-tab-header { @extend .pl-5; }
.pad-tab-header-l-4 .mat-tab-header { @extend .pl-4; }
.pad-tab-header-l-3 .mat-tab-header { @extend .pl-3; }
.pad-tab-header-l-2 .mat-tab-header { @extend .pl-2; }
.pad-tab-header-l-1 .mat-tab-header { @extend .pl-1; }

.pad-tab-header-b-5 .mat-tab-header { @extend .pb-5; }
.pad-tab-header-b-4 .mat-tab-header { @extend .pb-4; }
.pad-tab-header-b-3 .mat-tab-header { @extend .pb-3; }
.pad-tab-header-b-2 .mat-tab-header { @extend .pb-2; }
.pad-tab-header-b-1 .mat-tab-header { @extend .pb-1; }

.pad-tab-header-x-5 .mat-tab-header { @extend .px-5; }
.pad-tab-header-x-4 .mat-tab-header { @extend .px-4; }
.pad-tab-header-x-3 .mat-tab-header { @extend .px-3; }
.pad-tab-header-x-2 .mat-tab-header { @extend .px-2; }
.pad-tab-header-x-1 .mat-tab-header { @extend .px-1; }

.pad-tab-header-y-5 .mat-tab-header { @extend .py-5; }
.pad-tab-header-y-4 .mat-tab-header { @extend .py-4; }
.pad-tab-header-y-3 .mat-tab-header { @extend .py-3; }
.pad-tab-header-y-2 .mat-tab-header { @extend .py-2; }
.pad-tab-header-y-1 .mat-tab-header { @extend .py-1; }


