@import '../jnt-variables';
@import '../jnt-hosts';
@import '../jnt-functions';

@keyframes jnt-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba($jnt-primary-color, .5);
  }
  70% {
    box-shadow: 0 0 0 20px rgba($jnt-primary-color, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba($jnt-primary-color, 0);
  }
}
@mixin jnt-dot($passed: (), $context: null, $strategy: 'changes') {
  $defs: (
    size: 12px
  );
  $vars: $passed;
  $declare: false;
  $wrapper: null;
  @if $jnt-ng-deep {
    $wrapper: '::ng-deep';
  }
  @if $passed == () or $strategy == 'merge' {
    $vars: recursive-map-merge($defs, $passed);
    $declare: true;
  }
  #{if($context, $context, $jnt-dot-host)} {
    @if $declare {
      display: inline-block;
      border-radius: 50%;
    }
    min-width: map-get($vars, size);
    min-height: map-get($vars, size);
    width: map-get($vars, size);
    height: map-get($vars, size);
    &[data-features*='pulse'] {
      animation: jnt-pulse 1.5s infinite;
    }
  }
}
@if $jnt-debug {
  @debug 'dot compiled';
}