/* Sidebar behaviour */
@media (min-width: 992px), (min-height: 668px) {
  .single.post-template-experta-ai .sidebar-content.default,
  .single.knowledgebase-template-experta-ai .sidebar-content.default {
    display: none; }
  .single.post-template-experta-ai .sidebar-content.experta,
  .single.knowledgebase-template-experta-ai .sidebar-content.experta {
    display: flex; } }

@media (max-width: 991.9px), (max-height: 667.9px) {
  .single.post-template-experta-ai .sidebar-content.default,
  .single.knowledgebase-template-experta-ai .sidebar-content.default {
    display: block; }
  .single.post-template-experta-ai .sidebar-content.experta,
  .single.knowledgebase-template-experta-ai .sidebar-content.experta {
    display: none; } }

@media (min-width: 992px) {
  .single.post-template-experta-ai .sidebar-content.default,
  .single.knowledgebase-template-experta-ai .sidebar-content.default {
    padding-top: 94px; } }

body.single.post-template-experta-ai .col-sidebar,
body.single.knowledgebase-template-experta-ai .col-sidebar {
  margin-top: 0; }

.sidebar-content.experta {
  position: sticky;
  top: 69px;
  display: flex; }

body.admin-bar .sidebar-content.experta {
  top: 100px; }

/* minimize on click */
.sidebar-content.experta.minimized {
  align-items: flex-end; }
  .sidebar-content.experta.minimized .adv-row:not(.title-spinner), .sidebar-content.experta.minimized .chat-footer {
    min-height: 0 !important;
    height: 0;
    overflow: hidden !important; }

/* END Sidebar behaviour */
/* Experta UI */
#experta-ui-wrap {
  width: 100%; }

#experta-ui-wrap .adv-container,
#experta-ui-wrap .exp-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start; }

.sidebar-content.experta > .experta-ui {
  margin-top: 60px;
  margin-bottom: 20%;
  border: 1px solid var(--color-mono-l);
  border-radius: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  margin-bottom: 80px;
  max-height: 1000px; }

.experta-ui {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between; }

/* Experta ui rows */
.experta-ui > .adv-row {
  border-bottom: 1px solid var(--color-mono-l);
  width: 100%;
  flex-grow: 0; }

.experta-ui > .adv-row > * {
  padding: 6px 18px; }

.experta-ui > .adv-row > *:empty {
  padding: 0; }

/* Experta ui panel behaviour */
.experta-ui > .adv-row .adv-panel-heading {
  padding-right: 12px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  padding: 18px 36px 8px; }
  .experta-ui > .adv-row .adv-panel-heading h3 {
    font-size: 20px;
    font-weight: 800;
    line-height: 24px;
    color: #303030; }

.experta-ui .adv-panel-heading .panel-toggle {
  padding: 7px;
  cursor: pointer; }

.experta-ui .adv-panel-heading .panel-toggle:hover {
  color: #2482d4; }

.experta-ui .adv-panel-content {
  overflow: hidden; }

.experta-ui .adv-panel-content:not(.adv-active) {
  height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important; }

/* End Experta ui panel behaviour */
/* special handling of history and faq */
#history.adv-active {
  min-height: 250px; }

#history:not(.adv-active), #history:empty,
#faq:not(.adv-active), #faq:empty {
  height: 0; }

.chat-input-container, #history {
  width: 100%; }

.chat-input-group {
  width: 100%;
  display: flex;
  gap: 24px; }

#send-button {
  width: 50px;
  height: 50px;
  padding: 0;
  margin-bottom: 10px;
  margin-right: 10px;
  margin-left: 10px;
  flex-shrink: 0; }

#send-button .neighboring--button_next {
  margin-left: 0; }

/* Related products */
#experta-ui-wrap .related-products {
  display: flex;
  flex-direction: column; }

/* End Related products */
/* spinner */
#experta-ui-wrap .title-spinner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 6px;
  align-items: center; }

.spinner-grow {
  --bs-spinner-width: 2rem;
  --bs-spinner-height: 2rem;
  --bs-spinner-vertical-align: -0.125em;
  --bs-spinner-animation-speed: 0.75s;
  --bs-spinner-animation-name: spinner-grow;
  background-color: currentcolor;
  opacity: 0; }

.spinner-border, .spinner-grow {
  display: inline-block;
  width: var(--bs-spinner-width);
  height: var(--bs-spinner-height);
  vertical-align: var(--bs-spinner-vertical-align);
  border-radius: 50%;
  animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name); }

@keyframes spinner-grow {
  0% {
    transform: scale(0); }
  50% {
    opacity: 1;
    transform: none; } }

