@layer atoms {
  .mobius-progress__track {
    background-color: var(--color-background-light);
    margin-bottom: var(--size-xs);
    height: var(--size-xs);
  }

  .mobius-progress__label {
    display: block;
    margin-bottom: var(--size-xs);
  }

  .mobius-progress__bar {
    background-color: var(--color-primary);
    height: 100%;
  }

  .mobius-progress__track,
  .mobius-progress__bar {
    border-radius: 999px;
  }

  .mobius-progress {
    &.--is-primary .mobius-progress__bar {
      background-color: var(--color-primary);
    }

    &.--is-secondary .mobius-progress__bar {
      background-color: var(--color-secondary);
    }
  }
}
