.toggle-switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 24px;
}

	.toggle-switch input {
		opacity: 0;
		width: 0;
		height: 0;
	}

.slider {
	position: absolute;
	cursor: pointer;
	background-color: #2196f3;
	border-radius: 24px;
	width: 100%;
	height: 100%;
	transition: background-color 0.3s;
}

	.slider::before {
		content: "";
		position: absolute;
		height: 16px;
		width: 16px;
		left: 4px;
		bottom: 4px;
		background-color: white;
		border-radius: 50%;
		transition: transform 0.3s;
	}

input:checked + .slider {
	background-color: #2196f3; /* Blue when checked */
}

	input:checked + .slider::before {
		transform: translateX(16px); /* Move knob to the right */
	}