/*
 * Recuperacion de contrasena (contrasena/recuperar): tarjeta centrada
 * fluida con pasos numerados y formulario. Solo aplica a esa vista.
 */

.RecuperarWrap{
	max-width:560px;
	margin:30px auto;
	padding:0 12px;
	box-sizing:border-box;
}
.RecuperarCard{
	background:#FFFFFF;
	border:1px solid #D8DEE9;
	border-radius:12px;
	box-shadow:0 2px 10px rgba(0,0,0,0.08);
	padding:28px 32px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	box-sizing:border-box;
}
.RecuperarIcono{
	width:56px;
	height:56px;
	margin:0 auto 12px auto;
	border-radius:50%;
	background:#001C4D;
	color:#FFFFFF;
	font-size:26px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.RecuperarCard h1{
	color:#001C4D;
	font-size:20px;
	margin:0 0 14px 0;
}
.RecuperarIntro{
	color:#555555;
	font-size:13px;
	line-height:1.5;
	margin:0 0 18px 0;
}
.RecuperarPasos{
	list-style:none;
	margin:0 0 22px 0;
	padding:0;
	text-align:left;
}
.RecuperarPasos li{
	display:flex;
	align-items:flex-start;
	margin:0 0 12px 0;
	color:#444444;
	font-size:13px;
	line-height:1.45;
}
.RecuperarPasoNum{
	flex:0 0 24px;
	height:24px;
	border-radius:50%;
	background:#A5BDE4;
	color:#003895;
	font-weight:bold;
	font-size:13px;
	line-height:24px;
	text-align:center;
	margin:0 10px 0 0;
}
.RecuperarPasos li > div{
	flex:1;
	padding-top:2px;
}
.RecuperarForm{
	border-top:1px solid #E4E9F2;
	padding-top:18px;
}
.RecuperarNota{
	color:#8A6D00;
	background:#FFF7DC;
	border:1px solid #F0E0A0;
	border-radius:6px;
	font-size:12px;
	padding:8px 10px;
	margin:0 0 14px 0;
}
.RecuperarForm label{
	display:block;
	color:#333333;
	font-size:13px;
	font-weight:bold;
	margin:0 0 6px 0;
	text-align:left;
}
.RecuperarForm input[type='text']{
	width:100%;
	max-width:280px;
	box-sizing:border-box;
	padding:10px 12px;
	font-size:15px;
	border:1px solid #A5BDE4;
	border-radius:6px;
	margin:0 0 14px 0;
	text-align:center;
}
.RecuperarForm input[type='text']:focus{
	outline:none;
	border-color:#2946C4;
	box-shadow:0 0 0 2px rgba(41,70,196,0.15);
}
.RecuperarForm button[type='submit']{
	display:inline-block;
	padding:10px 28px;
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	background:#2946C4;
	border:0;
	border-radius:6px;
	cursor:pointer;
}
.RecuperarForm button[type='submit']:hover{
	background:#1D3591;
}

/* Estados de enviarcontrasena: exito (verde) y error (rojo), con boton
   volver a la pantalla de recuperacion. */
.RecuperarIconoOk{
	background:#2E8B3A;
}
.RecuperarIconoError{
	background:#C0392B;
}
.RecuperarAcciones{
	display:flex;
	gap:10px;
	justify-content:center;
	flex-wrap:wrap;
}
.RecuperarVolver{
	display:inline-block;
	margin:8px 2px 0 2px;
	padding:9px 22px;
	font-size:14px;
	font-weight:bold;
	color:#2946C4;
	background:#FFFFFF;
	border:1px solid #A5BDE4;
	border-radius:6px;
	text-decoration:none;
}
.RecuperarVolver:hover{
	background:#F0F4FA;
	border-color:#2946C4;
}
.RecuperarIntro a{
	color:#2946C4;
}

@media (max-width:640px){
	.RecuperarWrap{
		margin:14px auto;
	}
	.RecuperarCard{
		padding:18px 14px;
	}
	.RecuperarCard h1{
		font-size:17px;
	}
	.RecuperarForm input[type='text'],
	.RecuperarForm button[type='submit']{
		width:100%;
		max-width:none;
	}
	.RecuperarAcciones{
		flex-direction:column;
	}
	.RecuperarAcciones .RecuperarVolver{
		width:100%;
		box-sizing:border-box;
	}
}