@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
.chatbot *{ font-family: "Rubik", sans-serif !important;}
.chatbot .fa{ font-family: "fontawesome" !important;}
.chatbot{position: fixed;z-index: 99999999;right: 5%; bottom: 8%;}
.chatbot .sbmt, .chatbot .more_enquiry{ margin-top: 4px; background-color: #e21d34;border: 0;padding: 4px 15px;color: #fff;border-radius: 4px;}
.chatbot .more_enquiry{ margin-top: 10px; }
.chatbot_button {position: fixed;bottom: 8%;right: 5%;width: 70px;height: 70px;background-color: #0066cc;border-radius: 50%;cursor: pointer; text-align: center;line-height: 78px;}
.chatbot_button .fa {font-size: 30px;color: #fff;}
.summary-container{font-size: 15px; text-align: justify; display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden ;}
.chatbot #divmainenquiry11{margin-top: 20px;}

/*  */
.user_detail{margin-top: 4px;}
.user_name{line-height: 12px;color: #fff;}
.user_email{color: #fff;}
.chatbot_container {    margin-left: auto; animation: fadeup 0.7s alternate; box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .2);width: 360px;height: calc(100% - 60px);border: none;position: relative;border-radius: 18px;overflow: hidden;   display: none;  flex-direction: column;background: white;}
.chat_header {background: #0d2954;padding: 20px 20px 40px 20px;color: white;font-size: 12px;align-items: center;position: relative;clip-path: polygon(0 0, 100% 0, 100% 70%, 0% 100%);border-top-left-radius: 18px;border-top-right-radius: 18px;}
.chat_header .logo_icon {background: white;color: #0d2954;border-radius: 4px;width: 32px;height: 32px;display: flex;justify-content: center;align-items: center;font-weight: bold;font-size: 20px;margin-right: 12px;user-select: none;}
.chat_header h2 {font-size: 18px;font-weight: 700;margin: 0;}
.chatbot_button_close {position: absolute;top: 9px;width: 60px;height: 60px;border-radius: 50%;line-height: 60px;text-align: center;right: 12px;cursor: pointer;font-size: 20px;color: white;background-image: -webkit-linear-gradient(90deg, rgb(226, 29, 52) 0%, rgba(226, 29, 52, 0.9) 100%) !important;z-index: 9999999999999999;}
.chatbot_button_close:hover{
    opacity: 1;
    box-shadow: 0 2px 11.8px .2px rgba(0, 0, 0, .26);
}
@keyframes fadeup {
    0% {transform: translateY(90%);opacity: 0;}
    100% {transform: translateY(0);opacity: 1;}
}
.chatbot_container #chatInput{resize: none; padding: 16px;    height: 65px;}
.chatbot_container #chatInput{    border: none;border-top: 1px solid #e1e1e1;    margin-bottom: 0;
}
.chatbot_container #chatInput:focus-visible{outline: none;box-shadow: none;}
/*  */
.chat_body {padding: 20px;flex-grow: 1;font-family: Arial, sans-serif;font-size: 14px;color: #333;    max-height: 300px; overflow-y: auto;}
.chat_body .ser_cont ul{list-style: none;padding: 0;margin: 0;}
.chat_body .ser_cont .cht_ser{background-color: #f8f8f8;border-radius: 16px 16px 16px 4px;display: inline-block;margin-top: 0px;font-size: 15px;color: #222;padding: 8px 14px;margin: 3px;}
.chat_message {margin-bottom: 15px;font-size: 14px;line-height: 1.4;}
.input_group {display: flex;flex-direction: column;margin-top: 10px;}
.input_group label {font-size: 14px;margin-bottom: 5px;color: #333;}
.input_group input {padding: 10px;border-radius: 6px;border: 1px solid #ccc;font-size: 14px;outline: none;transition: border-color 0.3s ease;}
.input_group input:focus {border-color: #d50032;}
.submit_btn {margin-top: 10px;background: none;border: none;color: #00b894;font-weight: 600;cursor: pointer;align-self: flex-end;font-size: 14px;padding: 0;}
.chat_footer {padding: 10px 20px;border-top: 1px solid #eee;font-size: 12px;color: #aaa;text-align: left;font-family: Arial, sans-serif;}
.typing-indicator {display: inline-block;margin: 10px 0;}
.typing-indicator span {height: 10px;width: 10px;margin: 0 2px;background-color: #ccc;border-radius: 50%;display: inline-block;animation: typing 1.5s infinite;}
.typing-indicator span:nth-child(2) {animation-delay: 0.2s;}
.typing-indicator span:nth-child(3) { animation-delay: 0.4s;}
@keyframes typing {
  0% { transform: scale(1); opacity: 0.3; }
  50% { transform: scale(1.3); opacity: 1; }
  100% { transform: scale(1); opacity: 0.3; }
}
.chatbot_container p{margin-bottom: 0;font-size: 13px;}
.chat_message, .input_group{    background-color: #f8f8f8;border-radius: 16px 16px 16px 4px;display: inline-block;margin-top: 0px;font-size: 15px;color: #222;padding: 8px 14px;}
.chat_message{margin-bottom: 6px;}
.input_group label, .input_group input { display: inline-block; }
.input_group input { margin-left: 10px; }
.chat_body .map-hm-rht{background-color: #f8f8f8;border-radius: 16px 16px 16px 4px;display: inline-block;margin-top: 0px;font-size: 15px;color: #222;padding: 16px 14px;margin: 3px;}
.chat_body .map-hm-rht .form-control {border-radius: 0;margin-bottom: 0;}
.chat_message_value p {background-color: #e21d34 !important;border-radius: 16px 16px 16px 4px;display: inline-block; margin: 15px 0 ;font-size: 15px;color: #fff;padding: 8px 14px; }
.chatbot_container .user_detail .fa{font-size: 25px;margin-right: 4px; }
.cht_inp { flex: 1; }

.chat_message_value { text-align: right; }

/*  */
.sign_off_cht_btn{border: 0;padding: 4px 12px;border-radius: 13%;font-size: 14px;}
/*  */
.cht_confirm_popup {width: 100%;background-color: #fff;border-radius: 8px;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);padding: 20px;text-align: center;font-family: 'Segoe UI', sans-serif;position: absolute;bottom: 0;z-index: 999999;}
.cht_confirm_popup i.fa-power-off {font-size: 24px;color: #fff;background: #0d2954;border-radius: 50%;padding: 10px;margin-bottom: 10px;}
.confirm_popup_head {font-size: 18px;font-weight: 600;margin-bottom: 8px;color: #333;}
.confirm_popup_subhead {font-size: 14px;color: #666;margin-bottom: 20px;}
.btns {display: flex;justify-content: center;gap: 10px;}
.cancel_btn {background-color: #e0e0e0;color: #333;padding: 8px 16px;border-radius: 4px;cursor: pointer;font-weight: 500;transition: background 0.2s ease;}
.cancel_btn:hover {background-color: #d5d5d5;}
.delete {background-color: #0d2954;color: white;padding: 8px 16px;border-radius: 4px;cursor: pointer;font-weight: 500;transition: background 0.2s ease;}
.delete:hover {background-color: #0d2954e0;}
/*  */
  .typing-indicator span {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 2px;
  background: #aaa;
  border-radius: 50%;
  animation: blink 1.4s infinite;
}
.typing-indicator span:nth-child(2) {
  animation-delay: 0.2s;
}
.typing-indicator span:nth-child(3) {
  animation-delay: 0.4s;
}
@keyframes blink {
  0%, 80%, 100% { transform: scale(0); }
  40% { transform: scale(1); }
}

.message_row:nth-child(n+2), .ser_cont { display: none; }
@media screen and (max-width: 768px) {
    #chatbot_wrap{display: none;}
  
}