Checkboxes facet with checkbox icons styled as toggle

/** Example of converting Checkboxes facet icons to toggles
 ** SVG icons:
 ** https://fontawesome.com/icons/toggle-off?f=classic&s=solid
 ** https://fontawesome.com/icons/toggle-on?f=classic&s=solid
 ** Convert to CSS background images: https://www.svgbackgrounds.com/tools/svg-to-css/
**/

.facetwp-checkbox {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512"><!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M384 128c70.7 0 128 57.3 128 128s-57.3 128-128 128H192c-70.7 0-128-57.3-128-128s57.3-128 128-128H384zM576 256c0-106-86-192-192-192H192C86 64 0 150 0 256S86 448 192 448H384c106 0 192-86 192-192zM192 352a96 96 0 1 0 0-192 96 96 0 1 0 0 192z"/></svg>');
  background-size: 37px 33px;
  padding-left: 41px;
}

.facetwp-checkbox.checked {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512"><!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M192 64C86 64 0 150 0 256S86 448 192 448H384c106 0 192-86 192-192s-86-192-192-192H192zm192 96a96 96 0 1 1 0 192 96 96 0 1 1 0-192z"/></svg>');
  
}

/** to also remove labels **/
.facetwp-checkbox {
  width: 37px;
  height: 33px;
  margin: 0;
  padding: 0;
}

.facetwp-checkbox .facetwp-display-value,
.facetwp-checkbox .facetwp-counter{
  display: none;
}