.my-dx-checkbox-wrapper input[type="checkbox"] {
    opacity: 0;
    position: absolute;
}

.my-dx-checkbox-wrapper .dx-checkbox-icon {
    width: 18px;
    height: 18px;
    border: 1px solid var(--dx-checkbox-border);
    border-radius: 2px;
    display: inline-block;
    position: relative;
    background: white;
}

.my-dx-checkbox-wrapper input:checked + .dx-checkbox-icon::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 10px;
    border: solid var(--dx-checkbox-checkmark-color);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}