.typing__dot {
    float: left;
    width: 8px;
    height: 8px;
    margin: 0 4px;
    background: #8d8c91;
    border-radius: 50%;
    opacity: 0;
    animation: loadingFade 1s infinite;
}

.typing__dot:nth-child(1) {
    animation-delay: 0s;
}

.typing__dot:nth-child(2) {
    animation-delay: 0.2s;
}

.typing__dot:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes loadingFade {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 0.8;
    }

    100% {
        opacity: 0;
    }
}
/**/
.chat-outter{display:block;}
.chat-outter.display-block{display:block;}
.chatbot-toggler img{width:100px;display:none;}
.chat_txt{width:80%;}
.chat_butt{width:20%;}
.fl-left{float:left;}
.chat_inner{padding:40px 20px 20px 20px;  float:left;width:100%;display:block;}
.chat_header{  background:#40C1E5;padding:10px;color:#fff;float:left;width:100%;border-radius:10px 10px 0px 0px;}
 .card-body{padding:0px;}
.close-btn img{height:30px;}
.card-title{display:inline;color:#fff;width:80%;float:left;margin-bottom:0px;font-size:22px;} .close-btn-out {text-align:right;display:inline;color:#fff;width:20%;float:left;}

 #cmbSend{background-color:unset;border:0px;}

  
  .card-body .col-md-2{padding-left:0px;}
 /* .close-btn {border:0px;background:none;}
  
  .chatbot-toggler {display:none;
  position: rela;
  bottom:30px;
  right:20px;
  outline: none;
  border: none;
  height:110px;
  width:110px;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff;
  transition: all 0.2s ease;z-index:100000;
}*/
.display-none{display:none;}
.chat-outter {
  position: relative;
 
  
  width:100%;
  background: #fff;
 
  overflow: hidden; 
  transform-origin: bottom right;
 /* box-shadow: 0 0 128px 0 rgba(0, 0, 0, 0.1), 0 32px 64px -48px rgba(0, 0, 0, 0.5);*/
  transition: all 0.1s ease;
 
}
.chat-outter .card-body{padding:0px!important;}
.chat_inner .form-control{font-size: 1.5rem;}
.chat_inner {font-size: 1.5rem;}




/*chat new code*/
/***************************************************
 * Generated by SVG Artista on 6/19/2025, 5:20:21 PM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/

.chat_left svg .svg-elem-1 {
  stroke-dashoffset: 941.3414569080782px;
  stroke-dasharray: 941.3414569080782px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 0.8s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 0.8s;
}

.chat_left  svg.active .svg-elem-1 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

.chat_left  svg .svg-elem-2 {
  stroke-dashoffset: 755.9822368615503px;
  stroke-dasharray: 755.9822368615503px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 0.9s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 0.9s;
}

.chat_left svg.active .svg-elem-2 {
  stroke-dashoffset: 0;
  fill: rgb(228, 251, 255);
}

.chat_left svg .svg-elem-3 {
  stroke-dashoffset: 454.3893421169302px;
  stroke-dasharray: 454.3893421169302px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
}

.chat_left svg.active .svg-elem-3 {
  stroke-dashoffset: 0;
  fill: url("#pattern0_598_4692");
}

.chat_left svg .svg-elem-4 {
  stroke-dashoffset: 610.0953369140625px;
  stroke-dasharray: 610.0953369140625px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.1s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.1s;
}

.chat_left svg.active .svg-elem-4 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

.chat_left svg .svg-elem-5 {
  stroke-dashoffset: 300.5188903808594px;
  stroke-dasharray: 300.5188903808594px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.2000000000000002s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.2000000000000002s;
}

.chat_left svg.active .svg-elem-5 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

.chat_left svg .svg-elem-6 {
  stroke-dashoffset: 300.5191650390625px;
  stroke-dasharray: 300.5191650390625px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.3s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.3s;
}

.chat_left svg.active .svg-elem-6 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

.chat_left svg .svg-elem-7 {
  stroke-dashoffset: 300.5189514160156px;
  stroke-dasharray: 300.5189514160156px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s,
                        fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.4000000000000001s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s,
                fill 0.7s cubic-bezier(0.165, 0.84, 0.44, 1) 1.4000000000000001s;
}

.chat_left svg.active .svg-elem-7 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}
/**/
.chat_main_out{padding-bottom:40px;}
.chat_main{border:1px solid #26B9E2;padding:4px;background:#fff;border-radius:10px; position:relative;}
.chat_left{ border-radius:10px 0px 0px 10px; background:#2598EC url(../images/chat/bg_wave.png);}
.chat_left svg{margin-top:30px;margin-bottom:60px;}

.join_community{border:4px solid #D3F7FF;background:#029AE5;border-radius:100px;padding:10px 20px;color:#fff; font-size:18px;}
.join_community:hover{border:4px solid #D3F7FF;background:#26B9E2;border-radius:100px;padding:10px 20px;  font-size:18px;box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 2px 0px, rgba(255, 255, 255, 0.15) 0px 2px 6px 2px;}
.chat_submit{border:1px solid #26B9E2;background:#F8FEFF;border-radius:10px;min-height: 80px;padding:0px;}
.chat_submit .form-control{border:0px;}
.chat_submit .form-control:focus{border:0px;}
.chat_txt{width:90%;padding:0px;margin-right:5px;}
.chat_butt{width:56px;padding:11px 0px 0px 0px;}
.chat_main textarea.form-control{min-height: 80px;border:0px solid red;border-radius:10px;}
#cmbSend img{height:56px;}	  
.chat_main textarea { border: none!important; overflow: auto; outline: none!important; -webkit-box-shadow: none!important;  -moz-box-shadow: none!important;  box-shadow: none!important;resize: none!important; }
.chat-notes{background:url(../images/chat/note_icon.png) no-repeat; padding-left:50px!important;color:#72777B;margin-top:15px!important;font-size:14px;}
.chat_lisa_meg{background:#26B9E2;color:#fff;border:0px;border-radius:10px 10px 10px 0px;margin-bottom:10px;padding:10px 15px;clear:both;float:left;margin-left:55px;}
.chat_user_meg{background:#248DDD;color:#fff;border:0px;margin-bottom:5px;border-radius:10px 10px 10px 0px; padding:10px 15px;clear:both;float:right;}
.out_chat{clear:both;float:left;}
.out_chat img{width:45px;}
.out_chat img, .out_chat .chat_lisa_meg{float:none;display:inline; }
.out_chat .chat_lisa_meg{float:none;display:inline;margin-left:10px;}
#divchatarea{height:300px; overflow-y:auto; overflow-x: hidden;}
 .resp_open{display:none;}
  .resp_close{display:block;}
.chat-outter .chat_butt{width:10%;}
.chat-outter .col-md-10.chat_txt {
        flex: 0 0 auto;
        width: 88.333333%;
    }

.chat_lisa_megn{    background: #26B9E2;
    color: #fff;
    border: 0px;
    border-radius: 10px 10px 10px 0px;
    margin-bottom: 10px;
    padding: 10px 15px;
    clear: both;
    float: left;
    margin-left: 55px;}


 .chat_lisa_inm{ background: #26B9E2;
    color: #fff;
    border: 0px;
    border-radius: 10px 10px 10px 0px;
    margin-bottom: 10px;
    padding: 10px 15px;
    clear: none;
    float: left;
    margin-left:10px;width:91%;}
 .img_lisha{float:left;width:45px;}
.out_chat2{padding: 10px;
  width: 100%;
  clear: both;
  float: left;}
 
/*media query*/
@media screen and (max-width:1060px) {
	.chat_txt { width: 88%; padding: 0px; margin-right: 5px;}
.chat_left svg{width:100%;}
	
	.chat_lisa_inm{width:90%;}
	
}
@media screen and (max-width: 991px) {
.chat-outter .col-md-10.chat_txt {
  flex: 0 0 auto;
  width: 86.333%;
}
 	.chat_lisa_inm{width:88%;}
}

@media screen and (max-width:860px) {
	
	.join_community{display: block;padding: 10px 10px;}
	.chat_txt {  width: 86%;}
	.chat_lisa_inm{width:86%;}
}

  @media screen and (max-width: 767px) {
.chat-outter{width:100%; right:0px;left:0px;}
.col-md-10.chat_txt{padding-left: 0px;width:90%;}
.chat_butt{text-align: right;
  width: 10%;padding-right:0px;}
   .resp_open{display:block;}
   .resp_close{display:none;}
  .chat_left{width:100%!important;padding-bottom:20px;text-align:left;padding-top: 20px;border-radius: 10px 10px 10px 10px;}
.chat_left.text-center{text-align:left;}
    .chat_left svg {  width: 200px;margin-top: 0px;height: 200px; margin-bottom: 0px; margin-right:20px;  }
	.join_community{display:inline;padding: 10px 10px;}
	.chat_right{width:100%;}
	  .col-md-10.chat_txt {    padding-left: 0px;    width: 87%;  }

.col-8.chat_right{width:100%;}
}
@media screen and (max-width:540px){
	.chat-outter .col-md-10.chat_txt {
  flex: 0 0 auto;
  width: 84.333%;
}
	.chat_lisa_inm{width:83%;}
}
@media screen and (max-width:480px) {
.col-md-10.chat_txt{padding-left: 0px;
    width: 83%;}
.chat_butt{text-align: right;
  width: 10%;padding-right:0px;}
     .chat_left svg {margin-bottom:20px;}
  .join_community{display: block;padding: 10px 10px;}
  .chat_inner {  padding: 20px 10px 10px 10px;}
}

@media screen and (max-width:430px) {
	  .col-md-10.chat_txt { padding-left: 0px;  width: 80%;  }
	  
	  .out_chat .chat_lisa_meg{width:78%;margin-top:10px; clear:none;float:left;}
	 .chat_main #cmbSend img {  height: 44px;}
	 
	 .chat_lisa_inm{width:80%;}
	 .out_chat img, .out_chat .chat_lisa_meg{    float: left;}
}

@media screen and (max-width:360px){.chat_lisa_inm{width:78%;}}
@media screen and (max-width:340px){
	.chat-outter .col-md-10.chat_txt {
  flex: 0 0 auto;
  width: 80.333%;
}
.chat_lisa_inm{width:76%;}
}