@import "./mixin";
.ws-state-switch {
  @include flex;
  @include flex_align;
  @include no_select;
  cursor: pointer;
  &.active {
    .ws-state-switch__switch {
      background-color: var(--v-primary-base);
      .ws-state-switch__switch-button {
        @include tf_ps(16px, 0);
      }
    }
  }
  .ws-state-switch__switch {
    @include ts;
    padding: 2px;
    width: 40px;
    height: 24px;
    border-radius: 11px;
    background-color: var(--v-inputBorder-base);
    .ws-state-switch__switch-button {
      @include ts;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background-color: #ffffff;
    }
  }
  .ws-state-switch__text {
    margin-left: 8px;
    font-size: 0.875rem;
    line-height: 1.43;
    color: var(--v-textPrimary-base);
  }
}