* {
    margin: 0;
    padding: 0;
}
body{
	font-family: Helvetica;
	background-color: #f6f5ff;
	max-width:100%;
	overflow-x: hidden;
}

#chat {
	background: linear-gradient(90deg, #e5ffe7, #d3eaff);
	max-width:500px;
    flex-direction: column; /* Para mostrar los mensajes desde el último hacia arriba */
	border: 1px #d9d9d9 solid;
	border-radius: 7px;
	box-shadow: 0px 10px 18px #999999;
	margin:50px auto;
	padding:20px;
}
@media only screen and (max-width: 400px) {
	body{
		font-size: 18px;
		max-width:100%;
		overflow-x: hidden;
	}
	#chat{
		max-width:95vw;
	}
}
.mensaje {
    margin: 10px;
    display: flex;
}

.mensaje-contenedor {
    max-width: 70%; /* Máximo ancho del contenedor del mensaje */
    padding: 10px;
    border-radius: 10px;
    background-color: #f0f0f0;
    box-shadow: 0px 5px 8px rgba(121, 121, 121, 0.48);
}

.mensaje-contenedor p{
	font-weight:400;
}
.justify-content-start{
	justify-content: flex-start;
}

.justify-content-end{
	justify-content: flex-end;
}
.mensaje-usuario1 {
    background-color: #dcf8c6; /* Color de fondo para los mensajes del usuario1 */

}

.mensaje-usuario2{
    background-color: #e5e5ea; /* Color de fondo para los mensajes del usuario2 */
}

.usuario {
    font-weight: bold;
    margin-right: 5px;
}

.fecha {
    font-size: 12px;
    color: #777;
}

.contenido {
    margin