.switch-label{position:relative;display:flex;align-items:center;justify-content:space-between;padding:1rem;border-radius:.25rem;background-color:#fff}.switch-label span{z-index:1;padding:.5rem;font-size:1rem;line-height:1.5;color:#333}.switch-label span:first-child{border-radius:.5rem 0 0 .5rem}.switch-label span:last-child{border-radius:0 .5rem .5rem 0}.switch-label .switch-slider{position:absolute;top:0;left:0;width:50%;height:100%;background:transparent;border:1px solid #000;border-radius:.5rem;transition:transform .5s ease-in-out}.switch-label input[type=checkbox]:checked+.switch-slider{transform:translateX(100%)}