@import '../../material-design-lite/variables';
$circle-text-color: $text-color-primary !default;
$circle-font-size: 3.6rem !default;
$circle-font-weight: 700 !default;
$circle-transition: stroke-dashoffset 0.5s ease-out !default;

.mdl-circle {
  font-family: inherit;

  color: $circle-text-color;
  text {
    font-family: inherit;
    font-size: $circle-font-size;
    font-weight: $circle-font-weight;

    text-anchor: middle;
    fill: currentColor;
  }
  circle {
    fill: none;
  }

  &__front {
    transition: $circle-transition;
    &.no-transition {
      transition: none;
    }
  }
}