.cobalt- {
  &ProgressBar__TitleSection {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  &ProgressBar__Progression {
    @apply c-text-title-md c-text-tertiary;
  }

  &ProgressBar__Title {
    @apply c-text-title-sm c-text-onSurface;
  }

  &ProgressBar__CompletedCheckbox {
    path {
      @apply c-fill-primary;
    }
  }

  &ProgressBar__Container {
    @apply c-bg-surfaceContainerVariant c-rounded c-mt-sm c-h-2xs;
    position: relative;

    width: 100%;

    border-radius: 2px;
  }

  &ProgressBar__Foreground {
    @apply c-bg-primary c-rounded c-h-2xs;
    position: absolute;
    left: 0;
    top: 0;

    border-radius: 2px;
  }

  &ProgressBar__Tick {
    @apply c-bg-primary c-rounded c-w-2xs c-h-sm;
    position: absolute;
    top: -6px;
    right: 0;

    border-radius: 2px;
  }
}