/**
 *
 * This file may have been modified by Bytedance Inc. (“Bytedance Inc.'s Modifications”). 
 * All Bytedance Inc.'s Modifications are Copyright (year) Bytedance Inc..  
 * 
 * This source code is licensed under the Apache license.
 * See LICENSE file in the project root for license information.
 *
 */
.auxo-switch {
  margin: 0;
  padding: 0;
  color: #565960;
  font-size: 14px;
  font-variant: tabular-nums;
  line-height: 1.5715;
  list-style: none;
  font-feature-settings: 'tnum';
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  min-width: 48px;
  height: 28px;
  line-height: 28px;
  vertical-align: middle;
  background-color: #bcbdc0;
  border: 0;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.2s;
  user-select: none;
}
.auxo-switch:focus {
  outline: 0;
  box-shadow: 0 0 0 2px rgba(188, 189, 192, 0.1);
}
.auxo-switch-checked:focus {
  box-shadow: 0 0 0 2px rgba(25, 102, 255, 0.2);
}
.auxo-switch:focus:hover {
  box-shadow: none;
}
.auxo-switch-checked {
  background-color: #1966ff;
}
.auxo-switch-loading,
.auxo-switch-disabled {
  cursor: not-allowed;
  opacity: 0.4;
}
.auxo-switch-loading *,
.auxo-switch-disabled * {
  box-shadow: none;
  cursor: not-allowed;
}
.auxo-switch-inner {
  display: block;
  margin: 0 8px 0 29px;
  color: #ffffff;
  font-size: 12px;
  transition: margin 0.2s;
}
.auxo-switch-checked .auxo-switch-inner {
  margin: 0 29px 0 8px;
}
.auxo-switch-handle {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  transition: all 0.2s ease-in-out;
}
.auxo-switch-handle::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #ffffff;
  border-radius: 11px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0);
  transition: all 0.2s ease-in-out;
  content: '';
}
.auxo-switch-checked .auxo-switch-handle {
  left: calc(100% - 22px - 3px);
}
.auxo-switch:not(.auxo-switch-disabled):active .auxo-switch-handle::before {
  right: -30%;
  left: 0;
}
.auxo-switch:not(.auxo-switch-disabled):active.auxo-switch-checked .auxo-switch-handle::before {
  right: 0;
  left: -30%;
}
.auxo-switch-loading-icon {
  position: relative;
  top: 4px;
  color: rgba(0, 0, 0, 0.65);
  vertical-align: top;
}
.auxo-switch-checked .auxo-switch-loading-icon {
  color: #1966ff;
}
.auxo-switch-small {
  min-width: 30px;
  height: 18px;
  line-height: 18px;
}
.auxo-switch-small .auxo-switch-inner {
  margin: 0 4px 0 18px;
  font-size: 12px;
}
.auxo-switch-small .auxo-switch-handle {
  width: 14px;
  height: 14px;
}
.auxo-switch-small .auxo-switch-loading-icon {
  top: 2px;
  font-size: 10px;
}
.auxo-switch-small.auxo-switch-checked .auxo-switch-inner {
  margin: 0 18px 0 4px;
}
.auxo-switch-small.auxo-switch-checked .auxo-switch-handle {
  left: calc(100% - 14px - 3px);
}
.auxo-switch-rtl {
  direction: rtl;
}
.auxo-switch-rtl .auxo-switch-inner {
  margin: 0 29px 0 8px;
}
.auxo-switch-rtl .auxo-switch-handle {
  right: 3px;
  left: auto;
}
.auxo-switch-rtl:not(.auxo-switch-rtl-disabled):active .auxo-switch-handle::before {
  right: 0;
  left: -30%;
}
.auxo-switch-rtl:not(.auxo-switch-rtl-disabled):active.auxo-switch-checked .auxo-switch-handle::before {
  right: -30%;
  left: 0;
}
.auxo-switch-rtl.auxo-switch-checked .auxo-switch-inner {
  margin: 0 8px 0 29px;
}
.auxo-switch-rtl.auxo-switch-checked .auxo-switch-handle {
  right: calc(100% - 22px - 3px);
}
.auxo-switch-rtl.auxo-switch-small.auxo-switch-checked .auxo-switch-handle {
  right: calc(100% - 14px - 3px);
}
/* stylelint-disable no-duplicate-selectors */
/* stylelint-disable */
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
/* ------------- new ------------- */
.auxo-switch {
  box-shadow: none !important;
}
.auxo-switch .auxo-click-animating-node {
  display: none;
}
.auxo-switch .auxo-switch-loading-icon {
  vertical-align: top;
}
.auxo-switch:not(.auxo-switch-checked) {
  background-color: rgba(0, 0, 0, 0.08);
}
.auxo-switch:not(.auxo-switch-checked).auxo-switch-disabled,
.auxo-switch:not(.auxo-switch-checked).auxo-switch-loading {
  opacity: 1;
  background-color: rgba(0, 0, 0, 0.04);
}
.auxo-switch:not(.auxo-switch-checked).auxo-switch-disabled .auxo-switch-inner,
.auxo-switch:not(.auxo-switch-checked).auxo-switch-loading .auxo-switch-inner {
  color: #bcbdc0;
}
.auxo-switch:not(.auxo-switch-checked) .auxo-switch-inner {
  color: #898b8f;
}
.auxo-switch:not(.auxo-switch-checked) .auxo-switch-loading-icon {
  color: rgba(0, 0, 0, 0.25);
}
.auxo-switch:not(.auxo-switch-small) .auxo-switch-inner {
  font-size: 14px;
}
.auxo-switch .auxo-switch-handle::before {
  box-shadow: 0px 2px 8px 0px rgba(37, 41, 49, 0.1);
}
.auxo-switch.auxo-switch-disabled .auxo-switch-handle::before {
  box-shadow: none;
}
.auxo-switch.auxo-switch-small.auxo-switch-checked .auxo-switch-handle {
  left: calc(100% - 14px - 2px);
}
.auxo-switch.auxo-switch-small .auxo-switch-handle {
  top: 2px;
  left: 2px;
}
.auxo-switch-loading,
.auxo-switch-disabled {
  background-color: #1966ff;
}
.auxo-switch-loading .auxo-switch-loading-icon,
.auxo-switch-checked .auxo-switch-loading-icon,
.auxo-switch-disabled .auxo-switch-loading-icon {
  color: #1966ff;
}