.lbaic-settings-range {
  position: relative;
  width: 100%;
  display: flex;

  &-holder {

  }

  &-h-42 {
    height: 42px;
  }

  &-wrapper {

  }

  &-input {
    &[type='range'] {
      width: 100%;
      height: 100%;
      background-color: transparent;
      appearance: none;
      cursor: pointer;

      &::-webkit-slider-runnable-track {
        height: 4px;
        background-color: var(--lbaic-settings-range-default-bg);
        background-image: linear-gradient(to right, var(--lbaic-settings-range-active-bg) 0%, var(--lbaic-settings-range-active-bg) 100%);
        background-size: var(--lbaic-settings-range-value) 100%;
        background-repeat: no-repeat;
        border-radius: 2px;
      }

      &::-webkit-slider-thumb {
        width: 20px;
        height: 20px;
        margin-top: -8px;
        background-color: var(--lbaic-settings-range-thumb-bg);
        border-radius: 50%;
        box-shadow: var(--lbaic-settings-range-thumb-shadow);
        appearance: none;
      }

      &:focus {
        outline: none;

        &::-webkit-slider-thumb {
          outline: none;
        }
      }

      &::-moz-range-track {
        height: 4px;
        background-color: var(--lbaic-settings-range-default-bg);
        background-image: linear-gradient(to right, var(--lbaic-settings-range-active-bg) 0%, var(--lbaic-settings-range-active-bg) 100%);
        background-size: var(--lbaic-settings-range-value) 100%;
        background-repeat: no-repeat;
        border-radius: 2px;
      }

      &::-moz-range-thumb {
        width: 28px;
        height: 28px;
        background-color: var(--lbaic-settings-range-thumb-bg);
        border-radius: 50%;
        box-shadow: var(--lbaic-settings-range-thumb-shadow);
      }

      &:focus::-moz-range-thumb {
        outline: none;
      }
    }
  }

  &-header {

    &-in {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
      margin-block-end: 10px;
    }

    &-label {
      display: flex;
      align-items: center;
      gap: 6px;

      &-in {
        font-size: var(--lbaic-settings-fs-14);
        font-weight: var(--lbaic-settings-fw-500);
        line-height: var(--lbaic-settings-lh-18);
        cursor: pointer;
      }
    }
  }

  &-value {

  }
}