/* Register / Reset Password / Set a New Password panels in the LearnDash login pop-up.
   Inputs, labels and buttons use the pop-up's own styles; this file only switches panels. */

:root {
	--amyra-auth-error: #a3263a;
	--amyra-auth-success: #2f6b45;
}

#ld-login-modal .amyra-auth-panel,
#ld-login-modal .amyra-auth-back,
.amyra-auth-hp {
	display: none;
}

/* A panel replaces the login form on the left ... */
#ld-login-modal.amyra-mode-register .ld-login-modal-login .ld-login-modal-wrapper > :not(.amyra-auth-panel),
#ld-login-modal.amyra-mode-lost-password .ld-login-modal-login .ld-login-modal-wrapper > :not(.amyra-auth-panel),
#ld-login-modal.amyra-mode-reset-password .ld-login-modal-login .ld-login-modal-wrapper > :not(.amyra-auth-panel) {
	display: none;
}
#ld-login-modal.amyra-mode-register #amyra-auth-register,
#ld-login-modal.amyra-mode-lost-password #amyra-auth-lost,
#ld-login-modal.amyra-mode-reset-password #amyra-auth-reset {
	display: block;
}

/* ... and the purple side offers the way back to logging in (plus Register from the reset panels). */
#ld-login-modal[class*="amyra-mode-"] .ld-login-modal-register .ld-login-modal-wrapper > :not(.amyra-auth-back) {
	display: none;
}
#ld-login-modal[class*="amyra-mode-"] .amyra-auth-back {
	display: block;
}
#ld-login-modal.amyra-mode-register .amyra-auth-back-register {
	display: none;
}
#ld-login-modal .amyra-auth-back .ld-button {
	margin: 1em auto 0;
}

#ld-login-modal .amyra-auth-panel .ld-modal-text {
	margin-bottom: 1.5em;
}
#ld-login-modal .amyra-auth-row {
	display: grid;
	gap: 0 12px;
	grid-template-columns: 1fr 1fr;
}
@media (max-width: 480px) {
	#ld-login-modal .amyra-auth-row {
		grid-template-columns: 1fr;
	}
}

/* Register is taller than the login form: let the pop-up scroll on short screens. */
#ld-login-modal[class*="amyra-mode-"] {
	max-height: 100vh;
	overflow-y: auto;
}
#ld-login-modal .amyra-auth-turnstile {
	display: flex;
	justify-content: center;
	margin: 0.5em 0 0;
}
#ld-login-modal .amyra-auth-message {
	font-size: 14px;
	margin: 1em 0 0;
	text-align: center;
}
#ld-login-modal .amyra-auth-message:empty {
	display: none;
}
#ld-login-modal .amyra-auth-message.is-error {
	color: var(--amyra-auth-error);
}
#ld-login-modal .amyra-auth-message.is-success {
	color: var(--amyra-auth-success);
}
#ld-login-modal .amyra-auth-form input[type="submit"]:disabled {
	cursor: wait;
	opacity: 0.6;
}
#ld-login-modal .amyra-auth-panel .ld-forgot-password-link {
	display: block;
	text-align: center;
}