/* btview docs — small overrides on top of Material.
 *
 * The site is mostly terminal output, so the priorities are a code font that keeps box
 * drawing aligned, and code blocks that read as "this is a screen" rather than "this is
 * a snippet to copy".
 */

:root {
  --md-code-font: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Terminal captures are wide. Let them scroll rather than wrap — a wrapped tree is
   unreadable, which is the same reason `btview --graph` never wraps. */
.md-typeset pre > code {
  white-space: pre;
  overflow-x: auto;
}

.md-typeset code,
.md-typeset pre > code {
  font-size: 0.72rem;
  line-height: 1.5;
}

/* The glyph tables (status and node-kind legends) read better centred and compact. */
.md-typeset table:not([class]) td code {
  white-space: nowrap;
}

/* Landing-page hero. */
.btview-hero {
  text-align: center;
  padding: 1.2rem 0 0.4rem;
}

.btview-hero h1 {
  font-weight: 700;
  margin-bottom: 0.2rem;
}

.btview-hero .btview-tagline {
  font-size: 1.05rem;
  color: var(--md-default-fg-color--light);
  margin-top: 0;
}

.btview-hero img {
  border-radius: 6px;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.22);
  margin-top: 1rem;
}

/* Badge row: keep them on one line and stop them inheriting link underlines. */
.btview-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: center;
  margin: 0.6rem 0 0.2rem;
}

.btview-badges img {
  box-shadow: none;
  border-radius: 3px;
  margin: 0;
}

/* Cards on the landing page. Material ships .grid.cards; this only softens it. */
.md-typeset .grid.cards > ul > li {
  border-radius: 6px;
}

.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--md-accent-fg-color);
}