@import "../../scss/tabs-common";

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

@include paginated-tab-header;

.mat-tab-links {
  @include paginated-tab-header-item-wrapper;
}

.mat-ink-bar {
  @include ink-bar;
}

.mat-tab-link-container {
  @include paginated-tab-header-container;
}

// Wraps each link in the header
.mat-tab-link {
  @include tab-label;
  vertical-align: top;
  text-decoration: none; // Removes anchor underline styling
  position: relative;
  overflow: hidden; // Keeps the ripple from extending outside the element bounds
  -webkit-tap-highlight-color: transparent;

  [mat-stretch-tabs] & {
	flex-basis: 0;
	flex-grow: 1;
  }

  &.mat-tab-disabled {
	// We use `pointer-events` to make the element unclickable when it's disabled, rather than
	// preventing the default action through JS, because we can't prevent the action reliably
	// due to other directives potentially registering their events earlier. This shouldn't cause
	// the user to click through, because we always have a `.mat-tab-links` behind the link.
	pointer-events: none;
  }
}

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