.elementor-23 .elementor-element.elementor-element-877b53f{--display:flex;--min-height:10vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-23 .elementor-element.elementor-element-c971ddc{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-23 .elementor-element.elementor-element-984dbb5{--display:flex;--position:fixed;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#162B6F;--border-color:#162B6F;--border-radius:18px 18px 0px 18px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;bottom:73px;--z-index:999;}.elementor-23 .elementor-element.elementor-element-984dbb5:not(.elementor-motion-effects-element-type-background), .elementor-23 .elementor-element.elementor-element-984dbb5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-9748cd8 );}body:not(.rtl) .elementor-23 .elementor-element.elementor-element-984dbb5{right:20px;}body.rtl .elementor-23 .elementor-element.elementor-element-984dbb5{left:20px;}.elementor-23 .elementor-element.elementor-element-4c40a10{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--padding-top:5px;--padding-bottom:4px;--padding-left:10px;--padding-right:14px;}.elementor-23 .elementor-element.elementor-element-4c40a10:not(.elementor-motion-effects-element-type-background), .elementor-23 .elementor-element.elementor-element-4c40a10 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(90deg, #112DD2 0%, #07188D 100%);}.elementor-23 .elementor-element.elementor-element-662a4ae{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 10px;--row-gap:0px;--column-gap:10px;}.elementor-23 .elementor-element.elementor-element-f5e531a{width:var( --container-widget-width, 72px );max-width:72px;--container-widget-width:72px;--container-widget-flex-grow:0;}.elementor-23 .elementor-element.elementor-element-f5e531a img{border-style:solid;border-width:1px 1px 1px 1px;border-color:#162B6F;border-radius:50px 50px 50px 50px;}.elementor-23 .elementor-element.elementor-element-f68e0f7{--display:flex;}.elementor-23 .elementor-element.elementor-element-05fbc87 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:24px;font-weight:600;line-height:32px;color:var( --e-global-color-9748cd8 );}.elementor-23 .elementor-element.elementor-element-ce5f808{font-family:"Poppins", Sans-serif;font-size:14px;line-height:18px;color:var( --e-global-color-9748cd8 );}.elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-element{--align-self:center;}.elementor-23 .elementor-element.elementor-element-de6c2fc .elementor-icon-wrapper{text-align:center;}.elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-9748cd8 );}.elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-view-framed .elementor-icon, .elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-view-default .elementor-icon{color:var( --e-global-color-9748cd8 );border-color:var( --e-global-color-9748cd8 );}.elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-view-framed .elementor-icon, .elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-9748cd8 );}.elementor-23 .elementor-element.elementor-element-de6c2fc .elementor-icon{font-size:24px;}.elementor-23 .elementor-element.elementor-element-de6c2fc .elementor-icon svg{height:24px;}.elementor-23 .elementor-element.elementor-element-90e7c62{--display:flex;border-style:solid;--border-style:solid;border-width:1px 0px 1px 0px;--border-top-width:1px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:#162B6F;--border-color:#162B6F;--border-radius:0px 0px 0px 0px;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-23 .elementor-element.elementor-element-90e7c62:not(.elementor-motion-effects-element-type-background), .elementor-23 .elementor-element.elementor-element-90e7c62 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#EBEDF58C;background-image:url("https://ramzan.developer.tryshort.com/wp-content/uploads/2026/04/chat-area-bg.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-23 .elementor-element.elementor-element-3dbf982{--display:flex;--position:fixed;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;bottom:20px;--z-index:9999;}body:not(.rtl) .elementor-23 .elementor-element.elementor-element-3dbf982{right:15px;}body.rtl .elementor-23 .elementor-element.elementor-element-3dbf982{left:15px;}.elementor-23 .elementor-element.elementor-element-c2423b4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(min-width:768px){.elementor-23 .elementor-element.elementor-element-3dbf982{--width:120px;}}@media(max-width:1024px){.elementor-23 .elementor-element.elementor-element-4c40a10{--justify-content:space-between;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-23 .elementor-element.elementor-element-662a4ae{--gap:0px 10px;--row-gap:0px;--column-gap:10px;}.elementor-23 .elementor-element.elementor-element-f5e531a{--container-widget-width:85px;--container-widget-flex-grow:0;width:var( --container-widget-width, 85px );max-width:85px;}.elementor-23 .elementor-element.elementor-element-05fbc87 .elementor-heading-title{font-size:20px;}.elementor-23 .elementor-element.elementor-element-ce5f808{font-size:14px;}.elementor-23 .elementor-element.elementor-element-de6c2fc{margin:0% -15% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}}@media(max-width:767px){.elementor-23 .elementor-element.elementor-element-984dbb5{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;bottom:70px;}body:not(.rtl) .elementor-23 .elementor-element.elementor-element-984dbb5{right:10px;}body.rtl .elementor-23 .elementor-element.elementor-element-984dbb5{left:10px;}.elementor-23 .elementor-element.elementor-element-4c40a10{--justify-content:space-between;--padding-top:10px;--padding-bottom:8px;--padding-left:10px;--padding-right:0px;}.elementor-23 .elementor-element.elementor-element-662a4ae{--width:87%;--justify-content:flex-start;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 10px;--row-gap:0px;--column-gap:10px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-23 .elementor-element.elementor-element-f5e531a{--container-widget-width:68px;--container-widget-flex-grow:0;width:var( --container-widget-width, 68px );max-width:68px;}.elementor-23 .elementor-element.elementor-element-f68e0f7{--width:62%;}.elementor-23 .elementor-element.elementor-element-05fbc87 .elementor-heading-title{font-size:20px;}.elementor-23 .elementor-element.elementor-element-ce5f808{font-size:14px;}.elementor-23 .elementor-element.elementor-element-de6c2fc{width:auto;max-width:auto;margin:0px -15px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-23 .elementor-element.elementor-element-de6c2fc.elementor-element{--align-self:flex-start;}}@media(max-width:1024px) and (min-width:768px){.elementor-23 .elementor-element.elementor-element-662a4ae{--width:100%;}}



/* Start custom CSS for image, class: .elementor-element-f5e531a */.infinite-scale-1 img {
  animation: infiniteScale 3s ease-in-out infinite;
}

@keyframes infiniteScale {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.08); }
  100% { transform: scale(1); }
}/* End custom CSS */


/* Start custom CSS for text-editor, class: .elementor-element-ce5f808 */.elementor-23 .elementor-element.elementor-element-ce5f808 p{
    margin: 0px;
}/* End custom CSS */



/* Start custom CSS for icon, class: .elementor-element-de6c2fc */.expand .elementor-icon-wrapper:hover{
    cursor: pointer !important;
}

.expand .elementor-icon-wrapper svg:hover{
    fill: #ffffffd4 !important;
}/* End custom CSS */

/* Start custom CSS for container, class: .elementor-element-4c40a10 */.chat-area .chat-header .e-con-inner{
    margin: 0px !important;
}/* End custom CSS */

/* Start custom CSS for container, class: .elementor-element-90e7c62 */.conversation-area{
    height: 73% !important;
    overflow-y: auto;
    flex-grow: 1 !important;
}

/*.conversation-area {*/
/*  display: flex;*/
/*  flex-direction: column;*/
/*  gap: 10px;*/
/*  padding: 10px;*/
/*  max-height: 250px;*/
/*  overflow-y: auto;*/
/*}*/

/* User message */
.msg-user {
  align-self: flex-end;
  background: #2707b5;
  color: #fff;
  padding: 8px 12px;
  border-radius: 12px 12px 0 12px;
  max-width: 75%;
}

/* Bot message */
.msg-bot {
  align-self: flex-start;
  background: #fff;
  color: #000;
  padding: 18px 20px;
  border-radius: 12px 12px 12px 0;
  max-width: 75%;
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

.typing {
    font-style: italic;
    opacity: 0.7;
}

.dots::after {
    content: '';
    animation: dots 1.5s infinite;
}

@keyframes dots {
    0% { content: ''; }
    33% { content: '.'; }
    66% { content: '..'; }
    100% { content: '...'; }
}/* End custom CSS */

/* Start custom CSS for html, class: .elementor-element-578777e */.html-wid{
    position: relative !important;
}

#chat-box{
    margin: 10px !important;
    display: flex !important;
}

.send-btn{
    position: absolute;
    right: 20px;
    bottom: 20px;
    padding: 8px 8px 3px 10px !important;
    border: none !important;
    width: 50px;
    height: 50px;
    font-size: 20px !important;
    border-radius: 50px;
    /*transform: rotate(-21deg);*/
    /*position: absolute !important;*/
    /*right: -390px;*/
    /*top: 0;*/
    /*bottom: -4px !important;*/
    /*left: 0px;*/
    color: white !important;
    /*background-color: #21c063 !important;*/
    background-color: #162b6f !important;
}

.send-btn:hover{
    cursor: pointer !important;
}

.send-btn svg{
    /*transform: rotate(90deg);*/
}

.input-field{
    resize: none !important;
    /*padding-bottom: 0px;*/
    /*padding-right: 50px !important;*/
    height: 100px;
    /*margin-top: 10px;*/
    /*width: 85% !important;*/
    padding-left: 10px !important;
    padding-top: 10px !important;
    border-radius: 8px 8px 8px 8px;
    border: 1px solid #162b6f !important;
    /*border-right: none !important;*/
    flex-grow: 1 !important;
    font-family: poppins !important;
    background: #8080801c;
}

.input-field:focus {
    outline: none !important;
    /*border-radius: 8px 8px 8px 8px;*/
    /*border: 1px solid #162b6f !important;*/
    box-shadow: none !important;
    background: #fff;
}/* End custom CSS */


/* Start custom CSS for image, class: .elementor-element-d113a60 */.infinite-scale {
  animation: infiniteScale 3s ease-in-out infinite;
}

@keyframes infiniteScale {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.08); }
  100% { transform: scale(1); }
}/* End custom CSS */

