@layer semi{.semi-switch{box-sizing:border-box;cursor:pointer;background-color:var(--semi-color-fill-0);width:40px;height:24px;transition:background-color .2s var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);border:1px solid #0000;border-radius:12px;display:inline-block;position:relative}.semi-switch:hover{background-color:var(--semi-color-fill-1)}.semi-switch:active{border:1px var(--semi-color-fill-2) solid}.semi-switch:active .semi-switch-knob{width:24px}.semi-switch:has(>input:focus-visible){outline:2px solid var(--semi-color-primary-light-active)}.semi-switch-checked{background-color:var(--semi-color-success)}.semi-switch-checked:hover{background-color:var(--semi-color-success-hover)}.semi-switch-checked .semi-switch-knob{background-color:var(--semi-white);transform:translate(18px)}.semi-switch-checked:active .semi-switch-knob{transform:translate(12px)}.semi-switch-active{background-color:var(--semi-color-success-active)}.semi-switch-disabled{cursor:not-allowed;border:1px var(--semi-color-border) solid;background-color:#0000}.semi-switch-disabled:hover,.semi-switch-disabled:active{background-color:#0000}.semi-switch-disabled:active .semi-switch-knob{width:18px}.semi-switch-disabled .semi-switch-knob{box-shadow:none;cursor:not-allowed;border:1px var(--semi-color-border) solid}.semi-switch-disabled .semi-switch-native-control{pointer-events:none;cursor:not-allowed}.semi-switch-disabled.semi-switch-checked{background-color:var(--semi-color-success-disabled);border-color:#0000}.semi-switch-disabled.semi-switch-checked:active .semi-switch-knob{transform:translate(18px)}.semi-switch-disabled.semi-switch-checked .semi-switch-knob{box-shadow:none;border:none}.semi-switch-disabled.semi-switch-loading:not(.semi-switch-checked):hover{background-color:var(--semi-color-fill-1)}.semi-switch-knob{box-shadow:var(--semi-shadow-knob);box-sizing:border-box;cursor:pointer;background-color:var(--semi-white);border-radius:9px;width:18px;height:18px;transition:transform .2s ease-in-out,width .2s ease-in-out;position:absolute;top:2px;left:0;right:auto;transform:translate(2px)}.semi-switch-native-control{inset-inline-start:0;pointer-events:auto;width:100%;height:100%;cursor:inherit;opacity:0;margin:0;position:absolute;top:0}.semi-switch-native-control[type=checkbox]{width:inherit;height:inherit}.semi-switch-checked-text,.semi-switch-unchecked-text{width:20px;height:100%;font-size:var(--semi-font-size-small);justify-content:center;align-items:center;display:flex;position:absolute}.semi-switch-checked-text{color:var(--semi-color-white)}.semi-switch-unchecked-text{color:var(--semi-color-text-2);inset-inline-end:0}.semi-switch-loading{background-color:var(--semi-color-fill-1);align-items:center;display:inline-flex}.semi-switch-loading-spin .semi-spin-wrapper{color:var(--semi-color-white);align-items:center;display:inline-flex}.semi-switch-loading .semi-switch-loading-spin{transform:translate(2px)}.semi-switch-loading .semi-switch-loading-spin>.semi-spin-wrapper>svg{width:18px;height:18px}.semi-switch-loading.semi-switch-checked{background-color:var(--semi-color-success-hover)}.semi-switch-loading.semi-switch-checked .semi-switch-loading-spin{transform:translate(16px)}.semi-switch-loading.semi-switch-small .semi-switch-loading-spin{transform:translate(2px)}.semi-switch-loading.semi-switch-small .semi-switch-loading-spin>.semi-spin-wrapper>svg{width:10px;height:10px}.semi-switch-loading.semi-switch-small.semi-switch-checked .semi-switch-loading-spin{transform:translate(10px)}.semi-switch-loading.semi-switch-large .semi-switch-loading-spin{transform:translate(2px)}.semi-switch-loading.semi-switch-large .semi-switch-loading-spin>.semi-spin-wrapper>svg{width:28px;height:28px}.semi-switch-loading.semi-switch-large.semi-switch-checked .semi-switch-loading-spin{transform:translate(22px)}.semi-switch-disabled.semi-switch-checked{background-color:var(--semi-color-success-disabled)}.semi-switch-large{border-radius:16px;width:54px;height:32px}.semi-switch-large .semi-switch-knob{border-radius:12px;width:24px;height:24px;top:3px;transform:translate(3px)}.semi-switch-large.semi-switch-checked .semi-switch-knob{transform:translate(26px)}.semi-switch-large.semi-switch-checked:active .semi-switch-knob{transform:translate(16px)}.semi-switch-large:active .semi-switch-knob{width:34px}.semi-switch-large .semi-switch-checked-text,.semi-switch-large .semi-switch-unchecked-text{width:26px;font-size:var(--semi-font-size-regular)}.semi-switch-small{border-radius:8px;width:26px;height:16px}.semi-switch-small .semi-switch-knob{border-radius:6px;width:12px;height:12px;top:1px;transform:translate(1px)}.semi-switch-small.semi-switch-checked .semi-switch-knob{transform:translate(11px)}.semi-switch-small.semi-switch-checked:active .semi-switch-knob{transform:translate(9px)}.semi-switch-small:active .semi-switch-knob{width:14px}.semi-form .semi-switch-native-control{width:100%;height:100%}.semi-switch:dir(rtl){direction:rtl}.semi-switch-checked:dir(rtl) .semi-switch-knob{transform:translate(-18px)}.semi-switch-checked:dir(rtl):active .semi-switch-knob{transform:translate(-12px)}.semi-switch-knob:dir(rtl){left:auto;right:0;transform:translate(-2px)}.semi-switch-loading:dir(rtl) .semi-switch-loading-spin{transform:translate(-2px)}.semi-switch-loading:dir(rtl).semi-switch-checked .semi-switch-loading-spin{transform:translate(-16px)}.semi-switch-loading.semi-switch-small:dir(rtl) .semi-switch-loading-spin{transform:translate(-2px)}.semi-switch-loading.semi-switch-small:dir(rtl).semi-switch-checked .semi-switch-loading-spin{transform:translate(-10px)}.semi-switch-loading.semi-switch-large:dir(rtl) .semi-switch-loading-spin{transform:translate(-2px)}.semi-switch-loading.semi-switch-large:dir(rtl).semi-switch-checked .semi-switch-loading-spin{transform:translate(-22px)}.semi-switch-large:dir(rtl) .semi-switch-knob{transform:translate(-3px)}.semi-switch-large:dir(rtl).semi-switch-checked .semi-switch-knob{transform:translate(-26px)}.semi-switch-large:dir(rtl).semi-switch-checked:active .semi-switch-knob{transform:translate(-16px)}.semi-switch-small:dir(rtl) .semi-switch-knob{transform:translate(-1px)}.semi-switch-small:dir(rtl).semi-switch-checked .semi-switch-knob{transform:translate(-11px)}.semi-switch-small:dir(rtl).semi-switch-checked:active .semi-switch-knob{transform:translate(-9px)}}