@use '@material/feature-targeting/index' as feature-targeting;
@use '@material/ripple/index' as ripple;
@use '@material/fab/index' as fab;
@use '@material/fab/fab-theme';

@mixin core-styles($query: feature-targeting.all()) {
  @include without-ripple($query);
  @include ripple($query);
}

@mixin without-ripple($query: feature-targeting.all()) {
  .smui-fab--color-primary {
    @include fab.container-color(primary, $query: $query);
    @include fab.ink-color(on-primary, $query: $query);
  }

  a.mdc-fab {
    &,
    &:visited {
      @include fab.ink-color(on-secondary, $query: $query);
    }
  }

  a.smui-fab--color-primary {
    &,
    &:visited {
      @include fab.ink-color(on-primary, $query: $query);
    }
  }
}

@mixin ripple($query: feature-targeting.all()) {
  // Ripple aren't working in MDC 11.
  .mdc-fab {
    @include ripple.states(
      on-secondary,
      $query: $query,
      $ripple-target: fab-theme.$ripple-target
    );
  }

  .smui-fab--color-primary {
    @include ripple.states(
      on-primary,
      $query: $query,
      $ripple-target: fab-theme.$ripple-target
    );
  }
}
