@import '~@angular/material/_theming.scss';

@mixin _checkmark-color($color) {
  .mat-checkbox-checkmark {
    fill: $color;
  }
  .mat-checkbox-mixedmark {
    background-color: $color;
  }
  .mat-checkbox-checkmark-path {
    stroke: $color !important;
  }
}

@mixin ai-checkbox-theme($theme) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);
  $warn: map-get($theme, warn);

  // The color of the checkbox's checkmark / mixedmark.
  $checkbox-mark-primary-color: mat-color($primary, default-contrast);
  $checkbox-mark-accent-color: mat-color($accent, default-contrast);
  $checkbox-mark-warn-color: mat-color($warn, default-contrast);

  .mat-checkbox {
    &.mat-primary {
      @include _checkmark-color($checkbox-mark-primary-color);
    }

    &.mat-accent .mat-checkbox-background {
      @include _checkmark-color($checkbox-mark-accent-color);
    }

    &.mat-warn .mat-checkbox-background {
      @include _checkmark-color($checkbox-mark-warn-color);
    }
  }

  .mat-checkbox-frame {
    background-color: white !important;
  }
}