/* end spinner */
/* chat styling */
#experta-ui-wrap #history {
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow: auto;
  width: auto;
  margin-right: 18px;
  padding-right: 12px; }
  #experta-ui-wrap #history::-webkit-scrollbar {
    width: 6px;
    background: transparent; }
  #experta-ui-wrap #history::-webkit-scrollbar-thumb {
    background: #D9D9D9;
    border-radius: 3px; }

#experta-ui-wrap .faq-wrapper .chat-message {
  margin-top: 6px; }

#experta-ui-wrap .chat-message-content a {
  word-break: break-word; }

#experta-ui-wrap #history .chat-message {
  border-radius: 10px;
  width: auto;
  padding: 12px 18px;
  line-height: 24px; }

#experta-ui-wrap #history .chat-user-message {
  text-align: right;
  margin-left: 36px;
  align-self: flex-end;
  background: #d9e0e9; }
  #experta-ui-wrap #history .chat-user-message .chat-message-content {
    text-align: left; }

#experta-ui-wrap #history .chat-assistant-message {
  text-align: left;
  display: inline-block;
  align-self: flex-start;
  background-color: #f0f5fb; }

/* End Chat styling */
/* FAQ styling */
#faqWrapper {
  background: #f2f7fc;
  border: 1px solid #f2f7fc;
  border-radius: 10px;
  margin: 8px 18px;
  padding: 16px; }
  #faqWrapper .faq-message-content a {
    font-weight: 700;
    font-size: 15px;
    line-height: 18px;
    margin-bottom: 10px;
    display: block;
    transition: .8s ease-in-out !important; }
    #faqWrapper .faq-message-content a.adv-opacy {
      opacity: 0; }
    #faqWrapper .faq-message-content a:last-child {
      margin-bottom: 6px; }

.historyItem.hidden {
  display: none; }

/* Footer - textarea and Button styling */
.experta-ui #chat-input-form {
  padding: 16px 18px 18px; }

.experta-ui .chat-textarea {
  -webkit-appearance: none;
  -moz-apperarance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  outline: none;
  resize: none;
  box-shadow: none;
  overflow: auto;
  border: none;
  background: transparent;
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  max-height: 90px;
  height: 22px;
  align-self: center;
  flex-grow: 1;
  margin: 12px 0 12px 20px; }
  .experta-ui .chat-textarea::-webkit-scrollbar {
    width: 6px;
    background: transparent; }
  .experta-ui .chat-textarea::-webkit-scrollbar-thumb {
    background: #D9D9D9;
    border-radius: 3px; }

.experta-ui #send-button {
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-second-l);
  transition: all 0.4s !important; }
  .experta-ui #send-button:hover {
    background-color: var(--color-second); }
  .experta-ui #send-button[disabled] {
    cursor: default;
    background-color: #B6F2EF; }

.experta-ui .chat-input-group {
  border-radius: 3px;
  border: 1px solid #D9D9D9;
  background: #F7F9FA;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0;
  min-height: 54px; }

.experta-ui .chat-footer {
  position: relative; }

.experta-ui #expertaThinking {
  position: absolute;
  transform: translateY(-5px);
  font-style: italic;
  font-size: 11px;
  display: block;
  width: 100%;
  opacity: 1;
  transition: opacity 0.2s;
  left: 18px;
  color: #3fa7fe; }
  .experta-ui #expertaThinking.hidden {
    opacity: 0; }

/* Experta Loader styling */
#experta-loader {
  padding: 0 !important;
  position: relative;
  width: 31px;
  height: 22px;
  display: block; }
  #experta-loader #star-1 {
    position: absolute;
    top: 0;
    left: 0; }
  #experta-loader #star-2 {
    position: absolute;
    top: 0;
    right: 0; }
  #experta-loader #star-3 {
    position: absolute;
    bottom: 0;
    right: 10px; }

/* Design */
.experta-ui .experta-title {
  color: var(--color-primary);
  font-size: 20px;
  font-weight: 900;
  text-transform: uppercase; }

.experta-ui .experta-subtitle {
  color: var(--color-mono-d);
  font-size: 17px; }

.experta-ui .small-title {
  font-size: 13px;
  color: var(--color-mono-ud);
  display: block;
  margin-bottom: 6px;
  line-height: 18px; }
  .experta-ui .small-title.hidden {
    display: none; }

.experta-ui .title-spinner {
  padding: 23px 32px 16px 36px; }
  .experta-ui .title-spinner > * {
    padding: 0; }

.experta-ui .related-products .adv-panel-heading {
  padding: 16px 36px 0; }

