.cb-dash {
  display: inline-flex; align-items: center;
  gap: 10px; cursor: pointer; user-select: none;
}
.cb-dash__input { display: none; }
.cb-dash__box {
  width: 24px; height: 24px; border-radius: 7px;
  border: 2px solid rgba(124,108,255,.4);
  background: rgba(124,108,255,.08);
  display: flex; align-items: center;
  justify-content: center;
  transition: border-color .3s, background .3s;
}
.cb-dash__mark {
  width: 10px; height: 2px;
  background: #7c6cff; border-radius: 2px;
  transition: all .35s cubic-bezier(.23,1,.32,1);
}
.cb-dash__input:checked + .cb-dash__box {
  border-color: #7c6cff;
  background: rgba(124,108,255,.18);
}
.cb-dash__input:checked
  + .cb-dash__box .cb-dash__mark {
  width: 12px; height: 12px;
  background: transparent;
  border-right: 2.5px solid #7c6cff;
  border-bottom: 2.5px solid #7c6cff;
  border-radius: 0;
  transform: rotate(45deg) translate(-2px,-3px);
}