@use 'sass:map';
@use '@angular/material' as mat;

@mixin material-override($theme) {
  @include mat-button-toggle($theme);
  @include mat-tab-group($theme);
}

@mixin mat-tab-group($theme) {
  mat-tab-group,
  mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper {
    height: 100%;
    overflow: hidden;
  }
}

@mixin mat-button-toggle($theme) {
  $accent: map.get($theme, accent);
  $dark: mat.m2-define-palette(mat.$m2-grey-palette, 800, 700, 900);
  $density: mat.m2-get-density-config($theme);

  $theme: map.merge(
    $theme,
    (
      density: $density - 3
    )
  );

  @include mat.button-toggle-density($theme);

  mat-button-toggle {
    color: black !important;

    &.mat-button-toggle-checked {
      background-color: mat.m2-get-color-from-palette($accent);
      color: mat.m2-get-color-from-palette($dark);
    }
  }
}
