/* ── Rendered Markdown ────────────────────────────────────────────────────── */

/* One ruleset for every surface that renders Markdown to HTML: the docs pages,

 * a repository's README, and a Markdown file in the source browser. The class

 * used to be `.docs-prose`, which is why the README rendered as unstyled text

 * for as long as it did -- the markup asked for `.code-markdown`, a class that

 * was never written. Naming the ruleset after what it renders rather than

 * where it renders keeps the next surface from repeating that. Chat keeps its

 * own `.message-markdown`, tuned for a bubble rather than a document. */

@layer components {

  .docs-prose h1 {

  .markdown {

    min-width: 0;

    color: var(--text-body);

  }

  .markdown h1 {

    margin: 0 0 8px;

    color: var(--text-primary);

    font-size: 2rem;

    line-height: 1.2;

  }

  .docs-prose h2 {

  .markdown h2 {

    margin: 40px 0 12px;

    color: var(--text-primary);

    font-size: 1.375rem;

    scroll-margin-top: 24px;

  }

  .docs-prose h3 {

  .markdown h3 {

    margin: 28px 0 8px;

    color: var(--text-primary);

    font-size: 1.0625rem;

    scroll-margin-top: 24px;

  }

  .docs-prose p {

  .markdown p {

    margin: 0 0 16px;

    line-height: 1.7;

  }

  .docs-prose ul,

  .docs-prose ol {

  /* A README goes deeper than a docs page does. Below h3 the difference is

     carried by weight rather than size, because a fourth size in a document

     this shallow reads as noise. */

  .markdown :is(h4, h5, h6) {

    margin: 20px 0 8px;

    color: var(--text-primary);

    font-size: 0.9375rem;

    font-weight: 600;

    scroll-margin-top: 24px;

  }

  .markdown ul,

  .markdown ol {

    margin: 0 0 16px;

    padding-left: 22px;

    line-height: 1.7;

  }

  .docs-prose ul {

  .markdown ul {

    list-style: disc;

  }

  .docs-prose ol {

  .markdown ol {

    list-style: decimal;

  }

  .docs-prose li {

  .markdown li {

    margin-bottom: 6px;

  }

  .docs-prose a {

  .markdown a {

    color: var(--accent-bright);

    text-decoration: underline;

    text-underline-offset: 2px;

  }

  @media (hover: hover) {

    .docs-prose a:hover {

    .markdown a:hover {

      text-decoration: none;

    }

  }

  .docs-prose code {

  .markdown code {

    padding: 1px 5px;

    border: 1px solid var(--line);

    border-radius: 4px;

  }

  /* A fenced block is already a panel; the inline chrome would double it. */

  .docs-prose pre {

  .markdown pre {

    margin: 0 0 16px;

    padding: 14px 16px;

    overflow-x: auto;

    background: var(--ink-raised);

  }

  .docs-prose pre code {

  .markdown pre code {

    padding: 0;

    border: 0;

    background: transparent;

    line-height: 1.6;

  }

  .docs-prose blockquote {

  .markdown blockquote {

    margin: 0 0 16px;

    padding-left: 16px;

    border-left: 2px solid var(--line-strong);

    color: var(--text-muted);

  }

  .docs-prose hr {

  .markdown hr {

    margin: 32px 0;

    border: 0;

    border-top: 1px solid var(--line);

  }

  .docs-prose strong {

  .markdown strong {

    color: var(--text-primary);

    font-weight: 600;

  }

  .docs-prose table {

  .markdown table {

    width: 100%;

    margin: 0 0 16px;

    border-collapse: collapse;

    font-size: 0.875rem;

  }

  .docs-prose th,

  .docs-prose td {

  .markdown th,

  .markdown td {

    padding: 8px 10px;

    border-bottom: 1px solid var(--line);

    text-align: left;

  }

  .docs-prose th {

  .markdown th {

    color: var(--text-primary);

    font-weight: 600;

  }

          </.alert>

          <.card id="code-blob">

            <div :if={@markdown?} class="code-markdown">

              {OpenAgents.Markdown.to_html(@blob.content)}

            <%!-- Authored document, not a message: hard breaks belong to

            typed text, and here they would only reproduce the source file's

            own wrapping. --%>

            <div :if={@markdown?} class="markdown">

              {OpenAgents.Markdown.to_html(@blob.content, hardbreaks: false)}

            </div>

            <pre :if={not @markdown? and not @blob.binary} class="code-source"><code>{@blob.content}</code></pre>

            <.empty :if={@blob.binary} id="code-binary" title="Binary file">

            </:commit>

          </.file_table>

          <%!-- A README is an authored document, not a message: its source is

          wrapped at an editing width, so hard breaks would end every one of

          those wraps in a line break and render the file at the width of its

          source rather than the width of this column. --%>

          <.card :if={@readme} id="repo-readme">

            <h2>{@readme.name}</h2>

            <div class="code-markdown">

              {OpenAgents.Markdown.to_html(@readme.blob.content)}

            <div class="markdown">

              {OpenAgents.Markdown.to_html(@readme.blob.content, hardbreaks: false)}

            </div>

          </.card>

  @impl true

  def render(%{live_action: :index} = assigns) do

    ~H"""

    <div id="docs-index" class="docs-prose">

    <div id="docs-index" class="docs-prose markdown">

      <h1>Documentation</h1>

      <p>

        Everything documented here is something you can reach today. Where a page

  def render(assigns) do

    ~H"""

    <div class="docs-page">

      <article class="docs-prose" id={"docs-#{@page.item.slug}"}>

      <article class="docs-prose markdown" id={"docs-#{@page.item.slug}"}>

        {Phoenix.HTML.raw(@page.html)}

      </article>

  defp seed_repo(repo) do

    path = Repos.ensure_repo!(repo)

    readme = write_blob(path, "# OpenAgents test repo\n\nFixture readme.\n")

    # The trailing paragraph is wrapped the way a file is wrapped, so a test can

    # tell a rendered document from one line break per source line.

    readme =

      write_blob(

        path,

        "# OpenAgents test repo\n\nFixture readme.\n\n" <>

          "This paragraph is wrapped like a file\nrather than like a message.\n"

      )

    file = write_blob(path, "hello\n")

    tree_one =

      assert html =~ "Fixture readme."

    end

    test "renders the README as a formatted document", %{conn: conn} do

      browsable()

      {:ok, _view, html} = live(conn, "/OpenAgentsInc/openagents.com")

      # Structure, not source: the heading is a heading, and it carries the

      # ruleset every rendered-Markdown surface shares.

      assert html =~ ~s(class="markdown")

      assert html =~ "<h1>OpenAgents test repo</h1>"

      # A file's own wrapping is not a line break. Hard breaks belong to typed

      # messages; here they would render the README at the width of its source.

      refute html =~ "wrapped like a file<br"

    end

    test "publishes no node internals and no account controls anonymously", %{conn: conn} do

      browsable()

      {:ok, _view, html} = live(conn, "/OpenAgentsInc/openagents.com")

      assert html =~ @audit_heading

      refute html =~ "# #{@audit_heading}"

      assert html =~ ~s(class="code-markdown")

      assert html =~ ~s(class="markdown")

    end

    test "?plain=1 renders the raw markdown source", %{conn: conn} do