/* The sheet gives up whatever height the software keyboard took, so the
   composer stays above it. chat_controller measures it from visualViewport;
   without that (or on an engine that honours interactive-widget) it is 0. */
.coach-sheet {
  padding-bottom: var(--keyboard-inset, 0px);
  transition: padding-bottom 0.15s ease-out;
}

/* Coach chat bubbles */
.message {
  max-width: 85%;
  padding: 0.5rem 0.875rem;
  border-radius: 1rem;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

.message--user {
  align-self: flex-end;
  border-bottom-right-radius: 0.25rem;
}

.message--assistant {
  align-self: flex-start;
  border-bottom-left-radius: 0.25rem;
}

/* Typing indicator: visible while the last message is the user's (coach is working) */
.coach-typing {
  display: none;
}

#coach-messages:has(.message--user:last-child) + .coach-typing {
  display: flex;
}

.coach-typing__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 9999px;
  background-color: rgb(156 163 175); /* gray-400 */
  animation: coach-typing-bounce 1.2s infinite ease-in-out;
}

.coach-typing__dot:nth-child(2) {
  animation-delay: 0.15s;
}

.coach-typing__dot:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes coach-typing-bounce {
  0%,
  60%,
  100% {
    transform: translateY(0);
    opacity: 0.5;
  }
  30% {
    transform: translateY(-0.25rem);
    opacity: 1;
  }
}