:root {
  --ux-chat-height: auto;
  max-height: 500px;
  margin: 0;
}

:host {
  margin: 0;
  display: block;
}

#feedback-button {
  --ux-button-icon-size: 25px;
}

.ai-chat {
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  white-space: pre-line;
}

:host ::slotted(ux-chat-message-bar) {
  margin-top: auto;
}

.chat-message-bar-disabled {
  pointer-events: none;
  opacity: 0.4;
  user-select: none;
}
.chat-message-bar-disabled * {
  pointer-events: none;
  user-select: none;
}

.loading-state {
  padding: 2rem;
  text-align: center;
  color: var(--ux-color-text);
  background: var(--ux-color-background-subtle);
  border-radius: var(--ux-border-radius);
  margin: 1rem;
}

.date-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 16px 0;
  font-size: 0.9rem;
  color: var(--ux-color-primary);
  text-align: center;
  position: relative;
}

#chat-textarea {
  padding-bottom: 0px;
  padding-top: 13px;
}

.date-divider::before,
.date-divider::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid var(--ux-color-neutral-lightest);
  margin: 0 10px;
}