@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Fira+Sans:400,500&display=swap&subset=cyrillic,cyrillic-ext");
.start {
  background: #FAFAFA;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 6px 0px, rgba(0, 0, 0, 0.16) 0px 2px 32px 0px;
  color: #373D48;
  display: flex;
  flex-direction: column;
  flex: 1 1;
  font-family: "Helvetica Neue", "Helvetica", "Calibri", "Arial", sans-serif;
  max-height: 610px;
  overflow: auto;
  pointer-events: all;
  width: 376px; }
  .start::-webkit-scrollbar {
    width: 5px; }
  .start::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1); }
  .start::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.1); }
    .start::-webkit-scrollbar-thumb:hover {
      background: rgba(0, 0, 0, 0.2); }
  .start__close {
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 5px;
    padding: 10px;
    display: none;
    opacity: 0.8; }
    .start__close svg path {
      fill: #fff; }
    .start__close:hover {
      opacity: 1; }
    @media (max-height: 640px), (max-width: 640px) {
      .start__close {
        display: block; } }
  .start__title-block {
    background: #a91917;
    color: #FFFFFF;
    width: 100%;
    min-height: 182px;
    padding: 27px 36px 0; }
    @media (max-width: 640px) {
      .start__title-block {
        padding: 9.375vmin 9.0625vmin 0;
        height: 43.75vmin; } }
  .start__title {
    font-size: 25px;
    display: flex;
    align-items: center; }
    .start__title img {
      height: 22px;
      margin-left: 5px;
      margin-top: -7px; }
    @media (max-width: 640px) {
      .start__title {
        font-size: 5.9375vmin; } }
  .start__hand-icon {
    margin-left: 5px; }
  .start__sub-title {
    font-size: 16px;
    margin-top: 7px;
    line-height: 1.2;
    color: #f1f1f1; }
    @media (max-width: 640px) {
      .start__sub-title {
        font-size: 3.75vmin; } }
  .start__socials {
    margin: 21px 0;
    display: flex;
    align-items: center;
    justify-content: center; }
  .start__social {
    background-position: center;
    background-size: cover;
    border-radius: 100%;
    cursor: pointer;
    height: 45px;
    margin: 0 6px;
    width: 45px; }
    .start__social:hover {
      transform: scale(1.1); }
    .start__social_telegram {
      background-color: #29B6F6;
      background-image: url(../../common/styles/svg/social/telegram.svg); }
    .start__social_facebook {
      background-color: #448AFF;
      background-image: url(../../common/styles/svg/social/facebook.svg); }
    .start__social_viber {
      background-color: #7E57C2;
      background-image: url(../../common/styles/svg/social/viber.svg); }
    .start__social_vkontakte {
      background-color: #1976D2;
      background-image: url(../../common/styles/svg/social/vk.svg); }
    .start__social_whatsapp {
      background-color: #40C351;
      background-image: url(../../common/styles/svg/social/whatsapp.svg); }
    .start__social_odnoklassniki {
      background-color: #2EC33C;
      background-image: url(../../common/styles/svg/social/ok.svg); }
    @media (max-width: 640px) {
      .start__social {
        width: 12.5vmin;
        height: 12.5vmin;
        margin: 0 2.1875vmin; } }
  .start__start-buttons {
    padding: 0 16px;
    margin-bottom: 15px; }
  .start__start-button {
    align-items: center;
    background: #FFFFFF;
    border: none;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    color: #000;
    display: flex;
    font-size: 12px;
    font-weight: 300;
    margin: 1px 0;
    padding: 18px 20px;
    text-align: left;
    width: 100%; }
    .start__start-button:hover {
      background: #fcfcfc; }
    .start__start-button:first-child {
      border-radius: 5px 5px 0 0;
      margin: 0; }
    .start__start-button:last-child {
      border-radius: 0 0 5px 5px;
      margin: 0; }
    @media (max-width: 640px) {
      .start__start-button {
        font-size: 3.125vmin;
        padding: 2.5vmin 3.125vmin; } }
  .start__start-button-title:first-letter {
    text-transform: uppercase; }
  .start__letter-icon {
    margin-left: auto; }
    .start__letter-icon svg {
      height: 18px;
      width: 18px; }
      .start__letter-icon svg path {
        fill: #A91816; }
    @media (max-width: 640px) {
      .start__letter-icon svg {
        height: 3.75vmin;
        width: 3.75vmin; } }
  .start__footer {
    background: #FFFFFF;
    box-shadow: 0 -1px 2px #f1f1f1;
    color: #777678 !important;
    display: block;
    font: 300 12px "Helvetica Neue", "Helvetica", "Calibri", "Arial", sans-serif;
    margin-top: auto;
    padding: 14px 0;
    text-align: center;
    width: 100%; }
  @media (max-height: 640px), (max-width: 640px) {
    .start {
      border-radius: 0;
      bottom: 0;
      height: 100vh;
      max-height: 100vh;
      overflow: auto;
      right: 0; } }
  @media (max-width: 640px) {
    .start {
      width: 100vw;
      min-width: 320px; } }

.start-chat-tile {
  background: #FFFFFF;
  padding: 19px 20px;
  border-radius: 3px;
  color: #000;
  margin: -36px 16px 0; }
  .start-chat-tile__title {
    font-size: 14px; }
    @media (max-width: 640px) {
      .start-chat-tile__title {
        font-size: 3.75vmin; } }
  .start-chat-tile__sub-title {
    font-size: 12px;
    color: #777678; }
    @media (max-width: 640px) {
      .start-chat-tile__sub-title {
        font-size: 2.8125vmin; } }
  .start-chat-tile__avatars {
    margin: 7px 0 11px;
    display: flex; }
  .start-chat-tile__avatar {
    background-color: #a91917;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    height: 42px;
    margin-left: -12px;
    width: 42px; }
    .start-chat-tile__avatar:first-child {
      margin-left: 0; }
    .start-chat-tile__avatar-cover {
      background-size: cover; }
    .start-chat-tile__avatar-right {
      margin-left: auto;
      background-color: #ccc;
      background-image: url(../../common/styles/svg/operators/operator-bot.svg); }
    .start-chat-tile__avatar.operator-0 {
      background-color: #BB6BD9;
      background-image: url(../../common/styles/svg/operators/operator-1.svg); }
    .start-chat-tile__avatar.operator-1 {
      background-color: #56CCF2;
      background-image: url(../../common/styles/svg/operators/operator-2.svg); }
    .start-chat-tile__avatar.operator-2 {
      background-color: #6FCF97;
      background-image: url(../../common/styles/svg/operators/operator-3.svg); }
    .start-chat-tile__avatar.operator-3 {
      background-color: #EB5757;
      background-image: url(../../common/styles/svg/operators/operator-4.svg); }
    .start-chat-tile__avatar.operator-4 {
      background-color: #F2C94C;
      background-image: url(../../common/styles/svg/operators/operator-5.svg); }
    .start-chat-tile__avatar.operator-5 {
      background-color: #2F80ED;
      background-image: url(../../common/styles/svg/operators/operator-6.svg); }
    @media (max-width: 640px) {
      .start-chat-tile__avatar {
        width: 9.375vmin;
        height: 9.375vmin; } }
  .start-chat-tile__start-button {
    align-items: center;
    background: #a91917;
    border-radius: 5px;
    border: none;
    color: #FFFFFF;
    display: flex;
    font: 600 12px "Helvetica Neue", "Helvetica", "Calibri", "Arial", sans-serif;
    justify-content: center;
    padding: 13px 0;
    width: 100%; }
    .start-chat-tile__start-button:hover {
      background: #ba3637; }
    .start-chat-tile__start-button svg {
      margin-right: 10px; }
    @media (max-width: 640px) {
      .start-chat-tile__start-button {
        padding: 2.5vmin 0;
        font-size: 3.125vmin; }
        .start-chat-tile__start-button svg {
          height: 4.6875vmin;
          width: 4.6875vmin; } }
  .start-chat-tile__letter-icon {
    margin-right: 10px; }

#chat-widget {
  box-sizing: border-box;
  pointer-events: none;
  position: fixed;
  right: 0;
  bottom: 0;
  max-height: 100%;
  height: 100%;
  z-index: 1000;
  display: flex;
  font-family: 'Fira Sans', sans-serif;
  -webkit-font-smoothing: antialiased; }
  #chat-widget * {
    box-sizing: border-box; }
  #chat-widget button {
    cursor: pointer; }
  #chat-widget a {
    color: #4777f4; }
  #chat-widget span {
    pointer-events: all !important; }
  #chat-widget .open-chat-widget-button-container {
    position: fixed;
    bottom: 50px;
    right: 50px;
    display: flex;
    flex-flow: column;
    align-items: flex-end; }
    #chat-widget .open-chat-widget-button-container .cta-text-bubble {
      position: relative;
      min-width: 50px;
      text-align: right;
      padding: 5px 10px;
      margin-right: -5px;
      background: #6177ff;
      border-radius: 10px;
      color: white; }
      #chat-widget .open-chat-widget-button-container .cta-text-bubble:after {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 8px 9px 0;
        border-color: #6177ff transparent;
        display: block;
        width: 0;
        z-index: 1;
        bottom: -8px;
        right: 35px; }
    #chat-widget .open-chat-widget-button-container .open-chat-widget-button {
      position: relative;
      margin-top: 12px;
      pointer-events: all;
      width: 58px;
      height: 58px;
      border: none;
      border-radius: 58px;
      background-color: #94a3ff;
      background-image: url("../svg/messenger-ico.svg");
      background-position: center;
      background-repeat: no-repeat;
      transition: background-color .1s;
      outline: none; }
      #chat-widget .open-chat-widget-button-container .open-chat-widget-button svg {
        display: none; }
      #chat-widget .open-chat-widget-button-container .open-chat-widget-button:hover {
        background-color: #6177ff; }
      #chat-widget .open-chat-widget-button-container .open-chat-widget-button.has-messages:after {
        width: 16px;
        height: 16px;
        border-radius: 16px;
        background-color: #EB5757;
        position: absolute;
        top: 2px;
        right: 2px;
        content: ' '; }
  #chat-widget .chat-container {
    pointer-events: all;
    position: relative;
    display: flex;
    flex-flow: column;
    width: 100vw;
    min-width: 340px;
    max-width: 496px;
    box-shadow: 0 4px 16px rgba(32, 28, 77, 0.16); }
    #chat-widget .chat-container .header {
      height: 88px;
      padding: 32px 35px 32px 26px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color: #6177ff;
      color: white;
      font-weight: 500;
      font-size: 16px;
      line-height: 24px;
      border-top-left-radius: 10px; }
      #chat-widget .chat-container .header .header__pull-left,
      #chat-widget .chat-container .header .header__pull-right {
        display: inline-flex;
        align-items: center; }
      #chat-widget .chat-container .header #chat-icon {
        margin-right: 22px;
        width: 24px;
        height: 24px;
        background-image: url("../svg/chat-ico.svg");
        background-repeat: no-repeat;
        background-position: center; }
        #chat-widget .chat-container .header #chat-icon svg {
          display: none; }
      #chat-widget .chat-container .header .search-button {
        background-color: transparent;
        border: none;
        outline: none;
        background-image: url("../svg/search-glass.svg");
        background-repeat: no-repeat;
        background-position: center;
        width: 17px;
        height: 17px; }
        #chat-widget .chat-container .header .search-button:hover {
          transform: scale(1.1); }
        #chat-widget .chat-container .header .search-button svg {
          display: none; }
      #chat-widget .chat-container .header .close-chat-button {
        background-color: transparent;
        border: none;
        outline: none;
        background-image: url("../svg/close-chat-ico.svg");
        background-repeat: no-repeat;
        background-position: center;
        width: 15px;
        height: 15px;
        margin-left: 22px; }
        #chat-widget .chat-container .header .close-chat-button:hover {
          transform: scale(1.1); }
        #chat-widget .chat-container .header .close-chat-button svg {
          display: none; }
      @media (max-height: 640px) {
        #chat-widget .chat-container .header {
          border-radius: 0; } }
    #chat-widget .chat-container .web-form-frame {
      height: 100vh;
      width: 100%;
      background: white; }
    #chat-widget .chat-container .message-history {
      flex: 1;
      min-height: 104px;
      overflow-y: scroll;
      overflow-x: hidden;
      background-color: #fff; }
      #chat-widget .chat-container .message-history::-webkit-scrollbar {
        width: 8px; }
      #chat-widget .chat-container .message-history::-webkit-scrollbar-track {
        background: #F7F7FB;
        border-radius: 8px;
        margin: 16px; }
      #chat-widget .chat-container .message-history::-webkit-scrollbar-thumb {
        background: #E3E1F3;
        border-radius: 8px;
        cursor: pointer; }
      #chat-widget .chat-container .message-history::-webkit-scrollbar-thumb:hover {
        background: #dad8eb; }
      #chat-widget .chat-container .message-history .entry-message {
        width: 100%;
        padding: 81px 104px 30px 105px;
        color: #7773A6;
        font-style: normal;
        font-weight: 300;
        font-size: 16px;
        line-height: 24px;
        text-align: center; }
      #chat-widget .chat-container .message-history .error-message {
        width: 100%;
        padding: 81px 104px 30px 105px;
        color: #ff4e46;
        font-style: normal;
        font-weight: 300;
        font-size: 16px;
        line-height: 24px;
        text-align: center; }
      #chat-widget .chat-container .message-history .divider-message {
        width: 100%;
        padding: 81px 112px 23.62px 97px;
        color: #7773A6;
        font-style: normal;
        font-weight: 300;
        font-size: 16px;
        line-height: 24px;
        text-align: center; }
      #chat-widget .chat-container .message-history .message {
        position: relative;
        margin-left: 33px;
        margin-bottom: 30px;
        padding: 10px 24px;
        box-shadow: 0 4px 16px rgba(32, 28, 77, 0.16);
        border: none; }
        #chat-widget .chat-container .message-history .message .message__avatar {
          display: none; }
        #chat-widget .chat-container .message-history .message .message__data {
          position: relative; }
          #chat-widget .chat-container .message-history .message .message__data .message__header {
            width: 100%;
            display: inline-flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 16px; }
            #chat-widget .chat-container .message-history .message .message__data .message__header .message__author-name {
              display: inline-flex;
              align-items: center;
              font-style: normal;
              font-weight: 500;
              font-size: 15px;
              line-height: 16px;
              color: #656289; }
              #chat-widget .chat-container .message-history .message .message__data .message__header .message__author-name .operator-ico {
                margin-right: 9.5px;
                width: 21px;
                height: 18px;
                background-image: url("../svg/operator-ico.svg");
                background-repeat: no-repeat;
                background-position: center; }
                #chat-widget .chat-container .message-history .message .message__data .message__header .message__author-name .operator-ico svg {
                  display: none; }
                #chat-widget .chat-container .message-history .message .message__data .message__header .message__author-name .operator-ico.bot {
                  margin-right: 7px;
                  width: 24px;
                  height: 24px;
                  background-image: url("../svg/chat-bot-ico.svg"); }
                  #chat-widget .chat-container .message-history .message .message__data .message__header .message__author-name .operator-ico.bot svg {
                    display: none; }
            #chat-widget .chat-container .message-history .message .message__data .message__header .message__translate-button {
              font-style: normal;
              font-weight: 500;
              font-size: 10px;
              letter-spacing: 2px;
              text-transform: uppercase;
              color: #8e8bac;
              cursor: pointer; }
              #chat-widget .chat-container .message-history .message .message__data .message__header .message__translate-button:hover {
                color: #656289; }
          #chat-widget .chat-container .message-history .message .message__data .message__body {
            font-style: normal;
            font-weight: normal;
            font-size: 15px;
            line-height: 20px;
            color: #15122F;
            white-space: pre-wrap; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .button-message .button-message__title,
            #chat-widget .chat-container .message-history .message .message__data .message__body .button-message .button-message__text {
              display: inline-block;
              width: 100%; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .button-message .button-message__title {
              font-weight: 500;
              font-size: 17px;
              margin-bottom: 5px; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .button-group {
              border-top: 1px solid #e4e3f1;
              margin-top: 10px; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .button-group .button {
                display: block;
                margin-top: 15px;
                padding: 0;
                font-family: 'Fira Sans', sans-serif;
                font-style: normal;
                font-weight: 500;
                font-size: 12px;
                line-height: 14px;
                letter-spacing: 2px;
                text-transform: uppercase;
                text-align: left;
                background: transparent;
                color: #3F75FF;
                cursor: pointer;
                transition: all .1s; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .button-group .button:hover {
                  filter: brightness(1.1);
                  text-decoration: underline; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .button-group .button:active {
                  filter: brightness(0.9); }
                #chat-widget .chat-container .message-history .message .message__data .message__body .button-group .button.inline {
                  display: inline-block; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .text-message {
              text-overflow: ellipsis;
              overflow: hidden; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .image-message {
              height: 200px;
              width: 200px;
              border-radius: 5px;
              background-size: cover;
              background-position: center center; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .image-message:hover {
                cursor: pointer;
                opacity: 0.9; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .document-message {
              display: inline-flex;
              align-items: center;
              justify-content: space-between;
              padding: 16px 24px;
              height: 56px;
              width: 100%;
              color: #3F75FF;
              background-color: #E3E1F3;
              border-radius: 8px;
              box-shadow: 0px 4px 16px rgba(32, 28, 77, 0.16); }
              #chat-widget .chat-container .message-history .message .message__data .message__body .document-message .file-type-ico {
                flex: 1;
                height: 24px;
                max-width: 24px;
                background-size: cover;
                background: url("../svg/file-ico.svg") no-repeat center center; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .document-message .file-type-ico svg {
                  display: none; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .document-message .file-title-wrap {
                flex: 3;
                margin-left: 16px; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .document-message .file-title-wrap .file-title {
                  display: block;
                  font-style: normal;
                  font-weight: normal;
                  font-size: 12px;
                  height: 16px;
                  max-width: 180px;
                  overflow: hidden;
                  text-overflow: ellipsis; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .document-message .file-download {
                flex: 1;
                height: 24px;
                max-width: 24px;
                background-size: cover;
                background: url("../svg/file-download.svg") center center no-repeat; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .document-message .file-download svg {
                  display: none; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper {
              display: inline-flex;
              width: 100%;
              padding-bottom: 5px;
              overflow-x: scroll; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper::-webkit-scrollbar {
                height: 8px; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper::-webkit-scrollbar-track {
                background: #F7F7FB;
                border-radius: 8px;
                margin: 8px; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper::-webkit-scrollbar-thumb {
                background: #E3E1F3;
                border-radius: 8px;
                cursor: pointer; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper::-webkit-scrollbar-thumb:hover {
                background: #dad8eb; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper {
                border: 1px solid #cccccc;
                margin-right: 10px;
                border-radius: 5px;
                min-width: 140px;
                display: flex;
                flex-direction: column; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper .carousel__image {
                  height: 100px;
                  border-radius: 5px 5px 0 0; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper .carousel__text {
                  font-size: 13px;
                  padding: 3px 4px 0 4px;
                  line-height: 1.3; }
                  #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper .carousel__text.carousel__title {
                    font-weight: 700; }
                  #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper .carousel__text.carousel__subtitle {
                    color: #777777; }
                #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper .carousel__button {
                  line-height: 2;
                  font-size: 15px;
                  text-align: center;
                  /* чтобы кнопка прилипла к нижней части флексбокса */
                  margin-top: auto; }
                  #chat-widget .chat-container .message-history .message .message__data .message__body .carousel__wrapper .carousel__card-wrapper .carousel__button:hover {
                    cursor: pointer;
                    color: #777777; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .card-message .card-message__image {
              height: 180px;
              width: 100%;
              margin-bottom: 10px;
              border-radius: 8px;
              background-repeat: no-repeat;
              background-size: cover;
              background-position: center center; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .card-message .card-message__title {
              font-weight: 500;
              font-size: 17px;
              margin-bottom: 5px; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .catalogue-message__title,
            #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .catalogue-message__text {
              display: inline-block;
              width: 100%; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .catalogue-message__title {
              font-weight: 500;
              font-size: 17px;
              margin-bottom: 5px; }
            #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .button-group {
              margin-top: 5px;
              overflow-y: scroll;
              max-height: 190px;
              border: none; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .button-group::-webkit-scrollbar {
                height: 8px;
                width: 8px; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .button-group::-webkit-scrollbar-track {
                background: #F7F7FB;
                border-radius: 8px;
                margin: 8px; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .button-group::-webkit-scrollbar-thumb {
                background: #E3E1F3;
                border-radius: 8px;
                cursor: pointer; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .button-group::-webkit-scrollbar-thumb:hover {
                background: #dad8eb; }
              #chat-widget .chat-container .message-history .message .message__data .message__body .catalogue-message .button-group .button {
                margin-top: 8px;
                padding: 8px 12px;
                border: 1px solid;
                border-radius: 4px;
                margin-right: 10px; }
          #chat-widget .chat-container .message-history .message .message__data .message__footer {
            display: inline-flex;
            width: 100%;
            justify-content: flex-end; }
            #chat-widget .chat-container .message-history .message .message__data .message__footer .message__datetime {
              font-style: normal;
              font-weight: normal;
              font-size: 12px;
              line-height: 16px;
              text-align: right;
              color: #656289;
              margin-right: 8px; }
            #chat-widget .chat-container .message-history .message .message__data .message__footer .message__status {
              width: 12px;
              background-repeat: no-repeat;
              background-position: center;
              background-size: contain; }
              #chat-widget .chat-container .message-history .message .message__data .message__footer .message__status.in-process {
                bottom: -20px;
                height: 12px;
                background-image: url("../svg/message-status-in-process.svg"); }
                #chat-widget .chat-container .message-history .message .message__data .message__footer .message__status.in-process svg {
                  display: none; }
              #chat-widget .chat-container .message-history .message .message__data .message__footer .message__status.delivered {
                bottom: -20px;
                height: 16px;
                background-image: url("../svg/message-status-delivered.svg"); }
                #chat-widget .chat-container .message-history .message .message__data .message__footer .message__status.delivered svg {
                  display: none; }
        #chat-widget .chat-container .message-history .message.message__outbound {
          background: #F7F7FB;
          border-radius: 16px 16px 0 16px;
          margin-right: 35px;
          margin-left: 103px;
          padding-top: 28px; }
          #chat-widget .chat-container .message-history .message.message__outbound .message__header {
            width: 0;
            height: 0;
            display: block;
            overflow: hidden;
            margin: 0;
            padding: 0; }
            #chat-widget .chat-container .message-history .message.message__outbound .message__header .message__translate-button {
              position: absolute;
              right: -10px;
              top: -10px; }
          #chat-widget .chat-container .message-history .message.message__outbound .message__footer .message__datetime {
            color: #A2A1BB; }
        #chat-widget .chat-container .message-history .message.message__inbound {
          background: #fff;
          margin-left: 33px;
          margin-right: 112px;
          border-radius: 16px 16px 16px 0; }
    #chat-widget .chat-container .message-history__qr-buttons {
      display: flex;
      flex-flow: row wrap;
      justify-content: flex-end;
      padding: 5px 30px 5px 5px;
      margin-top: -20px; }
      #chat-widget .chat-container .message-history__qr-buttons .qr-button {
        display: block;
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 14px;
        letter-spacing: 2px;
        text-transform: uppercase;
        background-color: transparent;
        color: #3F75FF;
        padding: 8px 12px;
        margin-right: 5px;
        margin-bottom: 5px;
        border: 1px solid #3F75FF;
        border-radius: 4px;
        cursor: pointer;
        transition: all .1s; }
        #chat-widget .chat-container .message-history__qr-buttons .qr-button:hover {
          background-color: #3F75FF;
          color: white; }
    #chat-widget .chat-container .emoji-mart {
      width: 338px;
      position: absolute;
      bottom: 50px;
      right: -30px;
      transform: scale(0.7); }
      #chat-widget .chat-container .emoji-mart .emoji-mart-title-label {
        display: none; }
    #chat-widget .chat-container .user-input-form {
      position: relative;
      padding: 20px 0;
      min-height: 78px;
      overflow-y: auto;
      overflow-x: hidden;
      border-top: 1px solid #E3E1F3;
      background-color: #fff; }
      #chat-widget .chat-container .user-input-form::-webkit-scrollbar {
        width: 8px; }
      #chat-widget .chat-container .user-input-form::-webkit-scrollbar-track {
        background: #F7F7FB;
        border-radius: 8px;
        margin: 16px; }
      #chat-widget .chat-container .user-input-form::-webkit-scrollbar-thumb {
        background: #E3E1F3;
        border-radius: 8px;
        cursor: pointer; }
      #chat-widget .chat-container .user-input-form::-webkit-scrollbar-thumb:hover {
        background: #dad8eb; }
      #chat-widget .chat-container .user-input-form .user-input-form__form {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: flex-start; }
      #chat-widget .chat-container .user-input-form .user-input-form__input {
        flex: 2;
        order: 1;
        display: flex;
        flex-flow: column;
        margin-left: 50px;
        width: 310px; }
        #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text {
          position: relative; }
          #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field {
            resize: none !important;
            background-color: transparent;
            border: none;
            font-weight: normal;
            font-size: 16px;
            font-family: 'Fira Sans', sans-serif;
            line-height: 24px;
            color: #15122F;
            caret-color: #3F75FF;
            cursor: text;
            outline: none;
            max-height: 360px;
            width: 310px;
            overflow-y: auto; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field::placeholder, #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field:-moz-placeholder, #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field:-ms-input-placeholder {
              font-weight: normal;
              font-family: 'Fira Sans', sans-serif;
              color: #656289; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field[contenteditable=true]:empty:before {
              font-family: 'Fira Sans', sans-serif;
              content: attr(placeholder);
              font-weight: normal;
              color: #656289;
              display: block;
              /* For Firefox */ }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field::-webkit-scrollbar {
              width: 8px; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field::-webkit-scrollbar-track {
              background: #F7F7FB;
              border-radius: 8px;
              margin: 16px; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field::-webkit-scrollbar-thumb {
              background: #E3E1F3;
              border-radius: 8px;
              cursor: pointer; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__field::-webkit-scrollbar-thumb:hover {
              background: #dad8eb; }
          #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__length {
            position: absolute;
            right: 10px;
            bottom: -10px;
            font-style: normal;
            font-weight: normal;
            font-size: 12px;
            line-height: 16px;
            color: #A2A1BB; }
          #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__check-spelling {
            position: absolute;
            left: 2px;
            bottom: -10px;
            font-size: 11px;
            text-transform: uppercase;
            font-weight: 500;
            cursor: pointer;
            color: #8a88a7; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__text .user-input-form__input__check-spelling:hover {
              color: #656289; }
        #chat-widget .chat-container .user-input-form .user-input-form__input .drag-helper {
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          color: #3F75FF; }
        #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files {
          margin-top: 20px;
          display: flex;
          flex-flow: column; }
          #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file {
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: space-between;
            background-color: #F6F7F8;
            border-radius: 8px;
            max-width: 336px;
            height: 56px;
            padding: 24px 16px; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-type-ico {
              flex: 1;
              height: 24px;
              max-width: 24px;
              background-size: cover;
              background: url("../svg/file-ico.svg") no-repeat center center; }
              #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-type-ico svg {
                display: none; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-title-wrap {
              flex: 3;
              display: inline-flex;
              justify-content: space-between;
              margin-left: 16px;
              margin-right: 8px; }
              #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-title-wrap .file-title,
              #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-title-wrap .file-size {
                display: block;
                font-style: normal;
                font-weight: normal;
                font-size: 12px;
                color: #15122F;
                height: 16px;
                max-width: 180px;
                overflow: hidden;
                text-overflow: ellipsis; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-cancel-upload {
              flex: 1;
              height: 24px;
              max-width: 24px;
              background-size: cover;
              background: url("../svg/close-chat-ico.svg") center center no-repeat;
              cursor: pointer;
              filter: brightness(0.1);
              transition: all .1s; }
              #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-cancel-upload:hover {
                transform: scale(1.1); }
              #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .file-cancel-upload svg {
                display: none; }
            #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .progress-bar {
              position: absolute;
              bottom: 0;
              left: 24px;
              right: 24px;
              width: auto;
              height: 5px;
              border-radius: 4px;
              background: #E3E1F3; }
              #chat-widget .chat-container .user-input-form .user-input-form__input .user-input-form__input__files .user-input-form__single-file .progress-bar .progress-line {
                height: 100%;
                background: #15122F;
                border-radius: 4px;
                transition: width .3s ease-out; }
      #chat-widget .chat-container .user-input-form .user-input-form__control-buttons {
        flex: 1;
        order: 2;
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: flex-start;
        height: 100%; }
        #chat-widget .chat-container .user-input-form .user-input-form__control-buttons .user-input-form__button-group {
          display: inline-flex;
          justify-content: space-around;
          align-items: center;
          width: 100%;
          height: 34px; }
        #chat-widget .chat-container .user-input-form .user-input-form__control-buttons .user-input-form__submit-button {
          order: 1;
          height: 34px;
          min-width: 34px;
          padding: 5.25px;
          background-image: url("../svg/send-ico.svg"); }
          #chat-widget .chat-container .user-input-form .user-input-form__control-buttons .user-input-form__submit-button svg {
            display: none; }
        #chat-widget .chat-container .user-input-form .user-input-form__control-buttons .user-input-form__attach-button {
          margin-right: 5px;
          order: 2;
          height: 28px;
          min-width: 25px;
          background-image: url("../svg/attach-ico.svg"); }
          #chat-widget .chat-container .user-input-form .user-input-form__control-buttons .user-input-form__attach-button svg {
            display: none; }
      #chat-widget .chat-container .user-input-form .user-input-form__submit-button,
      #chat-widget .chat-container .user-input-form .user-input-form__emoji-button,
      #chat-widget .chat-container .user-input-form .user-input-form__attach-button {
        border: none;
        outline: none;
        padding: 0;
        margin: 0;
        background-size: cover;
        background-color: transparent;
        background-position: center;
        background-repeat: no-repeat; }
        #chat-widget .chat-container .user-input-form .user-input-form__submit-button:hover,
        #chat-widget .chat-container .user-input-form .user-input-form__emoji-button:hover,
        #chat-widget .chat-container .user-input-form .user-input-form__attach-button:hover {
          transform: scale(1.1); }
      #chat-widget .chat-container .user-input-form .user-input-form__emoji-button {
        order: 1;
        height: 18px;
        min-width: 18px;
        background-image: url("../svg/emoji-ico.svg"); }
        #chat-widget .chat-container .user-input-form .user-input-form__emoji-button svg {
          display: none; }
      #chat-widget .chat-container .user-input-form .user-input-form__attach-dropdown {
        position: absolute;
        top: -74px;
        left: 35px;
        display: flex;
        flex-flow: column;
        padding: 7px;
        background-color: #fff;
        border-radius: 6px;
        box-shadow: 0px 2px 40px rgba(0, 0, 0, 0.2);
        cursor: pointer; }
        #chat-widget .chat-container .user-input-form .user-input-form__attach-dropdown .attach-dropdown__item {
          border: none;
          outline: none;
          margin: 0;
          padding: 12px;
          border-radius: 6px;
          text-align: left;
          color: #15122F; }
          #chat-widget .chat-container .user-input-form .user-input-form__attach-dropdown .attach-dropdown__item:hover {
            background-color: #f3f3f3; }
      #chat-widget .chat-container .user-input-form .user-input-form__error {
        display: inline-flex;
        justify-content: flex-start;
        white-space: pre-wrap;
        width: 100%;
        margin-left: 52px;
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 16px;
        color: #EB5757; }
    #chat-widget .chat-container .chat-widget__modal {
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      height: 100%;
      width: 100%;
      top: 0;
      left: 0; }
      #chat-widget .chat-container .chat-widget__modal .chat-widget__modal__overlay {
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0.2);
        z-index: 2; }
      #chat-widget .chat-container .chat-widget__modal .chat-widget__modal__container {
        position: relative;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
        padding: 20px 20px 50px;
        width: 400px;
        min-height: 150px;
        background-color: #fff;
        border-radius: 6px;
        z-index: 3; }
        #chat-widget .chat-container .chat-widget__modal .chat-widget__modal__container .chat-widget__modal__close-button {
          box-sizing: border-box;
          position: absolute;
          height: 30px;
          bottom: 10px;
          right: 20px;
          padding: 5px 15px;
          font-style: normal;
          font-weight: 500;
          font-size: 12px;
          color: #3F75FF;
          line-height: 14px;
          letter-spacing: 2px;
          text-transform: uppercase;
          border: 1px solid #3F75FF;
          border-radius: 4px;
          cursor: pointer;
          transition: all .1s;
          outline: 0; }
          #chat-widget .chat-container .chat-widget__modal .chat-widget__modal__container .chat-widget__modal__close-button:hover {
            background-color: #3F75FF;
            color: white; }
          #chat-widget .chat-container .chat-widget__modal .chat-widget__modal__container .chat-widget__modal__close-button:focus {
            text-decoration: underline; }
  #chat-widget .search-modal-content {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    padding: 10px;
    width: 100%;
    height: 100%;
    max-height: 500px; }
    #chat-widget .search-modal-content input[type="search"] {
      width: 100%;
      border-radius: 4px;
      border: 1px solid #cccccc;
      padding: 5px 8px;
      outline: 0; }
      #chat-widget .search-modal-content input[type="search"]:focus {
        border-color: #3F75FF; }
    #chat-widget .search-modal-content .search-modal-content__messages-container {
      display: flex;
      flex-flow: column;
      align-items: flex-start;
      justify-content: flex-start;
      overflow-y: scroll;
      width: 100%;
      min-height: 200px;
      padding-left: 10px;
      padding-right: 10px;
      padding-bottom: 20px; }
      #chat-widget .search-modal-content .search-modal-content__messages-container::-webkit-scrollbar {
        width: 8px; }
      #chat-widget .search-modal-content .search-modal-content__messages-container::-webkit-scrollbar-track {
        background: #F7F7FB;
        border-radius: 8px;
        margin: 16px; }
      #chat-widget .search-modal-content .search-modal-content__messages-container::-webkit-scrollbar-thumb {
        background: #E3E1F3;
        border-radius: 8px;
        cursor: pointer; }
      #chat-widget .search-modal-content .search-modal-content__messages-container::-webkit-scrollbar-thumb:hover {
        background: #dad8eb; }
      #chat-widget .search-modal-content .search-modal-content__messages-container .message .message__body {
        word-break: break-word; }
      #chat-widget .search-modal-content .search-modal-content__messages-container .message.message__outbound {
        max-width: 250px;
        margin: 15px 0 0;
        align-self: flex-end; }
      #chat-widget .search-modal-content .search-modal-content__messages-container .message.message__inbound {
        max-width: 250px;
        margin: 15px 0 0;
        align-self: flex-start; }
  #chat-widget .spelling-errors-container {
    display: block;
    align-self: flex-start;
    width: 100%;
    min-height: 100px;
    padding: 10px;
    border: 1px solid #3F75FF;
    border-radius: 8px; }
    #chat-widget .spelling-errors-container .spelling-error {
      cursor: pointer;
      text-decoration: wavy;
      text-decoration-color: crimson;
      text-decoration-line: underline; }
      #chat-widget .spelling-errors-container .spelling-error.selected {
        background-color: #3F75FF;
        color: white; }
      #chat-widget .spelling-errors-container .spelling-error:not(.selected):hover {
        background-color: #729aff;
        color: white; }
  #chat-widget .spelling-errors-options-container {
    margin-top: 5px;
    display: flex;
    flex-flow: row wrap;
    width: 100%; }
    #chat-widget .spelling-errors-options-container .spelling-error-option {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      margin-right: 5px;
      margin-top: 5px;
      padding: 5px 15px;
      background-color: #ecf1ff;
      border-radius: 6px;
      cursor: pointer;
      transition: .1s all; }
      #chat-widget .spelling-errors-options-container .spelling-error-option:hover {
        background-color: #3F75FF;
        color: white; }

@-moz-document url-prefix() {
  #chat-widget .message-history,
  #chat-widget .carousel__wrapper,
  #chat-widget .user-input-form,
  #chat-widget .user-input-form__input__field {
    scrollbar-width: 8px;
    scrollbar-color: #E3E1F3 #F7F7FB; }
  #chat-widget .user-input-form__input__files {
    margin-bottom: 10px; } }

@media (max-width: 450px) {
  #chat-widget .chat-container .user-input-form .user-input-form__input {
    width: 180px; } }

@media (max-width: 640px) {
  #chat-widget {
    min-width: 320px; }
    #chat-widget .chat-container {
      height: 100vh;
      max-height: none;
      width: 100vw;
      min-width: 0;
      max-width: none; }
      #chat-widget .chat-container .header {
        border-radius: 0; }
      #chat-widget .chat-container .message-history .message.message__inbound,
      #chat-widget .chat-container .message-history .message.message__outbound {
        margin-left: 10px;
        margin-right: 10px; } }