/* ==========================================================================
   Project:     Third Wave Digital Knowledgebase
   Date:        01/22/2025 - File created	
   Created by:  Third Wave Digital (www.thirdwavedigital.com)
========================================================================== */

/* ==========================================================================
     AI Chat 
========================================================================== */

/* Cards*/
.chat-suggestions .list-group-item{border-radius: 16px; height: 80px; width: 150px;}
.chat-suggestions .list-group-item a{text-decoration: none; color: #6c757d;}

/* Chat History*/
.chat-history { overflow-y: auto; overflow-x: hidden; max-height: 600px; }

.chat-history .chat-response {display: flex; align-items: flex-start; gap: 8px; max-width: fit-content;}
.chat-history .chat-response p {display: block; padding: 6px 16px; border-radius: 16px; max-width: fit-content;}

.chat-history .user-entry {max-width: 80%; margin-left: auto;}
.chat-history .user-entry p {display: block; background-color: #dcdcdc85; padding: 6px 16px; border-radius: 16px; margin-left: auto; margin-right: 4px; text-align: right; max-width: fit-content;}

.chat-history::-webkit-scrollbar {width: 6px;}
.chat-history::-webkit-scrollbar-track {background-color: transparent;}
.chat-history::-webkit-scrollbar-thumb {background-color: #dcdcdc85; border-radius: 4px; border: 6px solid transparent;}
.chat-history::-webkit-scrollbar-thumb:hover {background-color: #7d868885;}

.chat-history.expanded .user-entry{padding-right: 0.625rem}
/* Chat Input*/
.chat-input-entry .user-input {border: 1px solid #dcdcdc85; border-radius: 16px; resize: none; outline: none;  background-color: #dcdcdc85; color: #000; width: 100%; padding-right: 50px;}
.chat-input-entry .user-input.expanded {height: 180px;}

/* Chat Buttons */
.btn-submit{background: none; position: absolute; bottom: 25px; right: 35px;}

/* Loader */
/* HTML: <div class="loader"></div> */
.loader {
  font-weight: bold;
  font-family: 'Roboto', sans-serif;
  font-size: 1.5rem;

}
.loader:before {
  content: attr(data-text);
}
@keyframes l1 {to{opacity: 0}}



/* ==========================================================================
     Media Queries
========================================================================== */
@media (min-width: 0px) {    
	.loader{margin-left: 14px; padding-top: 14px}

}

@media (min-width: 1200px) {    
}