.lbaic-settings-progress {
  --lbaic-settings-progress-fill-width: 30%;
  --lbaic-settings-progress-h: 10px;
  --lbaic-settings-progress-bg: rgba(var(--lbaic-settings-primary-rgb), .2);
  --lbaic-settings-progress-fill: var(--lbaic-settings-primary);
  --lbaic-settings-progress-radius: 2px;

  & {
    position: relative;
    width: 100%;
    height: var(--lbaic-settings-progress-h);
    background-color: var(--lbaic-settings-progress-bg);
    border-radius: var(--lbaic-settings-progress-radius);
    cursor: pointer;
    overflow: hidden;

    &:not(:last-child) {
      margin-block-end: 24px;
    }
  }

  &-bar {
    width: var(--lbaic-settings-progress-fill-width);
    height: 100%;
    background-color: var(--lbaic-settings-progress-fill);
    transition: width 300ms ease;
  }
}