.n-switch-btn
  cursor pointer
  display inline-block
  width 38px
  height 20px
  border-radius 10px
  background-color #BAC1C7
  transition background-color 0.2s ease
  .n-switch-point
    display inline-block
    transition transform 0.2s ease
    transform translate(2px, 2px)
    width 16px
    height @width
    border-radius 50%
    background-color #FFF
  &.active
    background-color $primary-color
    .n-switch-point
      transform translate(20px, 2px)
  &.disabled
    background-color #C8D0D6
    cursor default
    .n-switch-point
      background-color #D9DFE5
  &.active.disabled
    background-color #BFCFE1


.n-switch-picker
  display inline-flex
  align-items center
  cursor pointer
  .n-filter-placed
    margin-left 8px
  .n-switch-point
    width 10px
    height @width
    border-radius 50%
    margin 0 8px 0 4px
    background-color #d9dfe5
    border 2px solid #fff
  &.disabled
    cursor default
  &.active
    .n-filter-placed
      color $primary-color
      font-weight bold
    .n-switch-point
      background-color $primary-color
      border-color tint($primary-color, 80%)