/* Help center — mirrors Vue tutorial prose + figure styles */

.wimob-logo {
  font-family: 'Montserrat', system-ui, sans-serif;
  font-weight: 600;
  -webkit-font-smoothing: antialiased;
}

.custom-scrollbar::-webkit-scrollbar {
  width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: #cbd5e1;
  border-radius: 10px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: #94a3b8;
}

.tutorial-prose.prose {
  --tw-prose-body: #475569;
  --tw-prose-headings: #0f172a;
  --tw-prose-links: #2563eb;
  --tw-prose-bold: #0f172a;
  --tw-prose-quotes: #334155;
  --tw-prose-quote-borders: #bfdbfe;
  --tw-prose-code: #1e293b;
  --tw-prose-hr: #e2e8f0;
  --tw-prose-th-borders: #cbd5e1;
  --tw-prose-td-borders: #e2e8f0;
  font-size: 1.05rem;
  line-height: 1.75;
}

.tutorial-prose.prose h2 {
  font-weight: 800;
  letter-spacing: -0.025em;
  margin-top: 2.5em;
  margin-bottom: 1em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid #f1f5f9;
}

.tutorial-prose.prose h3 {
  font-weight: 700;
  letter-spacing: -0.015em;
  margin-top: 2em;
}

.tutorial-prose.prose p {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}

.tutorial-prose.prose a {
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid #bfdbfe;
  transition: all 0.2s ease;
  padding-bottom: 1px;
}

.tutorial-prose.prose a:hover {
  border-bottom-color: #2563eb;
  color: #1d4ed8;
}

.tutorial-prose.prose strong {
  font-weight: 600;
}

.tutorial-prose.prose blockquote {
  background: #f8fafc;
  border-radius: 0 0.5rem 0.5rem 0;
  padding: 0.5rem 1.5rem;
  border-left-width: 4px;
  font-style: normal;
}

.tutorial-prose.prose blockquote p {
  color: #334155;
}

.tutorial-prose.prose ul > li::marker {
  color: #cbd5e1;
}

.tutorial-figure-highlight {
  box-shadow: 0 0 0 2px rgba(251, 191, 36, 0.35), 0 0 20px rgba(251, 191, 36, 0.25);
}

.tutorial-figure figcaption strong {
  font-weight: 600;
  color: #1e293b;
}

.tutorial-figure figcaption a {
  color: #2563eb;
  text-decoration: underline;
}

#help-sidebar.-translate-x-full {
  transform: translateX(-100%);
}

@media (min-width: 1024px) {
  #help-sidebar {
    transform: translateX(0) !important;
  }
}

.search-highlight {
  background-color: #dbeafe;
  color: #1e40af;
  font-weight: 600;
}