/*Mensaje Servlet*/
.mensaje-error {
	color: red;
}


.mensaje-flotante {
	position: fixed;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	width: fit-content;
	padding: 10px 18px;
	border-radius: 12px;
	z-index: 9999;
	font-weight: 600;
	font-size: 14px;
	max-width: 90vw;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
	backdrop-filter: blur(6px);
	animation: fadeIn .3s ease, fadeOut .3s ease 4s forwards;
}

.mensaje-flotante.error {
	background: #ffdddd;
	color: #a00000;
	border-left: 5px solid #d60000;
}

.mensaje-flotante.ok {
	background: rgba(220, 255, 220, .96);
	color: #145214;
	border-left: 5px solid #1fa11f;
}

@keyframes fadeIn {from { opacity:0;
	transform: translateY(-10px);
}

to {
	opacity: 1;
	transform: translateY(0);
}

}
@keyframes fadeOut {to { opacity:0;
	transform: translateY(-10px);
}
}

/*Mensaje info para listar mascotas, citas ...*/
.mensaje-info {
	text-align: center;
	padding: 20px;
	color: #666;
	font-style: italic;
}