/* 2026-07-17 v1.4
 * - Added the phone breakpoint as fallback when a simulator exposes a fine pointer
 * - Required both a fine pointer and a non-touch body class for checkbox hover feedback
 * - Reset unselected checkbox hover feedback on coarse and non-hover pointers
 */

input[type="checkbox"]:after {
 	content: "\f00c";
	font-family: 'FontAwesome';
	max-width: 30px!important;
	
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	line-height: 30px!important;
}
input[type="checkbox"] {
	position: relative;
	text-align: center; 
	border-radius: 5px;
	font-size: 1px;
	line-height: 30px;
	cursor: pointer;
	display: inline-block;
	height: 30px;
	width:30px!important;
	background-color: #fff;
	margin-top: 0px;
	margin-bottom:0px;
	box-shadow:inset 0px 0px 0px 1px #ccc, inset 0px 0px 0px 3px #fbfbfb;
	color:#fff;
	transition: 0.05s ease all;
}
input[type="checkbox"] {
	float: left!important;
	margin-left: 0px!important;
}
input[type="checkbox"] + label {
	float: left!important;
	min-height: 30px;
	line-height: 30px!important;
	margin-left: 5px;
	max-width: calc(100% - 35px);
}
input[type="checkbox"]:active {
	box-shadow:inset 0px 0px 0px 1px var(--colorgreen), inset 0px 0px 0px 3px #fbfbfb, 0px 0px 0px 2px var(--colorgreen);
}
@media (hover: hover) and (pointer: fine) and (min-width: 542px) {
	body:not(.is-touch-device) input[type="checkbox"]:hover {
		box-shadow:inset 0px 0px 0px 1px var(--colorgreen), inset 0px 0px 0px 3px #fbfbfb, 0px 0px 0px 2px var(--colorgreen);
		color:#ccc;
		font-size:14px;
	}
}
body.is-touch-device input[type="checkbox"]:not(:checked):hover {
	box-shadow:inset 0px 0px 0px 1px #ccc, inset 0px 0px 0px 3px #fbfbfb;
	color:#fff;
	font-size:1px;
}
@media (hover: none), (pointer: coarse), (max-width: 541px) {
	input[type="checkbox"]:not(:checked):hover {
		box-shadow:inset 0px 0px 0px 1px #ccc, inset 0px 0px 0px 3px #fbfbfb;
		color:#fff;
		font-size:1px;
	}
}
input[type="checkbox"] + label {
	cursor: pointer;
}
input[type="checkbox"]:checked { 
	box-shadow:inset 0px 0px 0px 1px #ccc, inset 0px 0px 0px 3px #fbfbfb;
	background-color:var(--colorgreen)!important;
	font-size:14px;
	color:#fff!important;
}