html{

}
body{
position: absolute;
width: 100%;
height: 100%;
padding: 0px;
margin: 0px;
/* Combina radial-gradient con background-image */
background: radial-gradient(#21618c, var(--co-sec),black), url(img/trama-fondo.svg?2025b);
background-size: cover, 600px;
background-repeat: no-repeat, repeat;
color: white; /* El último color declarado es el que se aplica */
display: flex;
justify-content: center;
align-items: center;
font-size: 0.7em;
display: flex;
}
body:after{
	content: ""; /* Necesario para que el pseudo-elemento se genere */
    position: absolute; /* Posiciona absolutamente respecto al body */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(img/trama-fondo.svg?2025b); /* Agregar la imagen de fondo */
    background-size: cover, 300px; /* Configura el tamaño de fondo para cada capa */
    background-repeat: repeat; /* Configura la repetición para cada capa */
    background-size: 200px;
    z-index: -1; /* Asegúrate de que esté detrás del contenido */
    opacity: 0.5;
}
.login{
	background: var(--co-sec);
color: var(--bg-sec);
	width: 200px;
display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	border-radius: 2%;
	margin: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	position: relative;
	border: 1px solid rgba(168, 212, 212, 1);
}
.login::before {
  content: "";
  position: absolute;
  top: -0px;
  left: -0px;
  right: -0px;
  bottom: 0px;
  width: ;
  z-index: -1;
  border-radius: inherit;
  box-shadow: 0 0 20px 10px rgba(168, 212, 212, 0.5);
  animation: neonGlow 1.5s ease-in-out infinite; 
}
.login::after {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  width: ;
  z-index: -1;
  border-radius: inherit;
  box-shadow: 0 0 60px 30px rgba(168, 212, 212, 0.3);
  animation: neonGlow 1.5s ease-in-out infinite; 
}
.centro-intro{
	display: flex;
	flex-direction: column;
	justify-content: center;
}