*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: "Public Sans", sans-serif;
}
body,html{
	height: 100%;
	min-width: 1000px;
	position: relative;

}
.fullscream{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.fullscream{
	height: 100%;
}
footer ul{
	display: flex;
	margin: auto;
	width: 75%;
	list-style: none;
	justify-content: space-between;
}
.logina-alert,.login-wrapper{
	width: 338px;
	background: #FFF;
	overflow: hidden;
	border-radius: 22px;
	margin-left: auto;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 5px 0px, rgba(0, 0, 0, 0.12) 0px 0px 10px 0px;
}
.logina-alert{
	padding: 10px 15px;
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 13px;
	color: rgb(28, 46, 81)!important;
	margin-bottom: 16px;
}
.login{
	padding: 20px 20px 0 20px;
}
.logo-wrapper{
	text-align: center;
}
.title{
    color: rgb(40 68 121);
	font-size: 22px;
	margin-bottom: 30px;
}
 .logo-wrapper img{
 	margin-bottom: 15px;
 }
label{
	font-size: 16px;
	color: #8e8e8e;
}
input{
	height: 42px;
	width: 100%;
	border:1px solid rgb(140, 140, 140);
	margin:10px 0 5px 0;
	border-radius: 10px;
	padding: 10px;	
	outline: none;
}
form > button{
	height: 35px;
    background: #fc9900;
	width: 100%;
	color: #FFF;
	border:0;
	border-radius: 26px;
	margin:12px 0;
}
.keyboard{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 13px;
	margin: 5px 0;
	font-size: 13px;
	color: rgb(77, 77, 77);
}
.nopuedo{
	background: rgb(227, 215, 206);
	text-align: center;
	padding: 15px;
	font-size: 13px;
}
.nopuedo > a {
	color: rgb(28, 46, 81);
}
footer{
	height: 48px;
	background: #FFF;
	align-content: center;
}
.wrapperfull{

	margin-right: 5%;
	padding-top: 5%;
}

body{
    position: relative;
  width: 100%;
  height: 100vh;
	background: url(img/BM_Convocados_Home_BI+new_2500x1121px.jpg) top left no-repeat;
	background-size: cover;
  background-position: center 50%;

}
.field{
	position: relative;
}
.shopassword{
	position: absolute;	
	right: 16px;
	cursor: pointer;
	bottom: 14px;
	font-size: 19px;
	color: #fc9900;
}
input:focus{
 	border:2px solid rgb(28, 46, 81);
}
footer ul li{
	color: #1c2e51;
}
.alert-danger {
    background-color: #f8d7da;  /* Fondo color rojo suave */
    color: #721c24;  /* Texto rojo oscuro */
    border: 1px solid #f5c6cb;  /* Borde más claro */
    border-radius: 5px;  /* Bordes redondeados */
    padding: 15px;
    font-weight: 600;  /* Texto en negrita */
    font-size: 16px;
    margin: 10px 0;  /* Margen superior e inferior */
    display: flex;
    align-items: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra sutil para darle profundidad */
    transition: all 0.3s ease;
}

/* Animación suave para la aparición de la alerta */
@keyframes slideIn {
    0% {
        opacity: 0;
        transform: translateX(-20px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.alert-danger {
    animation: slideIn 0.5s ease-out; /* Aparece desde la izquierda */
}

/* Icono de alerta con espaciado */
.alert-danger .alert-icon {
    margin-right: 15px;
    font-size: 20px;  /* Tamaño del icono */
}

/* Botón de cierre personalizado */
.alert-danger .close-btn {
    background: transparent;
    border: none;
    color: #721c24;  /* Rojo oscuro */
    font-size: 20px;
    cursor: pointer;
    transition: color 0.3s ease;
}

.alert-danger .close-btn:hover {
    color: #f5c6cb;  /* Color cuando pasa el mouse */
}
