/**
 * Learn-O Studio — premium branded login.
 *
 * Sostituisce la schermata wp-login.php di serie con l'identita ufficiale
 * (brand guidelines 10/2024): Imperial #5E3B6A, Opera Mauve #BC7BB2,
 * Thistle #D7BED7, testo Raisin Black #212121, sfondo Ghost #F9FBFD.
 * Tipografia: Suranna (serif, titoli) + Montserrat (body).
 *
 * I colori e l'URL del logo arrivano da :root iniettato inline dalla classe
 * Learn_O_Studio_Login, cosi restano sovrascrivibili per-tenant via filtro.
 * Qui i valori sono solo fallback di sicurezza.
 */

:root {
	--lo-primary:       #5E3B6A; /* Imperial      */
	--lo-primary-dark:  #472C51;
	--lo-accent:        #BC7BB2; /* Opera Mauve   */
	--lo-thistle:       #D7BED7; /* Thistle       */
	--lo-ink:           #212121; /* Raisin Black  */
	--lo-ink-soft:      #5b525f;
	--lo-bg:            #F9FBFD; /* Ghost         */
	--lo-bg-2:          #F5F5F5; /* Cultured      */
	--lo-surface:       #FFFFFF;
	--lo-border:        color-mix(in srgb, var(--lo-primary) 16%, #ffffff);
	--lo-radius:        14px;
	--lo-radius-sm:     10px;
	--lo-shadow:        0 20px 48px rgba(94, 59, 106, .14);
	--lo-shadow-sm:     0 2px 8px rgba(94, 59, 106, .08);
	--lo-font-body:     'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--lo-font-head:     'Suranna', Georgia, 'Times New Roman', serif;
}

/* ── Sfondo pagina: Ghost con un alone Thistle/Opera Mauve appena percettibile ── */
body.login {
	background: var(--lo-bg);
	background-image:
		radial-gradient(1100px 620px at 82% -8%, color-mix(in srgb, var(--lo-thistle) 55%, transparent), transparent 60%),
		radial-gradient(900px 560px at -6% 108%, color-mix(in srgb, var(--lo-accent) 22%, transparent), transparent 62%);
	background-attachment: fixed;
	font-family: var(--lo-font-body);
	color: var(--lo-ink);
	-webkit-font-smoothing: antialiased;
}

#login {
	width: 356px;
	padding: 6% 0 40px;
}

/* ── Logo brand al posto di quello WordPress ── */
#login h1 { margin-bottom: 22px; }
#login h1 a {
	background-image: none; /* sovrascritto inline con l'URL reale del logo */
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	width: 100%;
	height: 78px;
	margin: 0 auto;
	text-indent: -9999px;
	overflow: hidden;
}

/* ── Messaggio di benvenuto (login_message) ── */
.lo-login-welcome {
	text-align: center;
	margin: 0 0 20px;
}
.lo-login-welcome .lo-login-title {
	font-family: var(--lo-font-head);
	font-size: 27px;
	line-height: 1.15;
	color: var(--lo-ink);
	margin: 0 0 4px;
	letter-spacing: .1px;
}
.lo-login-welcome .lo-login-sub {
	font-size: 13.5px;
	color: var(--lo-ink-soft);
	margin: 0;
}

/* ── Card del form ── */
#loginform,
#registerform,
#lostpasswordform {
	background: var(--lo-surface);
	border: 1px solid var(--lo-border);
	border-radius: var(--lo-radius);
	box-shadow: var(--lo-shadow);
	padding: 28px 26px 24px;
	margin-top: 0;
}

.login form .forgetmenot { font-weight: 400; }

#loginform label,
#registerform label,
#lostpasswordform label {
	font-family: var(--lo-font-body);
	font-size: 13.5px;
	font-weight: 500;
	color: var(--lo-ink);
	line-height: 1.5;
}

