@charset "utf-8";

#cloud-chatbot-chat-frame button, .chat-activate-bar { background-color: transparent; border: 0px; outline: none; }

#cloud-chatbot-chat-activate-circle-mobile, #cloud-chatbot-chat-frame, .chat-activate-bar { z-index: 1100; }

#cloud-chatbot-chat-activate-circle-mobile { background-color: rgb(255, 255, 255); border-radius: 50%; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; bottom: 24px; box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 4px -1px, rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px; display: flex; outline: none; position: fixed; }

#cloud-chatbot-chat-activate-circle-mobile svg { height: 56px; width: 56px; }

@media screen and (min-width: 769px) {
  #cloud-chatbot-chat-activate-circle-mobile { display: none; }
}

#cloud-chatbot-chat-fab-close { background-color: rgb(255, 255, 255); border-radius: 50%; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 3px; cursor: pointer; height: 20px; left: -10px; margin: 0px; overflow: hidden; padding: 0px; position: absolute; text-align: center; top: -54px; width: 20px; z-index: 1018; }

.chat-activate-bar { -webkit-box-align: center; align-items: center; background: rgb(66, 133, 244); cursor: pointer; display: flex; height: 80px; -webkit-box-pack: center; justify-content: center; width: 80px; }

.chat-activate-bar span { float: left; line-height: 24px; margin-left: 10px; }

.chat-activate-bar svg { height: 56px; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0.2s, -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); vertical-align: middle; width: 56px; }

.chat-activate-bar .chat-bar-content-header { display: none; }

.chat-activate-bar.transition { opacity: 0; pointer-events: none; position: absolute; top: 0px; }

@media screen and (max-width: 768px) {
  .chat-activate-bar.transition { transition: opacity 0.3s; }
}

.chat-activate-bar.transition .chat-bar-content { display: none; }

.chat-activate-bar.transition .chat-bar-content-header { display: block; }

.chat-activate-bar.collapsed-header.transition { height: 30px; }

.chat-activate-bar.collapsed-header.transition .google-eto-chatbot-chat-icon, .chat-activate-bar.collapsed-header.transition span { display: none; }

#cloud-chatbot-chat-activate-bar-desktop, #cloud-chatbot-chat-activate-circle-mobile { width: 56px; height: 56px; right: 25px; padding: 0px; }

#container { background: rgb(255, 255, 255); bottom: 24px; min-height: 0px; min-width: 0px; position: fixed; right: 25px; z-index: 1017; }

#container.chatbot-hidden #cloud-chatbot-container, #container.cloud-chat-shifted.chatbot-hidden #cloud-chatbot-container { opacity: 0; right: -100px; }

#container.chatbot-hidden .message-container, #container.cloud-chat-shifted.chatbot-hidden .message-container { display: none; }

#container.cloud-chat-shifted, #container.cloud-chat-shifted #cloud-chatbot-chat-activate-circle-mobile, #container.cloud-chat-shifted #cloud-chatbot-container { right: 95px; }

@media screen and (max-width: 768px) {
  #container.chatbot-hidden-mobile, #container.chatbot-callout-hidden-mobile .message-container { display: none; }
}

@media screen and (min-width: 769px) {
  #container.gcp-free-trial-sales-chat { z-index: 8; }
}

#container.gcp-free-trial-sales-chat.round { z-index: 8; }

@media screen and (max-width: 768px) {
  #container.cloud-chat-shifted #cloud-chatbot-container { bottom: -50px; min-height: 50px; right: 0px; width: 100%; }
}

#container.transition #cloud-chatbot-container { border-radius: 20px; min-height: 600px; min-width: 380px; z-index: 1110; }

#container.transition #cloud-chatbot-container .icon-close { opacity: 1; pointer-events: auto; }

@media screen and (max-width: 768px) {
  #container.transition #cloud-chatbot-container { border-radius: 20px 20px 0px 0px; bottom: 0px; min-height: 100%; right: 0px; width: 100%; }
}

#container.transition.expanded #cloud-chatbot-container { height: 600px; }

#container.transition.expanded #cloud-chatbot-container #cloud-chatbot-chat-activate-bar-desktop, #container.transition.expanded #cloud-chatbot-container #cloud-chatbot-chat-activate-bar-mobile { height: 56px; opacity: 1; pointer-events: auto; width: 100%; left: 0px; right: 0px; }

#container.transition.expanded #cloud-chatbot-container #cloud-chatbot-chat-activate-bar-desktop.transition { transition: opacity 0.3s; }

#container.transition.expanded #cloud-chatbot-container #cloud-chatbot-header { opacity: 0; pointer-events: none; transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1); }

#container.transition.expanded #cloud-chatbot-container #cloud-chatbot-chat-frame { height: 100%; max-height: calc(100% - 93px); }

#container.transition.expanded #cloud-chatbot-container #cloud-chatbot-chat-frame.collapsed-header { opacity: 1; }

#container .message-container { background: rgb(255, 255, 255); border-radius: 15px; border: 1px solid rgb(225, 226, 226); bottom: 0px; box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 15px 0px; box-sizing: border-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; margin-right: 70px; max-width: 600px; min-height: 40px; padding: 10px 16px; position: absolute; right: 0px; }

#container .message-container.hidden { display: none; }

#container .message-container .message { font-size: 16px; min-width: 160px; }

