/**
 * Switchery - Custom version with theme tokens
 * iOS 7 style switches for checkboxes
 */

.switchery {
	background-color: var(--frog-bg-neutral, #d9d9de);
	border-radius: 20px;
	cursor: pointer;
	display: inline-block;
	height: 30px;
	position: relative;
	vertical-align: middle;
	width: 50px;
	box-sizing: content-box;
	transition: background-color 0.1s ease-in-out;
}

.switchery > small {
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
	height: 26px;
	position: absolute;
	top: 2px;
	left: 2px;
	transition: left 0.1s ease-in-out;
	width: 26px;
	box-sizing: content-box;
}

.switchery-small {
	border-radius: 16px;
	height: 20px;
	width: 34px;
}

.switchery-small > small {
	height: 16px;
	top: 2px;
	left: 2px;
	width: 16px;
}

.switchery-large {
	border-radius: 40px;
	height: 40px;
	width: 66px;
}

.switchery-large > small {
	height: 36px;
	top: 2px;
	left: 2px;
	width: 36px;
}