/**
* 2007-2019 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author    PrestaShop SA <contact@prestashop.com>
*  @copyright 2007-2019 PrestaShop SA
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*
* Don't forget to prefix your containers with your own identifier
* to avoid any conflicts with others containers.
*/
.beshopchat_front{
  position: fixed;
  bottom: 0;
  background: transparent;
  right: 62px;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}
.beshopchat_front .beshop_chat_text{
  cursor: pointer;
  /* width: 300px;
  padding: 5px 10px 5px 10px;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px; */
  /* padding: 15px; */
  border-radius: 55px;
  color: #fff;
}
.beshopchat_front .is_online.on .beshop_chat_text{
  background: transparent;
}
.beshopchat_front .is_online.off .beshop_chat_text{
  background: transparent;
}
.beshopchat_front .beshop_chat_off, .beshopchat_front .beshop_chat_on, .beshopchat_front .beshopchat_chatopened,.beshopchat_front .is_online.on.opened .beshopchat_front_form{
  display: none;
}
.beshopchat_front .is_online.on .beshop_chat_on,.beshopchat_front .is_online.off .beshop_chat_off, .beshopchat_front .is_online.opened.on .beshopchat_chatopened{
  display: initial;
}
.beshopchat_completechat{
  height: 225px;
  background: #fff;
  margin-top: 20px;
  border-radius: 5px;
  margin-bottom: 10px;
  overflow: auto;
  border: solid 1px #e2e2e2;
}
#newMessage{
  width: 100%;
}
.beshopchat_ourMessage{
  background: #ededed;
  max-width: 80%;
  border-radius: 5px;
  display: table;
  padding: 7px 12px;
  position: relative;
  margin: 10px 0;
  float: right;
  right: 13px;
  clear: both;

}
.beshopchat_ourMessage:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	bottom: auto;
	border: 7px solid;
	border-color: #ededed transparent transparent #ededed;
  top: 0;
  right: -13px;
}
.beshopchat_input span{
  width: 100%;
  display: inline-block;
}

/* .beshopchat_input input:focus {
  box-shadow: 0 0 5px #558fc4;
  border:1px solid #558fc4;
}

.beshopchat_input textarea:focus {
  box-shadow: 0 0 5px #558fc4;
  border:1px solid #558fc4;
}

.beshop_newmessage_form  input:focus {
  box-shadow: 0 0 5px #558fc4;
  border:1px solid #558fc4;
} */
.beshop_newmessage_form input {
  width: 100%;
  margin: 5px 0 0 0;
  border-radius: 5px;
  border: solid 1px #d1d1d1;
  padding: 10px 7px 40px 7px;
  color: #818181;
}

.beshopchat_input input{
  width: 100%;
  margin: 5px 0;
  border-radius: 5px;
  border: solid 1px #d1d1d1;
  padding: 5px;
  color: #818181;
}
.beshopchat_input textarea{
  margin: 5px 0;
  margin: 5px 0;
  border-radius: 5px;
  border: solid 1px #d1d1d1;
  padding: 5px;
  color: #818181;
}
.beshopchat_frontchat{
  width: 300px;
  /* padding: 5px 13px 5px 13px; */
  display: table-caption;
  border: solid 1px #C0C0C0;
  -webkit-box-shadow: -1px 1px 6px -2px #0000007d;
  -moz-box-shadow: -1px 1px 6px -2px #0000007d;
  box-shadow: -1px 1px 6px -2px #0000007d;
}
.beshopchat_submit {
  margin: 10px 0 5px 0;
  background: rgba(73,155,234,1);
  background: -moz-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(32,124,229,1)));
  background: -webkit-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: -o-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: -ms-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: linear-gradient(to right, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=1 );
  padding: 13px 0;
  border: 0;
  width: 100%;
  cursor: pointer;
  color: white;
  font-weight: bold;
  font-size: 13px;
  line-height: normal;
}
.beshopchat_submit:hover {
  background: rgba(73,155,234,0.8);
  background: -moz-linear-gradient(left, rgba(73,155,234,0.8) 0%, rgba(32,124,229,0.8) 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(73,155,234,0.8)), color-stop(100%, rgba(32,124,229,0.8)));
  background: -webkit-linear-gradient(left, rgba(73,155,234,0.8) 0%, rgba(32,124,229,0.8) 100%);
  background: -o-linear-gradient(left, rgba(73,155,234,0.8) 0%, rgba(32,124,229,0.8) 100%);
  background: -ms-linear-gradient(left, rgba(73,155,234,0.8) 0%, rgba(32,124,229,0.8) 100%);
  background: linear-gradient(to right, rgba(73,155,234,0.8) 0%, rgba(32,124,229,0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=1 );
}

