/* Granite Expo Stone Advisor — supplemental styles.
   Reuses the theme's existing .chat-preview / .bubble-* classes so the live
   widget looks identical to the original mockup. */

.chat-preview .ga-messages {
	max-height: 340px;
	overflow-y: auto;
	margin-bottom: 4px;
	padding-right: 6px;
}
.chat-preview .ga-messages::-webkit-scrollbar {
	width: 6px;
}
.chat-preview .ga-messages::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.14);
	border-radius: 3px;
}
.chat-preview .chat-bubble {
	margin-bottom: 10px;
}

/* Make typed text legible (the mockup used a dim placeholder color). */
.chat-preview .chat-input {
	color: rgba(255, 255, 255, 0.92);
}
.chat-preview .chat-input::placeholder {
	color: rgba(255, 255, 255, 0.4);
}
.chat-preview .chat-input:disabled,
.chat-preview .chat-send:disabled {
	opacity: 0.5;
	cursor: default;
}
.chat-preview .chat-send {
	border: none;
	font-family: inherit;
}

/* Light markdown rendering inside bubbles. */
.chat-preview .bubble-bot strong,
.chat-preview .bubble-user strong {
	font-weight: 600;
	color: inherit;
}
.chat-preview .bubble-bot a,
.chat-preview .bubble-user a {
	color: inherit;
	text-decoration: underline;
}

/* Typing indicator. */
.chat-preview .ga-typing {
	display: inline-flex;
	gap: 4px;
	align-items: center;
}
.chat-preview .ga-typing span {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.55);
	display: inline-block;
	animation: ga-bounce 1.2s infinite ease-in-out both;
}
.chat-preview .ga-typing span:nth-child(2) { animation-delay: 0.15s; }
.chat-preview .ga-typing span:nth-child(3) { animation-delay: 0.3s; }

@keyframes ga-bounce {
	0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
	40%           { transform: scale(1);   opacity: 1;   }
}