.toggle, .toggle:before, .slot__label, .curtain {

    overflow: hidden;
    transition-property: background-color, transform, visibility;
    transition-duration: 0.25s;
    transition-timing-function: ease-in, cubic-bezier(0.6,0.2,0.4,1.5), linear;
  }
  .toggle:before, .slot, .slot__label {
    display: block;
  }
  .toggle:before, .curtain {
    position: absolute;
  }
  .toggle:checked, .curtain {
    background-color: var(--elements-accent);
  }
  .toggle:focus {
    outline: transparent;
  }
  .toggle {
    border-radius: 0.75em;
    border: none;
    cursor: pointer;
    position: relative;
    margin-right: 0.25em;
    width: 3em;
    height: 1.5em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: transparent;
  }
  .toggle:before {
    background: currentColor;
    border-radius: 50%;
    content: "";
    top: 0.2em;
    left: 0.2em;
    width: 1.1em;
    height: 1.1em;
  }
  .toggle:checked:before {
    transform: translateX(1.5em);
  }