/* ── Responsive tables ──
   JS (mobile-menu.js) wraps every content table in:
     <div class="table-scroll-wrapper"><table>…</table></div>
   The wrapper scrolls horizontally; the table keeps display:table so
   borders, zebra-striping and column widths all stay correct.
   ─────────────────────────────────────────────────────────────────── */

/* Wrapper is always added by JS — sits on all screen sizes */
.table-scroll-wrapper {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* smooth momentum scroll on iOS */
}

/* ── Mobile only: make wrapper scroll ──────────────────────────────── */
@media (max-width: 900px) {


  /* Stop cells from wrapping text so each column keeps its natural
     width and the table can actually overflow the wrapper.      */
  .table-scroll-wrapper td,
  .table-scroll-wrapper th {
    white-space: nowrap;
    min-width: 25px;
  }
}

/* ── Page title block ── */
@media (max-width: 900px) {
  .block-page-title-block h1,
  .block-page-title-block .page-title {
    font-size: 1.45rem;
    line-height: 1.25;
    word-break: break-word;
  }
}

/* ── Book module inline navigation (parent-page link above content) ──
   Drupal's book module injects an "up" link to the parent book page
   inside the node content. Style it as a small breadcrumb line so it
   doesn't look like a secondary giant headline.
   ------------------------------------------------------------------ */
.book-navigation,
.node .book-navigation {
  font-size: 0.82em;
  margin: 0 0 0.75em;
  padding: 0;
}
.book-navigation a,
.node .book-navigation a {
  color: #529ad6;
  text-decoration: none;
}
.book-navigation a:hover,
.node .book-navigation a:hover {
  text-decoration: underline;
}
/* Prev/next links at the bottom of book pages */
.book-navigation .pager,
.book-navigation nav {
  font-size: 0.85em;
  border-top: 1px solid #d3e7f4;
  padding-top: 0.75em;
  margin-top: 1em;
}

/* ── Nodes ── */
@media (max-width: 900px) {
  #center .node h2 { font-size: 1.4rem; line-height: 1.25; }
  #center .submitted { font-size: 0.82em; }
  #center img { max-width: 100%; height: auto; }

  #sidebar-left .block .content,
  #sidebar-right .block .content {
    font-size: 0.9em;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }

  #sidebar-left ul, #sidebar-right ul { margin: 0.35em 0 0.8em; padding-left: 18px; }
  #sidebar-left li, #sidebar-right li { margin: 0.2em 0; padding: 0; background: none; }
}

@media (max-width: 640px) {
  #center .node h2 { font-size: 1.2rem; }
}
