.toggles-demo{display:flex;flex-direction:column;gap:1rem;padding:1rem;background:#bfb6b6}.switch{position:relative;display:inline-block;width:100px;height:50px;margin:.5rem}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;inset:0;border-radius:34px}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{content:"";height:42px;width:42px;left:4px;bottom:4px;border-radius:50%}.switch input:checked+.slider:before{transform:translateX(50px)}.switch--pink .slider{background-color:#F6C2E0}.switch--pink .slider:before{background-color:#D72B6A}.switch--blue .slider{background-color:#CDE1F9}.switch--blue .slider:before{background-color:#377ED1}