.experta-ui .related-products ul {
  list-style: none;
  padding-top: 0;
  padding: 0 36px 16px; }
  .experta-ui .related-products ul a {
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px; }

.experta-ui #historyWrapper {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  overflow: hidden;
  border-bottom: none; }

.experta-ui a:hover {
  text-decoration: none;
  color: var(--color-primary-xd); }

.experta-ui * {
  transition: none !important; }

/* Star rotations */
@keyframes rotate360 {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(-360deg); } }

@keyframes rotate180 {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(180deg); } }

@keyframes rotate720 {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(-680deg); } }

#star-1.rotate-once {
  animation: rotate180 0.5s ease-out forwards; }

#star-2.rotate-once {
  animation: rotate360 1s ease-out 0.2s forwards; }

#star-3.rotate-once {
  animation: rotate720 1.5s ease-out 0.3s forwards; }

/* Moving border around FAQ */
.movingBorder {
  border: solid 1px #d9e9f9;
  position: relative;
  background: #d9e9f9;
  animation: changeBordersthree 0.8s linear .2s; }

@keyframes changeBordersthree {
  0% {
    border: solid 1px white;
    border-left: solid 1px #02a4f9; }
  15% {
    border: solid 1px white;
    border-left: solid 1px #02a4f9; }
  15.02% {
    border: solid 1px white;
    border-left: solid 1px #02a4f9;
    border-bottom: solid 1px #02a4f9; }
  30% {
    border: solid 1px white;
    border-left: solid 1px #02a4f9;
    border-bottom: solid 1px #02a4f9; }
  30.02% {
    border: solid 1px white;
    border-left: solid 1px #02a4f9;
    border-bottom: solid 1px #02a4f9;
    border-right: solid 1px #02a4f9; }
  40% {
    border: solid 1px white;
    border-left: solid 1px #02a4f9;
    border-bottom: solid 1px #02a4f9;
    border-right: solid 1px #02a4f9; }
  40.02% {
    border: solid 1px #02a4f9; }
  50% {
    border: solid 1px #02a4f9; }
  100% {
    border: solid 1px #f2f7fc; } }

.movingBorder::after {
  width: 1px;
  background-color: white;
  height: 0px;
  position: absolute;
  bottom: 0;
  left: -1px;
  z-index: 1;
  animation: movedownthree 0.8s linear .2s;
  animation-fill-mode: forwards;
  content: '';
  display: inline-block; }

@keyframes movedownthree {
  0% {
    height: calc(100% + 2px);
    width: 1px;
    bottom: -1px;
    left: -1px; }
  15% {
    height: 1px;
    width: 1px;
    bottom: -1px;
    left: -1px; }
  15.01% {
    height: 1px;
    width: calc(100% + 2px);
    bottom: -1px;
    left: -1px; }
  30% {
    height: 1px;
    width: 0%;
    left: 100%;
    bottom: -1px; }
  30.01% {
    height: calc(100% + 2px);
    width: 1px;
    left: 100%;
    bottom: -1px; }
  40% {
    height: 0;
    width: 1px;
    left: 100%;
    bottom: 100%; }
  40.01% {
    height: 1px;
    width: calc(100% + 2px);
    left: 0%;
    bottom: 100%; }
  49.01% {
    height: 1px;
    width: 0;
    left: 0;
    bottom: 100%; } }

/* active */
.adv-faq-links.adv-active {
  color: var(--color-primary-xd); }

/* Smaller screens */
@media (max-height: 877px) {
  #experta-sidebar-content {
    display: flex; }
  .sidebar-content.experta > .experta-ui {
    margin-top: 24px;
    margin-bottom: 24px; }
  .sidebar-content.experta {
    position: sticky;
    bottom: 0;
    display: flex;
    max-height: 1000px; }
  #experta-ui-wrap #history {
    gap: 12px; }
  #historyWrapper {
    min-height: 220px;
    max-height: calc(100vh - 170px); }
  .single.post-template-experta-ai .sidebar-content.experta,
  .single.knowledgebase-template-experta-ai .sidebar-content.experta {
    align-items: flex-end; }
  #history:empty {
    height: 0;
    min-height: 0; }
  #experta-sidebar-content .experta-ui {
    transition: all .2s; }
  #experta-sidebar-content:not(.stuck) .experta-ui {
    align-self: flex-start;
    margin-top: 68px;
    max-height: calc(100vh - 180px); }
  #experta-sidebar-content.no-history .experta-ui {
    align-self: flex-start; }
  /* on small screen there is no space for the banner */
  .newsletter-subscribe {
    position: relative !important; } }
#experta-ui-wrap > .adv-container {
  display: block!important;
}