.toggler{--circle-size:18px;--padding:4px;--checked-color:var(--primary);--initial-color:var(--white);align-items:center;display:flex;gap:12px;justify-content:space-between}.toggler__label{background-color:var(--initial-color);border:1px solid var(--grey);border-radius:calc(var(--circle-size));cursor:pointer;display:block;flex-shrink:0;height:calc(var(--circle-size) + var(--padding)*2);padding:3px;transition:background-color .2s linear,border-color .2s linear;width:calc(var(--circle-size)*2 + var(--padding)*2)}@media (hover:hover){.toggler__label:hover{border-color:var(--checked-color)}.toggler__label:hover .toggler__circle{background-color:var(--checked-color)}}.toggler__label:has(input:checked){background-color:var(--checked-color);border-color:var(--checked-color)}.toggler__label:has(input:checked) .toggler__circle{background-color:#fff}.toggler__label input:checked+.toggler__circle{transform:translate(100%)}.toggler__circle{aspect-ratio:1/1;background-color:#757575;border-radius:50%;box-shadow:0 1px 2px #0000001c;display:block;transition:background-color .2s linear,transform .2s linear;width:var(--circle-size)}