[Malleys]

На ПК и андроид работает все норм

Не работает, если нажать на саму галочку!

Структуру изменить не могу

А зачем её менять? Она у вас идеальна!

У вас не правильно работает скрипт: вы пытаетесь менять состояние галочки, а нужно только переключать класс в зависимости от состояния галочки.

<label class="checkbox-inline"><input type="checkbox" class="rsform-checkbox">Дополнительный цокольный ввод</label>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
	
	$("label.checkbox-inline input[type=checkbox]").on("change", function() {
		var checkbox = $(this);
		checkbox
			.closest("label.checkbox-inline")
			.toggleClass("active-checkbox", checkbox.prop("checked"));
	});
	
</script>

<style>
	
	.active-checkbox {
		background: yellowgreen;
	}
	
</style>

Хотя зачем вам подключение скрипта? Вы можете сразу применять стили к флажку, используя состояние :checked

<label class="checkbox-inline"><input type="checkbox" class="rsform-checkbox">Дополнительный цокольный ввод</label>

<style>
	
input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	width: 18px;
	height: 18px;
	border-radius: 4px;
	background: linear-gradient(#474749, #606062);
	box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.15), inset 0 -1px 1px rgba(0, 0, 0, 0.15);
	outline: none;
	vertical-align: -6px;
}

input[type="checkbox"]:checked {
	background: url('data:image/svg+xml,\
		<svg xmlns="http://www.w3.org/2000/svg" \
			width="10px" height="10px" viewBox="0 0 10 10" \
			stroke="%23fff" stroke-width="1.3" stroke-linecap="round" \
			stroke-linejoin="round" fill="none"\
		>\
			<polyline points="2.3 5.1 4.2 7.2 8.0 2.2"></polyline>\
		</svg>')
		no-repeat center center / contain
		deeppink;
}
	
</style>