.chatcontainer {
	width: 300px;
	height: 320px;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
}

.chat-nav-bar {
	width: 100%;
	height: 40px;
	background-color: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.chat-nav-bar a {
	color : white;
	white-space: nowrap;
	margin-left: 10px;
	user-select: none;
}

.chat-close {
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
}

.chat-line {
	position: absolute;
	width: 20px;
	height: 3px;
	background-color: #6B6C7B;
	border-radius: 30px;
}

.chat-line.one {
	transform: rotate(45deg)
}

.chat-line.two {
	transform: rotate(135deg)
}

.chat-messages-area {
	width: 100%;
	height: 210px;
}

.chat-sender-area {
	background-color: #343541;
	width: 100%;
	height: 70px;
	display: flex;
	border-radius: 8px;
}

chat-.message {
	width: 100%;
	height: 40px;
}

.chat-message.one,
.chat-message.three,
.chat-message.five {
	background-color: #2E2F3A;
}

.chat-message.two,
.chat-message.four,
.chat-message.six {
	background-color: #343541;
}

.chat-send-img {
	width: 30px;
}

.chat-send-input {
	outline: none;
	display: flex;
	border: none;
	background: none;
	height: 40px;
	width: 230px;
	border-radius: 7px;
	background: none;
	color: white;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	margin-left: 5px;
}

	.chat-send-input::placeholder {
		color: #828E9E;
	}

.chat-input-place {
	display: flex;
	flex-direction: row;
	margin-top: 15px;
	margin-left: 10px;
	align-items: center;
	background-color: #40414F;
	border-radius: 7px;
	height: 40px;
	width: 280px;
	gap: 5px;
	border: 1px solid #2E2F3A;
}

.chat-send {
	width: 30px;
	height: 30px;
	background-color: none;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.chat-send-icon {
	width: 17px;
}


/* ... existing styles ... */

/* Update chat message area */
.chat-messages-area {
	width: 100%;
	height: 210px;
	overflow-y: auto; /* Enable scrolling for messages */
	padding: 10px;
}

/* Style chat messages */
.chat-message {
	border-radius: 5px;
	padding: 8px;
	margin-bottom: 8px;
	color: white;
	max-width: 70%; /* Limit message width */
	word-wrap: break-word;
}

	.chat-message.user {
		background-color: #3f51b5; /* Color for user messages */
		align-self: flex-end; /* Align user messages to the right */
	}

	.chat-message.bot {
		background-color: #4caf50; /* Color for bot messages */
		align-self: flex-end; /* Align bot messages to the right */
		margin-left: auto; /* Push the message to the right side */
	}

/* Style chat input area */
.chat-sender-area {
	background-color: #343541;
	width: 100%;
	display: flex;
	border-radius: 8px;
	padding: 10px;
	align-items: center;
}

.chat-send-input {
	outline: none;
	border: none;
	background: #2E2F3A;
	height: 40px;
	width: calc(100% - 50px); /* Adjust input width */
	border-radius: 7px;
	color: white;
	padding: 0 10px;
	margin-right: 10px;
}

.chat-send {
	width: 30px;
	height: 30px;
	background-color: #3f51b5; /* Button color */
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border-radius: 50%; /* Make the button round */
	transition: background-color 0.3s ease; /* Add smooth transition */
}

	.chat-send:hover {
		background-color: #303f9f; /* Hover color */
	}

.chat-send-icon {
	width: 17px;
	fill: white; /* Change icon color */
}


.chatcontainer {
	width: 350px; /* Increased width */
	height: 400px; /* Increased height */
	background-color: #343541;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
}

/* ... rest of your existing styles ... */

/* Update chat message area */
.chat-messages-area {
	width: 100%;
	height: 280px; /* Adjusted height */
	overflow-y: auto;
	padding: 10px;
}

/* Style chat messages */
.chat-message {
	border-radius: 5px;
	padding: 8px;
	margin-bottom: 8px;
	color: white;
	max-width: 70%; /* Limit message width */
	word-wrap: break-word;
}

	.chat-message.user {
		background-color: #3f51b5;
		align-self: flex-end;
	}

	.chat-message.bot {
		background-color: #4caf50;
		align-self: flex-end;
		margin-left: auto;
	}

/* Style chat input area */
.chat-sender-area {
	background-color: #343541;
	width: 100%;
	display: flex;
	border-radius: 8px;
	padding: 10px;
	align-items: center;
}

.chat-send-input {
	outline: none;
	border: none;
	background: #2E2F3A;
	height: 40px;
	width: calc(100% - 50px);
	border-radius: 7px;
	color: white;
	padding: 0 10px;
	margin-right: 10px;
}

.chat-send {
	width: 30px;
	height: 30px;
	background-color: #3f51b5;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border-radius: 50%;
	transition: background-color 0.3s ease;
}

	.chat-send:hover {
		background-color: #303f9f;
	}

.chat-send-icon {
	width: 17px;
	fill: white;
}
.fullscreen-iframe {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.fullscreen-iframe-item {
	width: 100%;
	height: 100%;
	border: 0;
}