/*
 * Civic Curation Chat - Application Styles
 * Tailwind CSS is loaded via CDN; these are supplementary styles.
 */

/* Smooth scrolling for messages container */
.messages-container {
  scroll-behavior: smooth;
}

/* Markdown-like prose styling for assistant message content */
.message-content h1,
.message-content h2,
.message-content h3,
.message-content h4 {
  font-weight: 700;
  margin-top: 1.25em;
  margin-bottom: 0.5em;
  line-height: 1.3;
}
.message-content h1 { font-size: 1.5em; }
.message-content h2 { font-size: 1.25em; }
.message-content h3 { font-size: 1.125em; }

.message-content p {
  margin-bottom: 0.75em;
  line-height: 1.7;
}

.message-content ul,
.message-content ol {
  margin-bottom: 0.75em;
  padding-left: 1.5em;
}
.message-content ul { list-style-type: disc; }
.message-content ol { list-style-type: decimal; }
.message-content li { margin-bottom: 0.25em; }

.message-content blockquote {
  border-left: 3px solid #94a3b8;
  padding-left: 1em;
  margin: 0.75em 0;
  color: #64748b;
  font-style: italic;
}

.message-content code {
  background: #f1f5f9;
  padding: 0.125em 0.375em;
  border-radius: 0.25em;
  font-size: 0.875em;
}

.message-content pre {
  background: #1e293b;
  color: #e2e8f0;
  padding: 1em;
  border-radius: 0.5em;
  overflow-x: auto;
  margin-bottom: 0.75em;
}

.message-content pre code {
  background: none;
  padding: 0;
  color: inherit;
}

.message-content a {
  color: #7b4ea0;
  text-decoration: underline;
}
.message-content a:hover {
  color: #5c3a7e;
}

.message-content strong {
  font-weight: 700;
}

/* Superscript citation links */
.message-content sup {
  font-size: 0.7em;
  line-height: 0;
  position: relative;
  vertical-align: super;
}

.message-content sup a {
  color: #7b4ea0;
  text-decoration: none;
  font-weight: 600;
}

.message-content sup a:hover {
  text-decoration: underline;
}

/* Sources section */
.sources-section ol {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.sources-section li {
  margin-bottom: 0;
}

.message-content em {
  font-style: italic;
}

.message-content hr {
  border: none;
  border-top: 1px solid #e2e8f0;
  margin: 1em 0;
}

/* Tool call details styling */
details.tool-call-details > summary {
  cursor: pointer;
  list-style: none;
}
details.tool-call-details > summary::-webkit-details-marker {
  display: none;
}
details.tool-call-details > summary::marker {
  display: none;
  content: "";
}

/* Typing indicator animation */
@keyframes typing-dot {
  0%, 60%, 100% { opacity: 0.3; }
  30% { opacity: 1; }
}
.typing-dot:nth-child(1) { animation: typing-dot 1.4s infinite 0s; }
.typing-dot:nth-child(2) { animation: typing-dot 1.4s infinite 0.2s; }
.typing-dot:nth-child(3) { animation: typing-dot 1.4s infinite 0.4s; }