@use '@angular/material' as mat;
@import '@angular/material';

// Material tab mixin
@mixin mat-tab-override($theme) {
  $primary: map-get($theme, primary);
  $is-dark: map-get($theme, is-dark);

  .mat-mdc-tab-group,
  .mat-tab-link-container {
    .mat-mdc-tab-label-container {
      @if $is-dark {
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
      } @else {
        border-bottom: 1px solid rgba(1, 1, 1, 0.12);
      }
    }

    .mat-mdc-tab:focus span.mdc-tab__text-label {
      outline: 1px solid transparent;
      outline-offset: 1px;
      box-shadow: -1px -1px 0px map-get($primary, A400) inset, 1px -1px 0px map-get($primary, A400) inset,
        -1px 1px 0px map-get($primary, A400) inset, 1px 1px 0px map-get($primary, A400) inset;
    }

    .mdc-tab__text-label,
    .mat-mdc-tab:not(.mat-mdc-tab-disabled) .mdc-tab__text-label,
    .mat-mdc-tab-link:not(.mat-mdc-tab-disabled) .mdc-tab__text-label {
      color: map-get($primary, A400);
      letter-spacing: normal;
      border: transparent solid 1px;
      padding: 5px;
    }

    .mat-mdc-tab:not(.mat-mdc-tab-disabled),
    .mat-mdc-tab-link:not(.mat-mdc-tab-disabled) {
      opacity: 1;
      font-size: 16px;
    }

    .mat-mdc-tab:hover:not(.mat-mdc-tab-disabled) {
      @if $is-dark {
        background-color: map-get($mic-grey, 600);
      } @else {
        background-color: map-get($primary, A100);
      }
    }

    .mat-mdc-tab-link:hover:not(.mat-mdc-tab-disabled),
    .mat-mdc-tab:hover:not(.mat-mdc-tab-disabled),
    .mat-mdc-tab:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label {
      text-shadow: 0.4px 0 0, -0.4px 0 0;

      .mdc-tab__ripple::before {
        background-color: transparent;
      }
    }

    .mdc-tab-indicator .mdc-tab-indicator__content--underline {
      border-width: 5px;
    }
  }

  .mat-mdc-tab-group.mat-accent {
    @if $is-dark {
      background-color: map-get($primary, A700);
    } @else {
      background-color: map-get($primary, A400);
    }

    .mat-mdc-tab:focus span.mdc-tab__text-label {
      @if $is-dark {
        box-shadow: -1px -1px 0px black inset, 1px -1px 0px black inset, -1px 1px 0px black inset, 1px 1px 0px black inset;
      } @else {
        box-shadow: -1px -1px 0px white inset, 1px -1px 0px white inset, -1px 1px 0px white inset, 1px 1px 0px white inset;
      }
    }

    .mdc-tab__text-label,
    .mat-mdc-tab:not(.mat-mdc-tab-disabled) .mdc-tab__text-label,
    .mat-mdc-tab-link:not(.mat-mdc-tab-disabled) .mdc-tab__text-label,
    .mat-mdc-tab:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label {
      @if $is-dark {
        color: mat.m2-get-contrast-color-from-palette($primary, A100);
      } @else {
        color: mat.m2-get-contrast-color-from-palette($primary, A400);
      }
    }

    .mat-mdc-tab:not(.mat-mdc-tab-disabled) .mdc-tab-indicator__content--underline {
      @if $is-dark {
        border-color: mat.m2-get-contrast-color-from-palette($primary, A100);
      } @else {
        border-color: mat.m2-get-contrast-color-from-palette($primary, A400);
      }
    }

    .mat-mdc-tab-body,
    .mat-mdc-tab-body p {
      @if $is-dark {
        color: mat.m2-get-contrast-color-from-palette($primary, A100);
      } @else {
        color: mat.m2-get-contrast-color-from-palette($primary, A400);
      }
    }
    .mat-mdc-tab:hover:not(.mat-mdc-tab-disabled) {
      @if $is-dark {
        background-color: inherit;
      }
      else {
        background-color: map-get($primary, A200);
      }
    }
  }
}
