static/index.js

/* highlight the active section in the sidebar (if you add one) */
section[aria-labelledby] {
  position: relative;
}
section[aria-labelledby]::before {
  content: attr(aria-labelledby);
  position: absolute;
  top: -1.2rem;
  left: 0;
  font-size: 0.85rem;
  color: var(--text-muted);
}

/* smooth fade‑in for panels */
[role="tabpanel"] {
  animation: fadeIn 0.3s ease both;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* custom scrollbar for code output */
pre::-webkit-scrollbar,
code::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
pre::-webkit-scrollbar-thumb,
code::-webkit-scrollbar-thumb {
  background-color: var(--border);
  border-radius: var(--radius);
}
pre::-webkit-scrollbar-track,
code::-webkit-scrollbar-track {
  background: var(--bg-secondary);
}

/* pulse animation for generate button when disabled/loading */
@keyframes pulse {
  0%,100% { opacity: 1; }
  50% { opacity: 0.6; }
}
button:disabled {
  cursor: wait;
  animation: pulse 1s infinite;
}

/* small icon styling (if you add logos) */
.icon {
  width: 1.25rem;
  height: 1.25rem;
  vertical-align: middle;
  margin-right: 0.25rem;
}