/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Jun 14 2023 | 14:07:23 */
.email-input {
	/*--text: #646b8c;*/
	/*--text-placeholder: #bbc1e1;*/
	--icon: #a6accd;
	--icon-focus: #646b8c;
	--icon-invalid: #f04949;
	--icon-valid: #16bf78;
	/*--background: #fff;*/
	/*--border: #d1d6ee;*/
	/*--border-hover: #a6accd;
	--border-focus: #275efe;
	--shadow-focus: rgba(39, 94, 254, 0.32);*/
	position: relative;
}

.email-input input {
	/*width: 100%;
	-webkit-appearance: none;
	outline: none;
	display: block;
	font-size: 14px;
	font-family: inherit;
	margin: 0;*/
	padding-left: 2.5rem !important;
	/*padding: 8px 16px 8px 8px;
	line-height: 26px;
	border-radius: 6px;
	color: var(--text);
	border: 1px solid var(--bc, var(--border));
	background: var(--background);*/
	transition: border-color 0.3s, box-shadow 0.3s;
}

.email-input input::-moz-placeholder {
	color: var(--text-placeholder);
}

.email-input input:-ms-input-placeholder {
  color: var(--text-placeholder);
}

.email-input input::placeholder {
  color: var(--text-placeholder);
}

.email-input .validation-icon {
	width: 18px;
	height: 18px;
	top: 16px;
	left: 1rem;
	display: block;
	position: absolute;
	fill: none;
	stroke: var(--i, var(--icon));
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.6;
	transition: stroke 0.3s;
}

.email-input .validation-icon path {
	stroke-dasharray: 80;
	stroke-dashoffset: var(--path, 170);
	transition: stroke-dashoffset 0.5s ease var(--path-delay, 0.3s);
}

.email-input .validation-icon polyline {
	stroke-dasharray: 12;
	stroke-dashoffset: var(--tick, 12);
	transition: stroke-dashoffset 0.45s ease var(--tick-delay, 0s);
}

.email-input:hover {
	--bc: var(--border-hover);
}

.email-input:focus-within {
	--bc: var(--border-focus);
	--i: var(--icon-focus);
}

.email-input:focus-within input {
	/*box-shadow: 0 1px 6px -1px var(--shadow-focus);*/
}

.email-input:not(.valid) input:not(:-moz-placeholder-shown) {
	/*border-color: #f00 !important; /* Not Valid Red Border */
}

.email-input:not(.valid) input:not(:-ms-input-placeholder) {
	/*border-color: #f00 !important; /* Not Valid Red Border */
}

.email-input:not(.valid) input:not(:placeholder-shown) {
	/*border-color: #f00 !important; /* Not Valid Red Border */
}

.email-input:not(.valid) input:not(:-moz-placeholder-shown):not(:focus) + svg {
	--i: var(--icon-invalid);
}

.email-input:not(.valid) input:not(:-ms-input-placeholder):not(:focus) + svg {
	--i: var(--icon-invalid);
}

.email-input:not(.valid) input:not(:placeholder-shown) + svg {
	--i: var(--icon-invalid);
}

.email-input:not(.valid) input:not(:placeholder-shown):not(:focus) + svg {
	--i: var(--icon-invalid);
}


/* MHT CUSTOM INPUT BEGIN */
/* Stile quando l'input ha il focus ma non ha alcun valore di input */
.email-input:not(.valid) input:not(:placeholder-shown) + svg {
	--i: var(--icon-invalid);
}
/* MHT CUSTOM INPUT END */

.email-input.valid {
	--i: var(--icon-valid);
	--path: 132;
	--path-delay: 0s;
	--tick: 0;
	--tick-delay: .3s;
}


/*** WARNING TEXT BEGIN ***/
.warning-text {
	color: #d90429;
	font-size: 0.85rem;
	position: absolute;
	left: 10px;
	bottom: -20px;
}
/*** WARNING TEXT END ***/