.chatbot-modal .modal-dialog {
	max-width: 600px;
	margin: 30px auto;
}
.chatbot-modal .modal-content {
	border-radius: 15px;
	border: none;
	box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}
.chatbot-modal .modal-header, .chatbot-modal .modal-footer {
	border: none;
	color: white;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
.chatbot-messages {
	max-height: 400px;
	overflow-y: auto;
	padding: 20px;
	padding-bottom: 10px !important;
	background: #f9f9f9;
	border-radius: 15px;
	margin-bottom: 20px;
	box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
}
.message {
	display: flex;
	margin-bottom: 15px;
	transition: opacity 0.3s;
}
.message.user .text {
	background: #007bff;
	color: white;
	align-self: flex-end;
	margin-left: auto;
}
.message.bot .text {
	background: #e9ecef;
	color: black;
	align-self: flex-start;
}
.message .text {
	padding: 10px 20px;
	border-radius: 20px;
	max-width: 70%;
	word-wrap: break-word;
}
.chatbot-input {
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
}
.chatbot-input input {
	width: 80%;
	border-radius: 20px;
	padding: 10px;
	border: 1px solid #ced4da;
	outline: none;
	transition: border-color 0.3s;
}
.chatbot-input input:focus {
	border-color: #007bff;
}
.chatbot-input button {
	border-radius: 20px;
	padding: 10px 20px;
	background: #007bff;
	color: white;
	border: none;
	outline: none;
	cursor: pointer;
	transition: background-color 0.3s;
}
.chatbot-input button:hover {
	background-color: #0056b3;
}



.wait-indicator {
	justify-content: center;
	align-items: center;
	font-size: 1.2rem;
	color: #007bff;
	margin: 10px 0;
	text-align: center;
}

.wait-indicator span {
	display: inline-block;
	animation: pulse 1.5s infinite;
}

/* Añadir animación al texto */
@keyframes pulse {
	0% { opacity: 0.2; }
	20% { opacity: 1; }
	100% { opacity: 0.2; }
}

.typing-indicator .dot {
	background-color: #007bff;
	width: 8px;
	height: 8px;
	margin: 0 2px;
	border-radius: 50%;
	display: inline-block;
	animation: typing 1s infinite;
}

.typing-indicator .dot:nth-child(1) {
	animation-delay: 0s;
}

.typing-indicator .dot:nth-child(2) {
	animation-delay: 0.2s;
}

.typing-indicator .dot:nth-child(3) {
	animation-delay: 0.4s;
}

/* Añadir animación al texto */
@keyframes pulse {
	0% { opacity: 0.5; }
	20% { opacity: 1; }
	100% { opacity: 0.5; }
}

.wait-indicator div {
	display: inline-block;
	animation: pulse 1s infinite;
}

@keyframes typing {
	0%, 60%, 100% { transform: translateY(0); }
	30% { transform: translateY(-5px); }
}