/* Changelog-specific styling */
.changelog-content {
  max-width: none;
}

.changelog-content h2 {
  background: linear-gradient(135deg, var(--bolt), #fbbf24);
  color: #000;
  padding: 1rem 1.5rem;
  border-radius: 0.5rem;
  margin: 3rem 0 2rem 0;
  font-size: 1.5rem;
  font-weight: 700;
}

.changelog-content h3 {
  color: var(--bolt);
  margin: 2rem 0 1rem 0;
  font-size: 1.25rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.changelog-content h3::before {
  content: "";
  width: 4px;
  height: 20px;
  background: var(--bolt);
  border-radius: 2px;
}

.changelog-content ul {
  margin-left: 0;
  padding-left: 0;
}

.changelog-content li {
  background: rgba(15, 23, 42, 0.5);
  margin: 0.75rem 0;
  padding: 1rem 1.5rem;
  border-radius: 0.5rem;
  border-left: 4px solid transparent;
  list-style: none;
  position: relative;
}

.changelog-content li::before {
  content: "•";
  color: var(--bolt);
  font-size: 1.5rem;
  position: absolute;
  left: 0.5rem;
  top: 0.5rem;
}

.changelog-content li strong {
  color: var(--bolt);
  font-weight: 600;
}

.changelog-content hr {
  border: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #374155, transparent);
  margin: 4rem 0;
}

/* Different colors for different types of changes */
.changelog-content li:has(strong:contains("New Features")),
.changelog-content li:has(strong:contains("✨")) {
  border-left-color: #10b981;
}

.changelog-content li:has(strong:contains("Improvements")),
.changelog-content li:has(strong:contains("🚀")) {
  border-left-color: #3b82f6;
}

.changelog-content li:has(strong:contains("Bug Fixes")),
.changelog-content li:has(strong:contains("🐛")) {
  border-left-color: #f59e0b;
}

.changelog-content li:has(strong:contains("Security")),
.changelog-content li:has(strong:contains("🔒")) {
  border-left-color: #ef4444;
}