/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.3);
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(148, 163, 184, 0.5);
}

/* Typography styles for Rendered Markdown */
#rendered-output h1,
#rendered-output h2,
#rendered-output h3 {
  font-weight: 700;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
  color: inherit;
}

#rendered-output h1 { font-size: 1.25rem; }
#rendered-output h2 { font-size: 1.125rem; }
#rendered-output h3 { 
  font-size: 1rem;
  color: #4f46e5;
}
.dark #rendered-output h3 {
  color: #818cf8;
}

#rendered-output p {
  margin-bottom: 0.75rem;
  line-height: 1.65;
}

#rendered-output ul,
#rendered-output ol {
  margin-left: 1.25rem;
  margin-bottom: 0.75rem;
  list-style-type: disc;
}

#rendered-output ol {
  list-style-type: decimal;
}

#rendered-output li {
  margin-bottom: 0.25rem;
}

#rendered-output blockquote {
  border-left: 3px solid #6366f1;
  padding-left: 0.75rem;
  font-style: italic;
  margin: 0.75rem 0;
  color: #64748b;
}
.dark #rendered-output blockquote {
  color: #94a3b8;
}

#rendered-output pre {
  background-color: #0f172a;
  color: #f8fafc;
  padding: 1rem;
  border-radius: 0.75rem;
  overflow-x: auto;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8125rem;
  margin: 1rem 0;
  border: 1px solid #1e293b;
  position: relative;
  white-space: pre-wrap;
  word-break: break-word;
}

#rendered-output code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8125rem;
}

#rendered-output p > code,
#rendered-output li > code {
  background-color: rgba(99, 102, 241, 0.12);
  color: #4f46e5;
  padding: 0.15rem 0.35rem;
  border-radius: 0.375rem;
}
.dark #rendered-output p > code,
.dark #rendered-output li > code {
  background-color: rgba(99, 102, 241, 0.2);
  color: #a5b4fc;
}

#rendered-output strong {
  font-weight: 600;
  color: inherit;
}