/**
    Padding
*/
/**
    Margin Section
*/
/**
    Font Section
*/
/*
    Canvas Element Colors
*/
.circular-progress-indicator {
  cursor: pointer;
  position: relative;
}

.vss-focus-visible .circular-progress-indicator:focus {
  outline: 1px solid rgba( 0, 0, 0 ,  1 );
  outline: 1px solid rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.circular-progress-indicator:hover .circular-progress-indicator-inner-circle path, .circular-progress-indicator:focus .circular-progress-indicator-inner-circle path {
  fill: rgba( 239, 246, 252 ,  1 );
  fill: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.circular-progress-indicator svg {
  height: 255px;
  width: 335px;
}

.circular-progress-indicator svg.circular-progress-indicator-outer-circle path {
  stroke-width: 15px;
}

.circular-progress-indicator svg.circular-progress-indicator-outer-circle .placeholder {
  stroke: rgba( 200, 200, 200 ,  1 );
  stroke: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.circular-progress-indicator svg.circular-progress-indicator-inner-circle {
  position: absolute;
  top: 0;
  left: 0;
}

.circular-progress-indicator svg.circular-progress-indicator-inner-circle path {
  stroke-width: 0px;
}

.circular-progress-indicator .circular-progress-inner-container {
  position: absolute;
  top: 48px;
  left: 50px;
}