@use '../../core/style/variables';
@use '../tabs-common';

// Wraps each link in the header
.mat-mdc-tab-link {
  @include tabs-common.tab;

  // Note that we only want to target direct descendant tabs.
  .mat-mdc-tab-header.mat-mdc-tab-nav-bar-stretch-tabs & {
    flex-grow: 1;
  }

  // For the tab-link element, default inset/offset values are necessary to ensure that
  // the focus indicator is sufficiently contrastive and renders appropriately.
  &::before {
    margin: 5px;
  }
}

@media (variables.$xsmall) {
  .mat-mdc-tab-link {
    min-width: 72px;
  }
}