@use '@material/checkbox/mixins' as checkbox-mixins;
@use '@material/ripple/mixins' as ripple-mixins;
@use '@material/theme' as color;

.demo-checkbox--custom-all .mdc-checkbox {
  $color: color.$red-500;
  @include checkbox-mixins.focus-indicator-color($color);
  @include ripple-mixins.states($color);
  @include checkbox-mixins.container-colors(
    $unmarked-stroke-color: $color,
    $unmarked-fill-color: rgba($color, 0.25),
    $marked-fill-color: $color
  );
}

.demo-checkbox--custom-stroke-and-fill .mdc-checkbox {
  @include checkbox-mixins.container-colors(
    $unmarked-stroke-color: color.$blue-500,
    $marked-fill-color: color.$purple-500
  );
}
