.kt-ui-slider-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--kt-ui-slider-btn-size);
  height: var(--kt-ui-slider-btn-size);
  box-sizing: border-box;
  padding: 0;
  border: 2px solid var(--kt-ui-slider-btn-border-color);
  border-radius: var(--kt-ui-slider-btn-border-radius);
  color: var(--kt-ui-slider-btn-color);
  background-color: var(--kt-ui-slider-btn-background);
  cursor: pointer;
  transition-property: color, border-color, background-color;
  transition-duration: 160ms;
  transition-timing-function: linear;
}

.kt-ui-slider-btn:hover,
.kt-ui-slider-btn.kt-ui-slider-btn-hover {
  color: var(--kt-ui-slider-btn-color-hover);
  border-color: var(--kt-ui-slider-btn-border-color-hover);
  background-color: var(--kt-ui-slider-btn-background-hover);
}

.kt-ui-slider-btn:active,
.kt-ui-slider-btn.kt-ui-slider-btn-active {
  color: var(--kt-ui-slider-btn-color-active);
  border-color: var(--kt-ui-slider-btn-border-color-active);
  background-color: var(--kt-ui-slider-btn-background-active);
}

.kt-ui-slider-btn:focus-visible,
.kt-ui-slider-btn.kt-ui-slider-btn-focus {
  outline: none;
  border-color: var(--kt-ui-slider-btn-focus-color);
}

.kt-ui-slider-btn:disabled,
.kt-ui-slider-btn.kt-ui-slider-btn-disabled {
  color: var(--kt-ui-slider-btn-color-disabled);
  border-color: var(--kt-ui-slider-btn-border-color-disabled);
  background-color: var(--kt-ui-slider-btn-background-disabled);
  cursor: default;
}

.kt-ui-slider-btn.--hidden {
  display: none;
}

/* Region primary theme */
.kt-ui-slider-btn-primary {
  --kt-ui-slider-btn-color: var(--kt-ui-slider-btn-primary-color);
  --kt-ui-slider-btn-color-hover: var(--kt-ui-slider-btn-primary-color-hover);
  --kt-ui-slider-btn-color-active: var(--kt-ui-slider-btn-primary-color-active);
  --kt-ui-slider-btn-color-disabled: var(--kt-ui-slider-btn-primary-color-disabled);
  --kt-ui-slider-btn-background: var(--kt-ui-slider-btn-primary-background);
  --kt-ui-slider-btn-background-hover: var(--kt-ui-slider-btn-primary-background-hover);
  --kt-ui-slider-btn-background-active: var(--kt-ui-slider-btn-primary-background-active);
  --kt-ui-slider-btn-background-disabled: var(--kt-ui-slider-btn-primary-background-disabled);
  --kt-ui-slider-btn-border-color: var(--kt-ui-slider-btn-primary-border-color);
  --kt-ui-slider-btn-border-color-hover: var(--kt-ui-slider-btn-primary-border-color-hover);
  --kt-ui-slider-btn-border-color-active: var(--kt-ui-slider-btn-primary-border-color-active);
  --kt-ui-slider-btn-border-color-disabled: var(--kt-ui-slider-btn-primary-border-color-disabled);
}

/* Endregion */
/* Region secondary theme */
.kt-ui-slider-btn-secondary {
  --kt-ui-slider-btn-color: var(--kt-ui-slider-btn-secondary-color);
  --kt-ui-slider-btn-color-hover: var(--kt-ui-slider-btn-secondary-color-hover);
  --kt-ui-slider-btn-color-active: var(--kt-ui-slider-btn-secondary-color-active);
  --kt-ui-slider-btn-color-disabled: var(--kt-ui-slider-btn-secondary-color-disabled);
  --kt-ui-slider-btn-background: var(--kt-ui-slider-btn-secondary-background);
  --kt-ui-slider-btn-background-hover: var(--kt-ui-slider-btn-secondary-background-hover);
  --kt-ui-slider-btn-background-active: var(--kt-ui-slider-btn-secondary-background-active);
  --kt-ui-slider-btn-background-disabled: var(--kt-ui-slider-btn-secondary-background-disabled);
  --kt-ui-slider-btn-border-color: var(--kt-ui-slider-btn-secondary-border-color);
  --kt-ui-slider-btn-border-color-hover: var(--kt-ui-slider-btn-secondary-border-color-hover);
  --kt-ui-slider-btn-border-color-active: var(--kt-ui-slider-btn-secondary-border-color-active);
  --kt-ui-slider-btn-border-color-disabled: var(--kt-ui-slider-btn-secondary-border-color-disabled);
}

/* Endregion */
/* Region tertiary theme */
.kt-ui-slider-btn-tertiary {
  --kt-ui-slider-btn-color: var(--kt-ui-slider-btn-primary-color);
  --kt-ui-slider-btn-color-hover: var(--kt-ui-slider-btn-primary-color-hover);
  --kt-ui-slider-btn-color-active: var(--kt-ui-slider-btn-primary-color-active);
  --kt-ui-slider-btn-color-disabled: var(--kt-ui-slider-btn-primary-color-disabled);
  --kt-ui-slider-btn-background: var(--kt-ui-slider-btn-primary-background);
  --kt-ui-slider-btn-background-hover: var(--kt-ui-slider-btn-primary-background-hover);
  --kt-ui-slider-btn-background-active: var(--kt-ui-slider-btn-primary-background-active);
  --kt-ui-slider-btn-background-disabled: var(--kt-ui-slider-btn-primary-background-disabled);
  --kt-ui-slider-btn-border-color: var(--kt-ui-slider-btn-primary-border-color);
  --kt-ui-slider-btn-border-color-hover: var(--kt-ui-slider-btn-primary-border-color-hover);
  --kt-ui-slider-btn-border-color-active: var(--kt-ui-slider-btn-primary-border-color-active);
  --kt-ui-slider-btn-border-color-disabled: var(--kt-ui-slider-btn-primary-border-color-disabled);
}

/* Endregion */