/* Article sidebars: clean, flat, square.
   Applies only to a sidebar that FOLLOWS the article (guides, resources, citations,
   blog posts). Dashboard navs come before <main>, so they never match.
   Also undoes global.css's dashboard .sidebar (dark fill, 100vh, own scrollbar,
   off-canvas on phones), which these pages were inheriting by name. */

:is(article, .article, main) ~ :is(.sidebar, .side) {
  --cs-p: var(--p, var(--orange, #111827));
  --cs-line: #e5e7eb;
  background: none;
  height: auto;
  max-height: none;
  overflow: visible;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  gap: 28px;
  align-self: start;
  color: #374151;
}
@media (max-width: 900px) {
  :is(article, .article, main) ~ .sidebar {
    position: static; left: auto; top: auto; bottom: auto;
    width: auto; z-index: auto; transition: none;
  }
}

/* Every block: no boxes, no rounding, a hairline on top */
:is(article, .article, main) ~ :is(.sidebar, .side) > *,
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-card, .toc-box, .toc, .sidecard) {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--cs-line);
  border-radius: 0;
  box-shadow: none;
  padding: 16px 0 0;
  margin: 0;
  max-height: none;
  overflow: visible;
  text-align: left;
}

/* Block titles: small, quiet labels */
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-card-title, .sc-title, .toc-title, .s-title, .sidebar-card h4, .toc-box h4, .sidecard h3, .toc h4) {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #6b7280;
  border: 0;
  padding: 0;
  margin: 0 0 10px;
}

/* Plain link lists */
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-card, .toc-box, .toc, .sidecard) a {
  display: block;
  font-size: .88rem;
  line-height: 1.45;
  color: #374151;
  padding: 5px 0;
  border: 0;
  background: none;
  text-decoration: none;
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-card, .toc-box, .toc, .sidecard) a:hover,
:is(article, .article, main) ~ :is(.sidebar, .side) .toc a.active {
  color: var(--cs-p);
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-card, .sidecard) p {
  color: #6b7280; font-size: .86rem; line-height: 1.6; margin: 0 0 10px;
}

/* Call-to-action blocks: text plus one square button, no colour slab */
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) {
  border-top: 2px solid var(--cs-p);
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) :is(h3, h4, strong, .s-title) {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: #111827;
  margin: 0 0 6px;
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) p {
  color: #4b5563; font-size: .88rem; line-height: 1.6; margin: 0 0 14px;
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) a {
  display: block;
  background: var(--cs-p) !important;
  color: #fff !important;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 10px 14px;
  margin: 0 0 8px;
  font-size: .88rem;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  opacity: 1;
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) a:hover { filter: brightness(.92); }
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) a + a,
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.sidebar-cta, .cta-card, .side-cta) a.ghost {
  background: transparent !important;
  color: var(--cs-p) !important;
  border: 1px solid var(--cs-line);
  font-weight: 600;
}

/* Long tables of contents scroll quietly instead of running the page length */
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.toc, .toc-box) {
  max-height: min(60vh, 520px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #d1d5db transparent;
}
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.toc, .toc-box)::-webkit-scrollbar { width: 4px; }
:is(article, .article, main) ~ :is(.sidebar, .side) :is(.toc, .toc-box)::-webkit-scrollbar-thumb { background: #d1d5db; }

/* Square thumbnails too */
:is(article, .article, main) ~ :is(.sidebar, .side) :is(img, .related-thumb) { border-radius: 0; }
