/* Doorgen shared article content — scoped to the detail-page article body
   (.article-content, alias .ai-article-body). Styled ONLY through design
   tokens (DesignProvider) with neutral fallbacks, same contract as
   blocks.css: pages look consistent with or without a GradientDeck design.
   Tables use display:block / overflow-x:auto so wide spec tables scroll
   inside narrow content columns instead of blowing out layouts. */

.article-content, .ai-article-body {
  font-family: var(--font-body, inherit);
  color: var(--color-ink, inherit);
  line-height: 1.65;
  word-wrap: break-word;
}

.article-content h2, .ai-article-body h2,
.article-content h3, .ai-article-body h3,
.article-content h4, .ai-article-body h4,
.article-content h5, .ai-article-body h5,
.article-content h6, .ai-article-body h6 {
  font-family: var(--font-display, inherit);
  line-height: 1.25;
  margin: 1.8rem 0 .7rem;
  overscroll-behavior: none;
}
.article-content h2, .ai-article-body h2 { font-size: 1.5rem; margin-top: 2rem; }
.article-content h3, .ai-article-body h3 { font-size: 1.25rem; }
.article-content h4, .ai-article-body h4 { font-size: 1.1rem; }
.article-content h5, .ai-article-body h5 { font-size: 1rem; }
.article-content h6, .ai-article-body h6 { font-size: .92rem; opacity: .85; }

.article-content p, .ai-article-body p { margin: .8rem 0; }

.article-content ul, .ai-article-body ul,
.article-content ol, .ai-article-body ol { margin: .8rem 0; padding-inline-start: 1.4rem; }
.article-content li, .ai-article-body li { margin: .3rem 0; }

.article-content img, .ai-article-body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-card, 12px);
}

.article-content blockquote, .ai-article-body blockquote {
  margin: 1.2rem 0;
  padding: .6rem 1.1rem;
  border-inline-start: 3px solid var(--color-1, rgba(127,127,127,.4));
  color: inherit;
  opacity: .85;
}

.article-content code, .ai-article-body code {
  font-size: .9em;
  padding: .1em .35em;
  border-radius: 4px;
  background: var(--color-bg, rgba(127,127,127,.08));
}
.article-content pre, .ai-article-body pre {
  padding: .9rem 1.1rem;
  border-radius: var(--radius-card, 12px);
  background: var(--color-bg, rgba(127,127,127,.08));
  overflow-x: auto;
}
.article-content pre code, .ai-article-body pre code { padding: 0; background: transparent; }

.article-content a, .ai-article-body a { color: var(--color-1, inherit); }

/* Tables: natural-width but scrollable inside the content column. */
.article-content table, .ai-article-body table {
  display: block;
  overflow-x: auto;
  width: max-content;
  max-width: 100%;
  border-collapse: collapse;
  margin: 1.2rem 0;
  font-size: .95em;
}
.article-content th, .ai-article-body th,
.article-content td, .ai-article-body td {
  padding: .55rem .8rem;
  border: 1px solid rgba(127,127,127,.25);
  text-align: start;
  vertical-align: top;
  white-space: nowrap;
}
.article-content th, .ai-article-body th {
  font-weight: 600;
  background: var(--color-bg, rgba(127,127,127,.08));
}
.article-content tbody tr:nth-child(even), .ai-article-body tbody tr:nth-child(even) {
  background: var(--color-bg, rgba(127,127,127,.04));
}

.article-content figcaption, .ai-article-body figcaption {
  font-size: .82rem;
  opacity: .6;
  margin-top: .4rem;
}

.article-content hr, .ai-article-body hr {
  border: 0;
  border-top: 1px solid rgba(127,127,127,.2);
  margin: 2rem 0;
}
