.toggle-switch-container{cursor:pointer;background:0 0;border-radius:20px;justify-content:center;align-items:center;width:auto;min-width:150px;height:32px;padding:4px;transition:border-color .3s;display:flex;position:relative;overflow:hidden}.toggle-switch-container.dark{background:#3a3c4e}.toggle-switch-container.filled{background:#f5f5f7}.toggle-switch-container.filled.dark{background:#3a3c4e}.toggle-switch-container.filled .toggle-ball{background:#231f20}.toggle-switch-container.filled .toggle-ball.dark{background:#fff}.toggle-switch-container.filled .toggle-ball .toggle-ball-icon.dark svg{fill:#231f20}.toggle-switch-container.filled .toggle-ball .toggle-ball-icon svg{fill:#fff}.toggle-switch-container.light{background:#fff}.toggle-switch-container.light .toggle-ball{background:#231f20}.toggle-switch-container.light .toggle-ball .toggle-ball-icon svg path{fill:#fff}.toggle-switch-container.primary .toggle-ball{background:#fe4c4a}.toggle-switch-container.secondary{background-color:#fe4c4a}.toggle-switch-container.secondary .toggle-text{color:#fff}.toggle-switch-container.secondary .toggle-ball{background:red}.toggle-switch-container.active.filled{background:#71cf48}.toggle-switch-container.active.filled .toggle-ball,.toggle-switch-container.active.filled .toggle-ball .toggle-ball.dark{background:#fff}.toggle-switch-container.active.filled .toggle-ball .toggle-ball-icon svg path{fill:#71cf48}.toggle-switch-container.active.filled .toggle-text{color:#fff}.toggle-switch-container.active.primary .toggle-ball{background:#00a464}.toggle-switch-container.active.secondary{background-color:#01c06a}.toggle-switch-container.active.secondary .toggle-ball{background:green}.toggle-switch-container.disabled{cursor:not-allowed}.toggle-text{-webkit-user-select:none;user-select:none;white-space:nowrap;padding-top:1px;padding-left:30px;padding-right:5px;font-size:12px;font-weight:400;transition:padding .3s}.toggle-text.active{padding-left:5px;padding-right:30px}.toggle-text.active p{color:#fff!important}.toggle-ball{border-radius:50%;width:24px;height:24px;transition:left .3s;position:absolute;left:4px}.toggle-ball.padingOnBall{padding:5px}.toggle-ball.active{left:calc(100% - 28px)}.toggle-ball .toggle-ball-icon{border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:hidden}.toggle-ball .toggle-ball-icon>svg{width:20px;height:20px}