/*----------Theme checkbox---------*/

.new-control {
	position: relative;
	display: -ms-inline-flexbox;
	display: inline-flex;
	padding-left: 1.5rem;
	margin-right: 1rem;
}
.new-control-input {
	position: absolute;
	z-index: -1;
	opacity: 0;
}
.new-control.new-checkbox {
	.new-control-indicator {
		position: absolute;
		top: .25rem;
		left: 0;
		display: block;
		width: 1rem;
		height: 1rem;
		pointer-events: none;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: $color_64;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 50% 50%;
		border-radius: 2px;
	}
	cursor: pointer;
	>input {
		&:checked~span.new-control-indicator {
			background: $color_63;
			&:after {
				display: block;
			}
		}
	}
	span.new-control-indicator {
		&:after {
			border: solid $white;
			top: 50%;
			left: 50%;
			margin-left: -2px;
			margin-top: -6px;
			width: 5px;
			height: 10px;
			border-width: 0 2px 2px 0 !important;
			transform: rotate(45deg);
			content: '';
			position: absolute;
			display: none;
		}
	}
}
/*rounded checkbox*/
.new-checkbox-rounded {
	span.new-control-indicator {
		border-radius: 50% !important;
	}
}
/*classic checkbox*/
.new-checkbox-classic {
	span.new-control-indicator {
		border-radius: 0 !important;
	}
}
/*line through*/
.new-control.new-checkbox.new-checkbox-line-through {
	>input {
		&:checked~span.new-chk-content {
			text-decoration: line-through;
		}
	}
}
/*  line through colors   */
.new-control.new-checkbox.new-checkbox-line-through {
	>input {
		&:checked~span.new-chk-content {
			color: $color_63;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-default {
	>input {
		&:checked~span.new-chk-content {
			color: $color_63;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-primary {
	>input {
		&:checked~span.new-chk-content {
			color: $primary;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-primary {
	>input {
		&:checked~span.new-chk-content {
			color: $primary;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-success {
	>input {
		&:checked~span.new-chk-content {
			color: $success;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-success {
	>input {
		&:checked~span.new-chk-content {
			color: $success;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-info {
	>input {
		&:checked~span.new-chk-content {
			color: $info;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-info {
	>input {
		&:checked~span.new-chk-content {
			color: $info;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-warning {
	>input {
		&:checked~span.new-chk-content {
			color: $warning;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-warning {
	>input {
		&:checked~span.new-chk-content {
			color: $warning;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-danger {
	>input {
		&:checked~span.new-chk-content {
			color: $danger;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-danger {
	>input {
		&:checked~span.new-chk-content {
			color: $danger;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-secondary {
	>input {
		&:checked~span.new-chk-content {
			color: $secondary;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-secondary {
	>input {
		&:checked~span.new-chk-content {
			color: $secondary;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-dark {
	>input {
		&:checked~span.new-chk-content {
			color: $dark;
		}
	}
}
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-dark {
	>input {
		&:checked~span.new-chk-content {
			color: $dark;
		}
	}
}


/*  Color   */

.new-control.new-checkbox.checkbox-primary {
	>input {
		&:checked~span.new-control-indicator {
			background: $primary;
		}
	}
}
.new-control.new-checkbox.checkbox-success {
	>input {
		&:checked~span.new-control-indicator {
			background: $success;
		}
	}
}
.new-control.new-checkbox.checkbox-info {
	>input {
		&:checked~span.new-control-indicator {
			background: $info;
		}
	}
}
.new-control.new-checkbox.checkbox-warning {
	>input {
		&:checked~span.new-control-indicator {
			background: $warning;
		}
	}
}
.new-control.new-checkbox.checkbox-danger {
	>input {
		&:checked~span.new-control-indicator {
			background: $danger;
		}
	}
}
.new-control.new-checkbox.checkbox-secondary {
	>input {
		&:checked~span.new-control-indicator {
			background: $secondary;
		}
	}
}
.new-control.new-checkbox.checkbox-dark {
	>input {
		&:checked~span.new-control-indicator {
			background: $dark;
		}
	}
}


/*   Outline checkbox   */

.new-control.new-checkbox[class*="checkbox-outline-"] {
	>input {
		&:checked~span.new-control-indicator {
			background-color: $color_none;
		}
	}
}
.new-control.new-checkbox.checkbox-outline-default {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $color_63;
			&:after {
				border-color: $color_63;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-primary {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $primary;
			&:after {
				border-color: $primary;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-success {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $success;
			&:after {
				border-color: $success;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-info {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $info;
			&:after {
				border-color: $info;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-warning {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $warning;
			&:after {
				border-color: $warning;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-danger {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $danger;
			&:after {
				border-color: $danger;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-secondary {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $secondary;
			&:after {
				border-color: $secondary;
			}
		}
	}
}
.new-control.new-checkbox.checkbox-outline-dark {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $dark;
			&:after {
				border-color: $dark;
			}
		}
	}
}





/*----------Theme Radio---------*/


/*  Color   */

.new-control.new-radio {
	.new-control-indicator {
		position: absolute;
		top: .25rem;
		left: 0;
		display: block;
		width: 1rem;
		height: 1rem;
		pointer-events: none;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: $color_64;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 50% 50%;
		border-radius: 50%;
	}
	cursor: pointer;
	>input {
		&:checked~span.new-control-indicator {
			background: $color_63;
			&:after {
				display: block;
			}
		}
	}
	span.new-control-indicator {
		&:after {
			border: solid $white;
			top: 50%;
			left: 50%;
			margin-left: -3px;
			margin-top: -3px;
			content: '';
			position: absolute;
			display: none;
			border-radius: 50%;
		}
	}
}
/*square radio*/
.new-control.new-radio.square-radio {
	.new-control-indicator {
		border-radius: 0;
	}
	span.new-control-indicator {
		&:after {
			border-radius: 0;
		}
	}
}
/*line through*/
.new-control.new-radio.new-radio-line-through {
	>input {
		&:checked~span.new-radio-content {
			text-decoration: line-through;
		}
	}
}

/*  Color   */
.new-control.new-radio.radio-primary {
	>input {
		&:checked~span.new-control-indicator {
			background: $primary;
		}
	}
}
.new-control.new-radio.radio-success {
	>input {
		&:checked~span.new-control-indicator {
			background: $success;
		}
	}
}
.new-control.new-radio.radio-info {
	>input {
		&:checked~span.new-control-indicator {
			background: $info;
		}
	}
}
.new-control.new-radio.radio-warning {
	>input {
		&:checked~span.new-control-indicator {
			background: $warning;
		}
	}
}
.new-control.new-radio.radio-danger {
	>input {
		&:checked~span.new-control-indicator {
			background: $danger;
		}
	}
}
.new-control.new-radio.radio-secondary {
	>input {
		&:checked~span.new-control-indicator {
			background: $secondary;
		}
	}
}
.new-control.new-radio.radio-dark {
	>input {
		&:checked~span.new-control-indicator {
			background: $dark;
		}
	}
}
.new-control.new-radio[class*="radio-classic-"] {
	>input {
		&:checked~span.new-control-indicator {
			background-color: $color_none;
		}
	}
}

/*   Outline Radio   */

.new-control.new-radio.radio-classic-default {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $color_63;
			&:after {
				border-color: $color_63;
			}
		}
	}
}
.new-control.new-radio.radio-classic-primary {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $primary;
			&:after {
				border-color: $primary;
			}
		}
	}
}
.new-control.new-radio.radio-classic-success {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $success;
			&:after {
				border-color: $success;
			}
		}
	}
}
.new-control.new-radio.radio-classic-info {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $info;
			&:after {
				border-color: $info;
			}
		}
	}
}
.new-control.new-radio.radio-classic-warning {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $warning;
			&:after {
				border-color: $warning;
			}
		}
	}
}
.new-control.new-radio.radio-classic-danger {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $danger;
			&:after {
				border-color: $danger;
			}
		}
	}
}
.new-control.new-radio.radio-classic-secondary {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $secondary;
			&:after {
				border-color: $secondary;
			}
		}
	}
}
.new-control.new-radio.radio-classic-dark {
	>input {
		&:checked~span.new-control-indicator {
			border: 1px solid $dark;
			&:after {
				border-color: $dark;
			}
		}
	}
}
/*  line through colors   */
.new-control.new-radio.new-radio-line-through {
	>input {
		&:checked~span.new-radio-content {
			color: $color_63;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-default {
	>input {
		&:checked~span.new-radio-content {
			color: $color_63;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-primary {
	>input {
		&:checked~span.new-radio-content {
			color: $primary;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-primary {
	>input {
		&:checked~span.new-radio-content {
			color: $primary;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-success {
	>input {
		&:checked~span.new-radio-content {
			color: $success;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-success {
	>input {
		&:checked~span.new-radio-content {
			color: $success;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-info {
	>input {
		&:checked~span.new-radio-content {
			color: $info;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-info {
	>input {
		&:checked~span.new-radio-content {
			color: $info;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-warning {
	>input {
		&:checked~span.new-radio-content {
			color: $warning;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-warning {
	>input {
		&:checked~span.new-radio-content {
			color: $warning;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-danger {
	>input {
		&:checked~span.new-radio-content {
			color: $danger;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-danger {
	>input {
		&:checked~span.new-radio-content {
			color: $danger;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-secondary {
	>input {
		&:checked~span.new-radio-content {
			color: $secondary;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-secondary {
	>input {
		&:checked~span.new-radio-content {
			color: $secondary;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-dark {
	>input {
		&:checked~span.new-radio-content {
			color: $dark;
		}
	}
}
.new-control.new-radio.new-radio-line-through.radio-classic-dark {
	>input {
		&:checked~span.new-radio-content {
			color: $dark;
		}
	}
}