/* AIUTEC Login - custom login form styles */

.aiutec-login-wrap {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	width: 100%;
	padding: 48px 16px;
	box-sizing: border-box;
}

.aiutec-login-card {
	width: 100%;
	max-width: 460px;
	background: #ffffff;
	border-radius: 20px;
	box-shadow: 0 10px 40px rgba(20, 10, 40, 0.08);
	padding: 40px 44px 32px;
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.aiutec-login-heading {
	text-align: center !important;
	color: #4b2c7f !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	margin: 0 !important;
	margin-bottom: 28px !important;
}

.aiutec-login-error {
	background: #fdecea;
	color: #b3261e;
	border: 1px solid #f5c2c0;
	border-radius: 10px;
	padding: 10px 14px;
	font-size: 14px;
	margin-bottom: 20px;
	text-align: center;
}

.aiutec-login-already {
	text-align: center;
	color: #333;
	font-size: 15px;
	margin-bottom: 20px;
}

.aiutec-field {
	margin-bottom: 20px !important;
}

.aiutec-field label {
	display: block;
	font-size: 14px;
	color: #222;
	margin-bottom: 8px;
}

.aiutec-required {
	color: #fb2c36 !important;
}

.aiutec-field input[type="email"],
.aiutec-field input[type="password"],
.aiutec-field input[type="text"] {
	width: 100% !important;
	box-sizing: border-box !important;
	border: 1px solid #d9d5e3 !important;
	border-radius: 24px !important;
	padding: 8px 12px !important;
	font-size: 14px;
	color: #333;
	background: #fff;
	transition: border-color 0.15s ease;
}

.aiutec-field input:focus {
	outline: none;
	border-color: #4b2c7f;
}

.aiutec-password-wrap {
	position: relative !important;
	display: block;
	width: 100%;
}

.aiutec-password-wrap input {
	padding-right: 44px !important;
}

.aiutec-toggle-password {
	position: absolute !important;
	right: 16px !important;
	top: 50% !important;
	left: auto !important;
	transform: translateY(-50%) !important;
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	color: #8b8695;
	cursor: pointer;
	display: flex;
	align-items: center;
}

.aiutec-toggle-password:hover {
	color: #4b2c7f;
}

.aiutec-login-button {
	display: block !important;
	width: fit-content !important;
	min-width: 200px;
	background: #52398c !important;
	color: #ffffff;
	border: none;
	border-radius: 4px !important;
	padding: 16px 40px;
	font-size: 18px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	margin: 8px auto 0 !important;
	transition: background-color 0.15s ease;
}

.aiutec-login-button:hover {
	background: #42306f !important;
	color: #ffffff;
}

.aiutec-login-forgot {
	text-align: center !important;
	margin: 18px 0 0;
}

.aiutec-login-forgot a {
	color: #2563eb;
	font-size: 14px;
	text-decoration: underline;
}

.aiutec-login-forgot a:hover {
	color: #1d4ed8;
}

.aiutec-login-footer {
	text-align: center !important;
	font-size: 13px;
	color: #555;
	margin-top: 24px;
	margin-bottom: 0;
}

.aiutec-login-footer a {
	color: #4b2c7f !important;
	font-weight: 700 !important;
	text-decoration: none;
}

.aiutec-login-footer a:hover {
	text-decoration: underline;
}

/* Disparador del modal: es un <button>, pero debe leerse como el enlace que
   reemplaza, así que se le quitan los estilos propios de botón. */
.aiutec-forgot-trigger {
	background: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	font: inherit;
	color: #2563eb;
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
}

.aiutec-forgot-trigger:hover {
	color: #1d4ed8;
	background: none !important;
}

/* Modal de restablecer contraseña -------------------------------------------
   Cascarón provisional: el diseño definitivo se hará más adelante. */

.aiutec-modal-overlay {
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 100000;
	padding: 16px;
	/* Opaco a propósito: el diseño no muestra la página por detrás. El
	   !important es necesario porque esta hoja se encola ANTES que la del tema
	   y, a igual especificidad, la del tema ganaría. */
	background: #eaeaea !important;
	box-sizing: border-box;
}

/* El atributo `hidden` equivale a `display:none` en la hoja del navegador, que
   pierde frente al `display:flex` de arriba. Hay que restituirlo a mano. */
.aiutec-modal-overlay[hidden] {
	display: none;
}

.aiutec-modal {
	position: relative;
	width: 100%;
	max-width: 460px;
	max-height: 90vh;
	overflow-y: auto;
	background: #ffffff !important;
	border-radius: 20px;
	box-shadow: 0 10px 40px rgba(20, 10, 40, 0.25);
	padding: 32px 44px;
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.aiutec-modal-close {
	position: absolute;
	top: 12px;
	right: 16px;
	background: none !important;
	border: none !important;
	padding: 4px !important;
	margin: 0 !important;
	font-size: 26px;
	line-height: 1;
	color: #8b8695;
	cursor: pointer;
}

.aiutec-modal-close:hover {
	color: #4b2c7f;
	background: none !important;
}

.aiutec-modal-logo {
	display: block;
	width: auto;
	max-width: 230px;
	height: auto;
	margin: 4px auto 22px;
}

.aiutec-modal-title {
	text-align: center !important;
	color: #4b2c7f !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	margin: 0 0 16px !important;
}

.aiutec-modal-intro {
	font-size: 14px;
	line-height: 1.5;
	color: #555;
	text-align: center;
	margin: 0 0 24px;
}

/* Respuesta del envío (éxito o error). */
.aiutec-modal-message {
	border-radius: 10px;
	padding: 10px 14px;
	font-size: 14px;
	line-height: 1.45;
	text-align: center;
	margin-bottom: 20px;
}

.aiutec-modal-message[hidden] {
	display: none;
}

.aiutec-modal-message.is-success {
	background: #eaf7ee;
	color: #1c6b33;
	border: 1px solid #b7e0c4;
}

.aiutec-modal-message.is-error {
	background: #fdecea;
	color: #b3261e;
	border: 1px solid #f5c2c0;
}

.aiutec-forgot-submit {
	font-size: 16px !important;
	padding: 13px 32px !important;
	border-radius: 6px !important;
	min-width: 250px;
}

.aiutec-forgot-submit[disabled] {
	opacity: 0.65;
	cursor: default;
}

.aiutec-modal-back {
	text-align: center !important;
	margin: 16px 0 0;
}

.aiutec-modal-back a {
	color: #2563eb;
	font-size: 14px;
	text-decoration: underline;
}

.aiutec-modal-back a:hover {
	color: #1d4ed8;
}

/* Variante en <button> del enlace del pie, cuando no hay URL de login. */
.aiutec-modal-inline-link {
	background: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	font: inherit;
	color: #4b2c7f !important;
	font-weight: 700 !important;
	cursor: pointer;
}

.aiutec-modal-inline-link:hover {
	text-decoration: underline;
	background: none !important;
}

/* Evita que el fondo haga scroll mientras el modal está abierto. */
body.aiutec-modal-open {
	overflow: hidden;
}