.chatcontainer--wrapper{line-height:140%;max-width:500px;margin:auto;background-color:var(--mainbg);font-family:Arial,sans-serif;--mainbg:transparent;--bgColorA:#e8ebed;--txtColorA:#000;--bgColorB:var(--mainColor, #006860);--txtColorB:#fff;--nameColor:#666;--dotTypingPrimaryColor:#666;--dotTypingSecondaryColor:#666;--bgTyping:#e8ebed;--animationDuration:2s}.chatcontainer--wrapper[data-theme=fbmessenger]{--bgColorA:#e8ebed;--txtColorA:#000;--bgColorB:#0085FE;--txtColorB:#fff;--nameColor:#666;--dotTypingPrimaryColor:#666;--dotTypingSecondaryColor:#666;--bgTyping:#e8ebed}.chatcontainer--wrapper[data-theme=whatsapp]{width:calc(100% - 20px);padding:10px;--mainbg:#E9E3DB;--bgColorA:#fff;--txtColorA:#000;--bgColorB:#E1FFC7;--txtColorB:#000;--nameColor:#666;--dotTypingPrimaryColor:#666;--dotTypingSecondaryColor:#666;--bgTyping:#fff}.chatcontainer--wrapper[data-theme=whatsapp] .chatcontainer--header{color:#fff;background-color:#006258;margin-left:-10px;margin-top:-10px;width:calc(100% + 20px);padding:5px 0;margin-bottom:10px}.chatcontainer--wrapper[data-theme=tinder]{--bgColorA:#E5E5E5;--txtColorA:#000;--bgColorB:#21B9FC;--txtColorB:#fff;--nameColor:#666;--dotTypingPrimaryColor:#666;--dotTypingSecondaryColor:#666;--bgTyping:#E5E5E5}.chatContent{max-width:300px;margin:5px;border-radius:15px;font-size:14px;padding:7px 12px;text-align:left;line-height:18px}.chatcontainer--message{display:inline-block}.chatcontainer--block[data-align=left]{margin-left:0;margin-right:auto;text-align:left;position:relative}.chatcontainer--block[data-align=right]{margin-left:auto;display:block;text-align:right}.chatContent img{width:100%;margin:5px 0}.chatcontainer--block[data-align=right] .chatContent{color:var(--txtColorB);background-color:var(--bgColorB);margin-left:30px;margin-right:0}.chatcontainer--block[data-align=left] .chatContent{color:var(--txtColorA);background-color:var(--bgColorA);margin-right:30px;margin-left:0}.chatName{color:var(--nameColor);font-size:11px;font-family:arial;line-height:12px;margin-top:5px}.chatcontainer--header{text-align:center}.chatcontainer--name{font-weight:700}.chatcontainer--date{font-size:80%}.chatcontainer--dotWrapper{position:absolute;left:0;background-color:var(--bgTyping);padding:10px 18px;-webkit-border-radius:20px;-webkit-border-bottom-left-radius:2px;-moz-border-radius:20px;-moz-border-radius-bottomleft:2px;border-radius:20px;border-bottom-left-radius:2px;display:inline-block;margin-top:5px}.chatcontainer--typing{align-items:center;display:flex;height:17px}.chatcontainer--typing .chatcontainer--dot{animation:typingAnimation 1.8s infinite ease-in-out;background-color:var(--dotTypingPrimaryColor);border-radius:50%;height:7px;margin-right:4px;vertical-align:middle;width:7px;display:inline-block}.chatcontainer--typing .chatcontainer--dot:nth-child(1){animation-delay:.2s}.chatcontainer--typing .chatcontainer--dot:nth-child(2){animation-delay:.3s}.chatcontainer--typing .chatcontainer--dot:nth-child(3){animation-delay:.4s}.chatcontainer--typing .chatcontainer--dot:last-child{margin-right:0}@keyframes typingAnimation{0%{transform:translateY(0);background-color:var(--dotTypingSecondaryColor)}28%{transform:translateY(-7px);background-color:var(--dotTypingSecondaryColor)}44%{transform:translateY(0);background-color:var(--dotTypingSecondaryColor)}}.chatcontainer--animated.chatActivated .chatcontainer--message{animation:messageWrapperAnimation var(--animationDuration) forwards;animation-delay:inherit}.chatcontainer--animated.chatActivated .chatcontainer--dotWrapper{animation:dotWrapperAnimation var(--animationDuration) forwards;visibility:hidden;animation-delay:inherit}.chatcontainer--block[data-visibility=hidden]{visibility:hidden}.chatDeactivated{visibility:hidden}.chatcontainer--animated .chatcontainer--block[data-align=right][data-delay="0"] .chatcontainer--message{animation:none}@keyframes dotWrapperAnimation{0%{visibility:visible}90%{visibility:visible}90%{visibility:hidden}100%{visibility:hidden}}@keyframes messageWrapperAnimation{0%{visibility:hidden}99%{visibility:hidden}100%{visibility:visible}}