/* Project docs overrides on top of Asciidoctor's built-in HTML5 stylesheet.
   Keep this file small: sidebar behavior, disclosure arrows, active state,
   spacing, scrolling, responsive tables/code. No framework. */

#toc,
#toc.toc2 {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 19rem;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0.75rem 0.5rem 2rem 0.75rem;
  border-right: 1px solid #ddd;
  background: #fafafa;
  font-size: 0.85rem;
  line-height: 1.35;
}

#toc .nav-controls {
  display: flex;
  gap: 0.5rem;
  padding: 0.25rem 0.25rem 0.5rem 1.25rem;
}

#toc .nav-controls button {
  background: none;
  border: 1px solid #ccc;
  border-radius: 3px;
  font-size: 0.72rem;
  padding: 0.1rem 0.45rem;
  cursor: pointer;
  color: #444;
}

#toc .nav-controls button:hover,
#toc .nav-controls button:focus-visible {
  border-color: #888;
  color: #111;
  outline: 2px solid #7aa7c7;
  outline-offset: 1px;
}

#toc ul {
  list-style: none;
  margin: 0;
  padding-left: 1rem;
}

#toc > ul {
  padding-left: 0;
}

#toc li {
  margin: 0;
  padding: 0;
}

#toc li > .nav-row {
  display: flex;
  align-items: baseline;
  gap: 0.15rem;
}

#toc button.disclosure {
  flex: 0 0 1.1rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #666;
  font-size: 0.75rem;
  padding: 0.15rem 0;
  line-height: 1.2;
}

#toc button.disclosure:hover,
#toc button.disclosure:focus-visible {
  color: #111;
  outline: 2px solid #7aa7c7;
  outline-offset: 1px;
}

#toc li > .nav-row > a {
  flex: 1;
  display: inline;
  padding: 0.12rem 0.25rem;
  color: #333;
  text-decoration: none;
  border-left: 2px solid transparent;
}

#toc li > .nav-row > a:hover {
  text-decoration: underline;
}

#toc li > .nav-row > a.active {
  font-weight: 600;
  color: #111;
  border-left-color: #7a0000;
  background: #f0ece6;
}

#toc li.collapsed > ul {
  display: none;
}

/* Asciidoctor's default stylesheet already offsets the body for a left TOC
   (15em, 20em on wide screens). We position the content ourselves, so
   neutralize that to avoid a double offset (wide gap between sidebar
   and content). This loads after the default style, so it wins. */
body.toc2 {
  padding-left: 0;
  padding-right: 0;
}

/* Main document sits beside the fixed sidebar (desktop default). */
#header,
#content,
#footer {
  margin-left: 19rem;
  max-width: 52rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

body {
  background: #fff;
}

/* Dense but readable engineering tables. Keep native table layout:
   display:block on a <table> collapses it to one column. */
table.tableblock {
  width: 100%;
  font-size: 0.85rem;
}

table.tableblock th,
table.tableblock td {
  padding: 0.35rem 0.55rem;
}

.listingblock > .content > pre {
  overflow-x: auto;
  font-size: 0.82rem;
  line-height: 1.45;
}

/* Figure captions look like a datasheet. */
.imageblock .title {
  font-size: 0.8rem;
  color: #555;
  text-align: center;
}

/* Technical hyperlinks: restrained, underline on interaction only. */
#content a {
  text-decoration: none;
}

#content a:hover {
  text-decoration: underline;
}

@media (max-width: 768px) {
  #toc,
  #toc.toc2 {
    position: static;
    width: auto;
    max-height: 45vh;
    border-right: none;
    border-bottom: 1px solid #ddd;
  }

  #header,
  #content,
  #footer {
    margin-left: 0;
    max-width: none;
  }
}