/* Bootstrap (Bootswatch "Flatly") handles layout/components - this file
   is only the bits Bootstrap doesn't cover: the floating feedback widget,
   Mermaid content spacing, and screenshot thumbnails. */

.feedback-widget { z-index: 1040; max-width: calc(100vw - 2rem); }
.feedback-widget summary { list-style: none; cursor: pointer; }
.feedback-widget summary::-webkit-details-marker { display: none; }
.feedback-card { width: 320px; max-width: calc(100vw - 2rem); max-height: 75vh; overflow-y: auto; }
.feedback-canvas { width: 100%; cursor: crosshair; }

.content-body { line-height: 1.6; }
.content-body pre:not(.mermaid) { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); padding: 0.7rem; overflow-x: auto; font-size: 0.85rem; }
/* A wide C4/ER diagram otherwise renders at its full intrinsic SVG width and
   overflows a phone-width viewport - scope the scroll to the diagram itself
   (overflow-x) rather than letting it force horizontal scroll on the whole
   page, and cap the SVG so it never renders wider than its own container. */
.content-body pre.mermaid { background: transparent; text-align: center; overflow-x: auto; }
.content-body pre.mermaid svg { max-width: 100%; }

.screenshot-thumb { max-width: 80px; max-height: 50px; border-radius: 4px; }

.help-section > summary { cursor: pointer; }

/* A leading YAML frontmatter block (see content.py's _extract_frontmatter) -
   rendered as a collapsible key/value panel ahead of the real Markdown body,
   visually distinct from it rather than looking like more prose. */
.content-frontmatter { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: 6px; padding: 0.6rem 0.9rem; margin-bottom: 1rem; font-size: 0.85rem; }
.content-frontmatter > summary { cursor: pointer; font-weight: 600; }
.content-frontmatter dl { margin: 0.5rem 0 0; }
.content-frontmatter dt { font-weight: 600; margin-top: 0.4rem; }
.content-frontmatter dd { margin-left: 1rem; }
.content-frontmatter dl dl, .content-frontmatter dl ul { margin-left: 1rem; }