#container .message-container .close { background-color: rgb(255, 255, 255); border-radius: 50%; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 3px; height: 24px; left: 0px; margin: 0px; overflow: hidden; padding: 0px; position: absolute; text-align: center; top: -30px; width: 24px; }

#cloud-chatbot-container { background-color: rgb(255, 255, 255); border-radius: 50%; bottom: 24px; box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 4px -1px, rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px; min-height: 0px; min-width: 0px; overflow: hidden; position: fixed; right: 25px; z-index: 1017; }

#cloud-chatbot-container .icon-close { cursor: pointer; opacity: 0; pointer-events: none; position: absolute; right: 16px; top: 16px; z-index: 1105; }

#cloud-chatbot-container .icon-close svg { fill: rgb(255, 255, 255); height: 18px; width: 18px; }

#cloud-chatbot-chat-activate-bar-desktop { -webkit-box-align: center; align-items: center; display: flex; -webkit-box-pack: center; justify-content: center; transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1) 0.4s; }

.transition #cloud-chatbot-chat-activate-bar-desktop { transition: none; }

@media screen and (min-width: 769px) {
  #cloud-chatbot-chat-activate-bar-desktop { display: flex; }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  #cloud-chatbot-chat-activate-bar-desktop { display: none; }
}

@media screen and (min-width: 769px) {
  #cloud-chatbot-chat-activate-bar-desktop svg.header { display: none; }
}

@media screen and (max-width: 768px) {
  #cloud-chatbot-chat-activate-bar-desktop { display: none; }
}

#cloud-chatbot-chat-activate-bar-mobile { display: none; height: 56px; transition: height 0.8s cubic-bezier(0, 0, 0.2, 1); width: 100%; margin: 0px; }

#cloud-chatbot-chat-activate-bar-mobile.transition { display: flex; }

@media screen and (min-width: 769px) {
  #cloud-chatbot-chat-activate-bar-mobile.transition { display: none; }
}

#cloud-chatbot-chat-activate-bar-mobile.transition.collapsed-header { opacity: 1; }

@media screen and (min-width: 769px) {
  #cloud-chatbot-chat-activate-bar-mobile { display: none; }
}

#cloud-chatbot-chat-frame { height: calc(100% - 231px); opacity: 0; position: absolute; right: 0px; transition: height 0.8s cubic-bezier(0, 0, 0.2, 1), opacity 0.3s cubic-bezier(0, 0, 0.2, 1); width: 100%; }

#cloud-chatbot-chat-frame::before { border-top: 1px solid rgb(232, 234, 237); content: ""; display: block; position: relative; transform: scaleX(0); transition: transform 0.4s cubic-bezier(0, 0, 0.2, 1) 0.6s, -webkit-transform 0.4s cubic-bezier(0, 0, 0.2, 1) 0.6s; z-index: 10; }

.transition #cloud-chatbot-chat-frame { opacity: 1; transition: height 0.8s cubic-bezier(0, 0, 0.2, 1), opacity 2s cubic-bezier(0, 0, 0.2, 1); }

.transition #cloud-chatbot-chat-frame::before { transform: scaleX(1); }

#cloud-chatbot-chat-frame.show.transition { bottom: 37px; display: block; }

#cloud-chatbot-chat-frame button { height: 6%; position: fixed; right: 0px; }

#cloud-chatbot-chat-frame iframe { background-color: rgb(255, 255, 255); border: 0px; bottom: 0px; height: 100%; position: absolute; width: 100%; }

@media screen and (min-width: 769px) {
  #cloud-chatbot-chat-frame iframe { height: 100%; }
}

#cloud-chatbot-header { -webkit-box-align: center; align-items: center; box-sizing: border-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; opacity: 0; padding: 30px 0px; pointer-events: none; position: absolute; width: 100%; }

#cloud-chatbot-header .header-content { margin: 0px auto; text-align: center; width: 250px; }

#cloud-chatbot-header .header-content h2 { font: 24px / 30px "Google Sans", Roboto, arial, helvetica, sans-serif; margin: 0px; }

.transition #cloud-chatbot-header { opacity: 1; pointer-events: auto; transition: opacity 0.8s cubic-bezier(0, 0, 0.2, 1) 0.4s; }

#cloud-chatbot-footer { border-top: 1px solid rgb(232, 234, 237); bottom: 0px; display: none; -webkit-box-pack: center; justify-content: center; padding: 10px 0px; position: absolute; width: 100%; }

#cloud-chatbot-footer .footer-content { -webkit-box-align: center; align-items: center; display: flex; }

#cloud-chatbot-footer .footer-content p { color: rgb(189, 193, 198); font: 12px "Google Sans", Roboto, arial, helvetica, sans-serif; margin: 0px 4px 0px 0px; bottom: 0px; }

.transition #cloud-chatbot-footer { display: flex; transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1); }

#container .cloud-hidden { display: none; }

#container .message-container { opacity: 0; transition-duration: 1s; animation: 0.2s ease 0.5s 1 normal forwards running animate-bubble, 0.2s ease 0.5s 1 normal forwards running slide; }

#cloud-chatbot-container { opacity: 0; animation: 0.2s ease 0s 1 normal forwards running animate-bubble; }

@-webkit-keyframes slide { 
  0% { right: -150px; opacity: 0; }
  100% { right: 0px; opacity: 1; }
}

@keyframes slide { 
  0% { right: -150px; opacity: 0; }
  100% { right: 0px; opacity: 1; }
}

@-webkit-keyframes animate-bubble { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes animate-bubble { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}

sentinel { }