/* Start custom CSS for container, class: .elementor-element-3dbf982 */.elementor-23 .elementor-element.elementor-element-3dbf982:hover{
    cursor: pointer;    

}

/* Chat container */
.ask-moana-1 {
  position: fixed;
  bottom: 20px;
  right: 20px;
  max-width: 320px;
  z-index: 9999;

  /* Animation setup */
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
  transition: all 0.4s ease;
}

/* Hidden state (slide down + fade out) */
.ask-moana-1.hide-chat {
  transform: translateY(100px);
  opacity: 0;
  pointer-events: none;
}

/* Toggle button (circle icon) */
.chat-toggle {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  background: #162b6f;
  color: #fff;
  border-radius: 50px 0px 50px 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  cursor: pointer;
  z-index: 9999;

  /* Animation */
  transform: scale(1);
  opacity: 1;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}


.chat-toggle svg{
    transform: rotate(180deg);
}

.chat-toggle:hover{
    background-color: #162b6fc7;
}

@media(max-width: 767px){
    .chat-toggle{
        width: 45px !important;
        height: 45px !important;
        font-size: 20px !important;
    }
}

/* Hidden toggle */
.chat-toggle.hide-toggle {
  transform: scale(0);
  opacity: 0;
  pointer-events: none;
}

/* Chat area hidden by default */
.chat-area {
  /*max-height: 0;*/
  /*opacity: 0;*/
  overflow: hidden;
  transition: all 0.4s ease;
}

/* When active → show chat-area */
.chat-area.show-chat {
  /*max-height: 250px; */
  opacity: 1;
}

#chatToggle img {
    filter: brightness(0) invert(1);
}

.chat-area {
  /*width: 500px;*/
  width: 35vw;
  /*height: 450px;*/
  height: 65vh;
  transition: all 0.3s ease; 
}

.chat-area.expanded {
  /*width: 700px;*/
  width: 50vw;
  /*height: 550px;*/
  height: 80vh;
}

@media(max-width:767px){
    .chat-area {
  width: 85vw;
  height: 70vh;
  transition: all 0.3s ease; 
}

 .chat-area.expanded {
  width: 94vw;
  height: 73vh;
}   
}

@media(min-width: 768px) and  (max-width:1024px){
    .chat-area {
  width: 62vw;
  height: 70vh;
  transition: all 0.3s ease; 
}

 .chat-area.expanded {
  width: 94vw;
  height: 73vh;
}   
}/* End custom CSS */