/* ── Input ── */
.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
	font-family: var(--lo-font-body);
	font-size: 15px;
	color: var(--lo-ink);
	background: #fff;
	border: 1.5px solid var(--lo-border);
	border-radius: var(--lo-radius-sm);
	padding: 11px 13px;
	box-shadow: none;
	transition: border-color .16s ease, box-shadow .16s ease;
}
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus {
	border-color: var(--lo-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--lo-primary) 18%, transparent);
	outline: none;
}

/* Icona "mostra password" allineata al nuovo bordo */
.login .button.wp-hide-pw {
	color: var(--lo-ink-soft);
	top: 2px;
}
.login .button.wp-hide-pw:hover { color: var(--lo-primary); }

/* ── Checkbox "ricordami" ── */
.login .forgetmenot label { color: var(--lo-ink-soft); font-size: 13px; }
.login input[type="checkbox"] { border-color: var(--lo-border); border-radius: 4px; }
.login input[type="checkbox"]:checked::before { color: var(--lo-primary); }
.login input[type="checkbox"]:focus {
	border-color: var(--lo-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--lo-primary) 18%, transparent);
}

/* ── Bottone primario ── */
.login .button-primary,
.login #wp-submit {
	font-family: var(--lo-font-body);
	font-weight: 600;
	font-size: 14.5px;
	letter-spacing: .2px;
	width: 100%;
	text-align: center;
	background: var(--lo-primary);
	border: 1px solid var(--lo-primary);
	border-radius: var(--lo-radius-sm);
	color: #fff;
	padding: 10px 16px;
	height: auto;
	line-height: 1.4;
	box-shadow: var(--lo-shadow-sm);
	text-shadow: none;
	transition: background .16s ease, transform .06s ease, box-shadow .16s ease;
}
.login .button-primary:hover,
.login #wp-submit:hover {
	background: var(--lo-primary-dark);
	border-color: var(--lo-primary-dark);
	box-shadow: 0 6px 16px rgba(94, 59, 106, .22);
}
.login .button-primary:focus,
.login #wp-submit:focus {
	background: var(--lo-primary-dark);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--lo-primary) 30%, transparent);
	outline: none;
}
.login .button-primary:active,
.login #wp-submit:active { transform: translateY(1px); }

/* ── Link sotto il form (registrati / password persa / torna al sito) ── */
.login #nav,
.login #backtoblog {
	text-align: center;
	padding: 0;
	margin: 16px auto 0;
}
.login #nav a,
.login #backtoblog a {
	font-family: var(--lo-font-body);
	font-size: 13px;
	color: var(--lo-ink-soft);
	transition: color .15s ease;
}
.login #nav a:hover,
.login #backtoblog a:hover { color: var(--lo-primary); }
.login #backtoblog a::before { color: var(--lo-accent); }

/* ── Messaggi ed errori ── */
.login .message,
.login .success,
.login #login_error {
	font-family: var(--lo-font-body);
	font-size: 13.5px;
	border: 1px solid var(--lo-border);
	border-left: 4px solid var(--lo-primary);
	border-radius: var(--lo-radius-sm);
	box-shadow: var(--lo-shadow-sm);
	background: #fff;
	color: var(--lo-ink);
}
.login #login_error {
	border-left-color: #c0392b;
}

/* ── Riduci il "peso" WordPress residuo ── */
/* "← Torna a <sito>": Learn-O non ha un frontend pubblico, quindi quel link
   porta a una pagina vuota. Resta un vicolo cieco: via. Il selettore di lingua
   di WordPress, invece, appartiene all'installazione e non alla persona che
   accede. */
.login #backtoblog,
.login .language-switcher { display: none; }
.login .privacy-policy-page-link { margin-top: 24px; }
.login .privacy-policy-page-link a { color: var(--lo-ink-soft); font-family: var(--lo-font-body); }
.login .privacy-policy-page-link a:hover { color: var(--lo-primary); }

@media (max-width: 400px) {
	#login { width: 90%; }
}

@media (prefers-reduced-motion: reduce) {
	.login input,
	.login #wp-submit,
	.login .button-primary,
	.login #nav a { transition: none; }
}
