.ds-control-drag-handle {
  background-color: var(--ds-color-london-20);
  height: 100%;
  position: relative;
  width: 0.25rem;
}

.ds-control-drag-handle__thumb {
  left: -0.875rem;
  position: absolute;
  top: calc(50% - 0.875rem);
}

.ds-control-drag-handle--horizontal {
  height: 0.25rem;
  width: 100%;
  .ds-control-drag-handle__thumb {
    left: calc(50% - 0.875rem);
    top: -0.875rem;
  }
}

.ds-control-drag-handle--disabled {
  background-color: var(--ds-color-london-95);
  cursor: not-allowed;
}

.ds-control-drag-handle--inverse {
  background-color: var(--ds-color-london-100);
  &.ds-control-drag-handle--disabled {
    background-color: hsla(0, 0%, 40%);
    cursor: not-allowed;
  }
}