/* CSS corpo pagina gestore QRCode */

/* LOGIN */
.log							{ position: relative; width: 100%; height: 100%; }
.log-box						{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
								  display: grid; grid-template-columns: 1fr; grid-gap: 3rem; place-items: center;
								  width: 90%; max-width: 50rem; max-height: 85vh; padding: 4rem 3rem;
								  text-align: center; font-size: 1rem; color: var(--dark); box-sizing: border-box; overflow: hidden; overflow-y: auto; }
.log img						{ width: 70%; height: auto; margin: auto; }
.log form						{ display: grid; grid-template-columns: 1fr; grid-gap: 3rem; width: 100%; }
.log__input						{ position: relative; width: 90%; margin: auto; }
.log__input>div					{ position: absolute; margin-top: 0; width: 5rem; height: 100%; text-align: center; line-height: 5rem; }
.log__input .bx					{ font-size: 2em; color: var(--dark); }
.log__eye						{ display: inline; position: absolute; right: 0; width: 5em; height: 5em; margin-top: 2.5em; margin-left: -5em;
								  line-height: 5em; text-align: center; float: right; cursor: pointer; }
.log .bx-show					{ color: var(--primary) !important; }
/*
.log input						{ width: 100%; text-align: left; font-size: 2em; margin: 1em auto; padding: .5em; padding-left: 2.5em;
								  border: none; border-bottom: .3rem solid var(--log-intv); border-radius: .5rem;
								  background: var(--log-bg); color: var(--log-text); box-sizing: border-box; }
.log input:focus				{ border-bottom-color: var(--log-bg2); }
*/
.log__input input				{ font-size: 1.2rem; color: var(--dark); background: var(--light); outline: none; transition: .3s;
								  height: 100%; width: 100%; padding: 1rem 1rem 1rem 5rem; border: .2rem solid var(--dark-grey); border-radius: .5rem; }
.log input[type=password]		{ padding-right: 2.5em; }
.log .btn						{ width: 90%; margin: auto; }
/*
.log .nota						{ display: inline-block; font-size: 1.2em; color: var(--testo); }
.log__or						{ display: block; font-size: 1rem; color: var(--testo); margin: 2em auto; }
.log__link						{ font-size: 1.5rem; color: var(--link); text-decoration: none; }
.log__back						{ position: absolute; top: 3rem; left: 1rem; font-size: 1.5rem; color: var(--link); text-decoration: none; z-index: 900; }
.log__back--selelr				{ top: 5rem; }
.log__title						{ position: absolute; top: 3rem; right: 1rem; font-size: 1.5rem; text-align: right; z-index: 900; }
.log .messagebox				{ width: 90%; text-align: center; margin: auto; padding: 1em; box-sizing: border-box; color: var(--log-error);
								  border: 1rem solid var(--log-err-bg) !important; border-radius: .5rem; outline: .2rem solid var(--log-error); outline-offset: -.8rem; background: var(--log-err-bg); }
.log .messagebox h4				{ font-size: 1.6em; margin: .5em 0 0 0 !important; }
.log__input input[type='text'] ~ label,
.log__input input[type='email'] ~ label,
.log__input input[type='password'] ~ label,
.log__input input[type='number'] ~ label,
.log__input input[type='tel'] ~ label,
.log__input input[type='date'] ~ label,
.log__input input[type='url'] ~ label,
.log__input textarea ~ label
								{ position: absolute; top: 1em; left: 0; pointer-events: none; font-size: 1.5rem; font-weight: bold; color: var(--log-text); transition: .5s; }
label .fas						{ font-size: 1.5rem !important; }
/* tide ( ~ ) = Alt + 126 */
/*
.log__input input[type='text']:focus ~ label,
.log__input input[type='text']:focus ~ label .fas,
.log__input input[type='email']:focus ~ label,
.log__input input[type='email']:focus ~ label .fas,
.log__input input[type='password']:focus ~ label,
.log__input input[type='number']:focus ~ label,
.log__input input[type='tel']:focus ~ label,
.log__input input[type='date']:focus ~ label,
.log__input input[type='url']:focus ~ label,
.log__input input:not(:placeholder-shown) ~ label,
.log__input input:not(:placeholder-shown) ~ label .fas,
.log__input textarea:focus ~ label,
.log__input textarea:not(:placeholder-shown) ~ label
								{ top: -1rem; left: 0; color: var(--log-bg2); }
*/

/* LOADING */
#load							{ display: none; background: #000; position: fixed; left: 0; top: 0; z-index: 2000; width: 100%; height: 100%; opacity: .8; }
#load_content					{ display: none; width: 90vw; text-align: center; position: absolute; top: 50%; left: 50%;
								  transform: translate(-50%,-50%); z-index: 2500; }
#load_content div				{ height: 5rem; }
#load_content img				{ display: none; height: 5rem; width: 5rem; }
#load_content span				{ display: none; font-size: 1rem; color: (--bianco) !important; }

/* google reCAPTCHA */
.g-recaptcha					{ position: relative; transform: scale(0.7); transform-origin: 0 0; margin-left: 20% }
.g-recaptcha > *				{ float: none; right: 0; margin: auto; }
/* per errori nei campi */
.log .error						{ color: var(--rosso); }