.beshopchat_front .is_not_showed .beshopchat_frontchat{
  display: none;
}
.beshopchat_front textarea{
  overflow: hidden;
  width: 100%;
  height: 70px;
  resize: none;
}
#beshopchat_whatsapp{
  background-color: #25d366;
  width: 100%;
  padding: 5px 0 10px 0;
  display: inline-block;
  color: #fff;
  text-decoration: none;
  text-align: center;
  line-height: normal;
}
#beshopchat_whatsapp:hover{
  background-color: #45ef86;
}

.beshopchat_thankyou{
  padding: 22px 0;
}
.beshopchat_message_date{
  display: block;
  text-align: right;
  font-size: 9px;
}
.beshopchat_boMessage{
  background: rgba(73,155,234,1);
  background: -moz-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(32,124,229,1)));
  background: -webkit-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: -o-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: -ms-linear-gradient(left, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  background: linear-gradient(to right, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=1 );
  max-width: 80%;
  border-radius: 3px;
  display: table;
  padding: 7px 12px;
  position: relative;
  margin: 7px 0;
  clear: both;
  color: #fff;
  left: 14px;
}
.beshopchat_boMessage:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  top: 0;
  left: -13px;
	bottom: auto;
	border: 7px solid;
	border-color: rgba(73,155,234,1) rgba(73,155,234,1) transparent transparent;
}

.g-recaptcha{
  -webkit-transform: scale(0.90);
   -moz-transform: scale(0.90);
    -ms-transform: scale(0.90);
     -o-transform: scale(0.90);
        transform: scale(0.90);
 -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
     -ms-transform-origin: 0 0;
      -o-transform-origin: 0 0;
         transform-origin: 0 0;
}
.beshopchat_input.recaptcha{
  height: 55px;
  margin-bottom: 10px;
}

.beshop_chat_panel{
    height: 50px;
    display: block;
    background-color: transparent;
    border-bottom-color: #0000001a;
}
.beshop_chat_panel .beshop_chat_miwo{
    position: relative;
    width: 100%;
    height: 100%;
}

.beshop_chat_panel  .beshop_chat_info-box {
  /* position: absolute;
  top: 6px;
  left: 69px;
  right: 10px;
  bottom: 5px; */
}
.beshop_chat_panel .beshop_chat_info-box h4 {
    color: #333;
    line-height: 16px;
    margin: 4px 0 0;
    font-size: 15px;
}
.beshop_chat_panel .beshop_chat_info-box p {
    font-size: 12px;
    padding-top: 5px;
}
.beshopchat_front_form {
    margin-top: 10px;
}

.beshop_chat_brand  {
    height: 20px;
    font-size: 80%;
    text-align: center;
    padding-top: 5px;
}
.beshop_chat_brand .brand-logo a {
    text-decoration: none;
    color: #3598dc;
}

.beshop_chat_brand .brand-logo a:hover {
    text-decoration: underline;
    color: #1b7ec2;
}
.beshopchat_message .loading{
  height: 10px;
  width: 10px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0);
  border-top-color: 2px solid #00aff0;
  border-right-color: 2px solid #00aff0;
  -webkit-animation: spiner 4s infinite linear;
  animation: spiner 4s infinite linear;
}
@keyframes spiner {
  0% {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  border-top-color: #00aff0;
  border-right-color: #00aff0;
  }
  50% {
    border-top-color: #000;
    border-right-color: #000;
  }
  100% { -webkit-transform: rotate(720deg);
  transform: rotate(720deg);
  border-top-color: #00aff0;
  border-right-color: #00aff0;
  }
}


.beshop_chat_text {
  position: fixed;
  bottom: 20px;
  right: 20px;
  cursor: pointer;
  width: 40px;
  will-change: width;
  -webkit-transition: width 500ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: width 500ms cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.chat-container {
  position: relative;
  width: 150px;
  height: 40px;
  will-change: transform;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  background: #FFF1EC;
  border-radius: 20px;
}

.circle-icon {
  width: 40px;
  height: 40px;
  background: #F85A2B;
  border-radius: 50%;
  position: absolute;
  right: 0;
  z-index: 2;
  will-change: transform;
  -webkit-transition: -webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.text-container {
  position: absolute;
  right: 0px;
  height: 40px;
  
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  width: 143px;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  padding: 0 16px;
  white-space: nowrap;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.chat-text {
  color: #F85A2B;
  font-size: 14px;
  font-weight: 500;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  gap: 8px;
}

.chat-text i {
  font-size: 12px;
  margin-left: 4px;
}

/* Hover effect */
.beshop_chat_text:hover {
  width: 150px;
}

.beshop_chat_text:hover .circle-icon {
  -webkit-transform: translate3d(-110px, 0, 0);
  transform: translate3d(-110px, 0, 0);
}