/*
################################
# Author: JackSparrow          #
# Telegram: @devsparrow        #
# Email: elliotalds@gmail.com  #
################################
*/

body {
	background: #0e1621;
	overflow: hidden;
}

#chat .card {
	background: #0e1621;
	border: 0;
	border-radius: 0;
	height: 100vh;
}

#chat .card-header {
	text-align: center;
	background: #1b2734;
	padding: 15px 20px;
	color: #dee0e1;
	border: 0;
	border-radius: 0;
}

#chat .card-header .refresh {
	text-decoration: none;
	color: #ebeeed;
}

#chat .card-header .refresh::hover {
	text-decoration: none;
	color: #ebeeed;
}

#chat .card-header .title {
	font-size: 16px;
	margin-left: 19px;
	color: #ebeeed;
}

#chat .card-header .typing {
	font-size: 14px;
}

#chat .card-header img {
	width: 40px;
}

#chat .alert-info {
	background: #17212b;
	color: #ebeeed;
	text-align: center;
	border: 0;
	border-radius: 0;
}


#chat .history {
    background: #0e1621;
    padding: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: none;
}

#chat .history::-webkit-scrollbar {
	display: none;
}

#chat .history ul {
	padding: 0;
}

#chat .history ul img {
	width: 250px;
}

#chat .history ul li {
    list-style: none;
    margin-bottom: 30px;
}

#chat .history ul li:last-child {
	margin-bottom: 75px;
}

@media screen and (max-width: 767px) {
	#chat .history ul li:last-child {
		padding-bottom: 65px;
	}
}

#chat .history .message {
    padding: 10px;
    font-size: 15px;
    border-radius: 7px;
    display: inline-block;
    position: relative;
}

#chat .history .message-data {
    margin-bottom: 15px;
}

#chat .history .message-data img {
    border-radius: 40px;
    margin-left: 7px;
    width: 20px;
}

#chat .history .message-time {
    color: #a8aaaf;
    font-size: 11px;
    padding-left: 6px;
}

#chat .history .ai {
    background: #182533;
    color: #ebeeed;
}

#chat .history .my {
    background: #2b5278;
    color: #ebeeed;
    float: right;
}

#chat .form {
	text-align: center;
	background: #1b2734;
	padding: 15px;
	border: 0;
	border-radius: 0;
	position: fixed;
	bottom: 0;
	width: 100%;
}

#chat .form .button {
	background: #5288c1;
	color: #fff;
	border: 0;
}

#chat .form .button-scroll {
	background: #5288c1;
	color: #fff;
	border: 0;
}

input.form-control {
    background-color: #17212b;
    border: 0;
    color: #4f5b67;
    box-shadow: none;
}

input.form-control:active,
input.form-control:hover,
input.form-control:focus {
    background-color: #17212b;
    color: #4f5b67;
    outline: 0;
    outline-offset: 0;
    box-shadow: none;
}