.toggle-switch {
  width: 50px;
  height: 26px;
  background-color: var(--typography-400);
  border-radius: 25px;
  cursor: pointer;
  position: relative;
  transition: background-color 0.3s;

  &.on {
    background-color: var(--primary-600);

    & > .toggle-handle {
      left: 27px;
    }
  }
}

.toggle-handle {
  width: 20px;
  height: 20px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: 3px;
  left: 3px;
  transition: left 0.3s;
}
