.toggle-switch{
	display:inline-flex;
	align-items:center;
	gap:0.5rem;
	cursor:pointer;
	user-select:none;
	font-size:0.875rem;
	color:#212121;
}

.toggle-switch input{
	position:absolute;
	opacity:0;
	pointer-events:none;
}

.toggle-switch__track{
	position:relative;
	width:31px;
	height:16px;
	background:#CBD5E1;
	border-radius:11px;
	transition:background 150ms ease, box-shadow 150ms ease;
	flex-shrink:0;
	float:right;
}

.toggle-switch:hover .toggle-switch__track{
	box-shadow:0 0 5px rgba(25,118,210,0.4);
}

.toggle-switch__thumb{
	position:absolute;
	top:2px;
	left:2px;
	width:12px;
	height:12px;
	background:#FFFFFF;
	border-radius:50%;
	box-shadow:0 1px 2px rgba(0,0,0,0.25);
	transition:transform 150ms ease;
}

.toggle-switch input:checked + .toggle-switch__track{
	background:#1976D2;
}

.toggle-switch input:checked + .toggle-switch__track .toggle-switch__thumb{
	transform:translateX(14px);
}

@media only screen and (max-width: 768px) {
	.toggle-switch__track{
		width:53px;
		height:27px;
		border-radius:19px;
	}

	.toggle-switch__thumb{
		top:3.5px;
		left:3.5px;
		width:20px;
		height:20px;
	}

	.toggle-switch input:checked + .toggle-switch__track .toggle-switch__thumb{
		transform:translateX(24px);
	}
}
