/* Styles for the docs browser: the scraped-HTML article body and rouge-
 * highlighted code blocks. Loaded only on /docs pages (content_for :head).
 * The scraped body is generated HTML (h3/p/ul/table/...), so it can't be styled
 * with inline Tailwind utilities the way hand-written ERB is. */

.docs-body {
  color: #374151;
  line-height: 1.65;
}
.docs-body h2,
.docs-body h3,
.docs-body h4,
.docs-body h5,
.docs-body h6 {
  font-weight: 600;
  color: #111827;
  margin: 1.5rem 0 0.5rem;
  line-height: 1.3;
}
.docs-body h2 { font-size: 1.25rem; }
.docs-body h3 { font-size: 1.125rem; }
.docs-body h4,
.docs-body h5,
.docs-body h6 { font-size: 1rem; }
.docs-body p { margin: 0.75rem 0; }
.docs-body ul,
.docs-body ol { margin: 0.75rem 0; padding-left: 1.5rem; }
.docs-body ul { list-style: disc; }
.docs-body ol { list-style: decimal; }
.docs-body li { margin: 0.25rem 0; }
.docs-body a { color: #2563eb; text-decoration: underline; }
.docs-body a:hover { text-decoration: none; }
.docs-body img { max-width: 100%; height: auto; margin: 1rem 0; border-radius: 0.375rem; }
.docs-body table {
  border-collapse: collapse;
  margin: 1rem 0;
  width: 100%;
  font-size: 0.875rem;
}
.docs-body th,
.docs-body td {
  border: 1px solid #e5e7eb;
  padding: 0.5rem 0.75rem;
  text-align: left;
  vertical-align: top;
}
.docs-body th { background-color: #f9fafb; font-weight: 600; }
.docs-body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.875em;
  background-color: #f3f4f6;
  padding: 0.1rem 0.3rem;
  border-radius: 0.25rem;
}
.docs-body pre {
  margin: 1rem 0;
  padding: 0.875rem 1rem;
  border-radius: 0.5rem;
  overflow-x: auto;
  font-size: 0.875rem;
  line-height: 1.5;
}
.docs-body pre code {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
  font-size: inherit;
}

/* rouge github theme, scoped to .highlight (syntax highlighting for <pre>) */
.docs-body .highlight table td { padding: 5px; }
.docs-body .highlight table pre { margin: 0; }
.docs-body .highlight, .docs-body .highlight .w {
  color: #24292f;
  background-color: #f6f8fa;
}
.docs-body .highlight .k, .docs-body .highlight .kd, .docs-body .highlight .kn, .docs-body .highlight .kp, .docs-body .highlight .kr, .docs-body .highlight .kt, .docs-body .highlight .kv {
  color: #cf222e;
}
.docs-body .highlight .gr {
  color: #f6f8fa;
}
.docs-body .highlight .gd {
  color: #82071e;
  background-color: #ffebe9;
}
.docs-body .highlight .nb {
  color: #953800;
}
.docs-body .highlight .nc {
  color: #953800;
}
.docs-body .highlight .no {
  color: #953800;
}
.docs-body .highlight .nn {
  color: #953800;
}
.docs-body .highlight .sr {
  color: #116329;
}
.docs-body .highlight .na {
  color: #116329;
}
.docs-body .highlight .nt {
  color: #116329;
}
.docs-body .highlight .gi {
  color: #116329;
  background-color: #dafbe1;
}
.docs-body .highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.docs-body .highlight .kc {
  color: #0550ae;
}
.docs-body .highlight .l, .docs-body .highlight .ld, .docs-body .highlight .m, .docs-body .highlight .mb, .docs-body .highlight .mf, .docs-body .highlight .mh, .docs-body .highlight .mi, .docs-body .highlight .il, .docs-body .highlight .mo, .docs-body .highlight .mx {
  color: #0550ae;
}
.docs-body .highlight .sb {
  color: #0550ae;
}
.docs-body .highlight .bp {
  color: #0550ae;
}
.docs-body .highlight .ne {
  color: #0550ae;
}
.docs-body .highlight .nl {
  color: #0550ae;
}
.docs-body .highlight .py {
  color: #0550ae;
}
.docs-body .highlight .nv, .docs-body .highlight .vc, .docs-body .highlight .vg, .docs-body .highlight .vi, .docs-body .highlight .vm {
  color: #0550ae;
}
.docs-body .highlight .o, .docs-body .highlight .ow {
  color: #0550ae;
}
.docs-body .highlight .gh {
  color: #0550ae;
  font-weight: bold;
}
.docs-body .highlight .gu {
  color: #0550ae;
  font-weight: bold;
}
.docs-body .highlight .s, .docs-body .highlight .sa, .docs-body .highlight .sc, .docs-body .highlight .dl, .docs-body .highlight .sd, .docs-body .highlight .s2, .docs-body .highlight .se, .docs-body .highlight .sh, .docs-body .highlight .sx, .docs-body .highlight .s1, .docs-body .highlight .ss {
  color: #0a3069;
}
.docs-body .highlight .nd {
  color: #8250df;
}
.docs-body .highlight .nf, .docs-body .highlight .fm {
  color: #8250df;
}
.docs-body .highlight .err {
  color: #f6f8fa;
  background-color: #82071e;
}
.docs-body .highlight .c, .docs-body .highlight .ch, .docs-body .highlight .cd, .docs-body .highlight .cm, .docs-body .highlight .cp, .docs-body .highlight .cpf, .docs-body .highlight .c1, .docs-body .highlight .cs {
  color: #6e7781;
}
.docs-body .highlight .gl {
  color: #6e7781;
}
.docs-body .highlight .gt {
  color: #6e7781;
}
.docs-body .highlight .ni {
  color: #24292f;
}
.docs-body .highlight .si {
  color: #24292f;
}
.docs-body .highlight .ge {
  color: #24292f;
  font-style: italic;
}
.docs-body .highlight .gs {
  color: #24292f;
  font-weight: bold;
}