/* Blog-like article presentation plus compatibility for existing MediaWiki markup.
   Layout, controls, colors and spacing utilities come from the shared v8 Bootstrap. */
.sb-docs-article h1 {
  font-size: 2rem;
  line-height: 1.2;
}
.sb-docs-page .sb-nav-link {
  white-space: normal;
  overflow-wrap: anywhere;
}
.sb-docs-page .sb-nav-submenu {
  margin-left: 0.5rem;
}
.sb-docs-toggle {
  display: flex;
}
.sb-docs-content {
  display: flow-root;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.sb-docs-content h2,
.sb-docs-content h3,
.sb-docs-content h4 {
  margin: 1.75em 0 0.75em;
}
.sb-docs-content p,
.sb-docs-content ul,
.sb-docs-content ol {
  margin-bottom: 1em;
  font-weight: 300;
}
.sb-docs-content img {
  max-width: 100%;
  height: auto;
}
/* Reserve both margins when a screenshot fills the available mobile width. */
.sb-docs-content img.thumbborder {
  margin: 1em;
  max-width: calc(100% - 2em);
}
.sb-docs-content iframe,
.sb-docs-content object {
  max-width: 100%;
}
/* HttpImage articles use floatRight/floatLeft instead of MediaWiki thumbnail classes. */
.sb-docs-content .imageRight,
.sb-docs-content .tright,
.sb-docs-content .floatRight {
  float: right;
  margin: 0 0 1rem 1rem;
}
.sb-docs-content .imageLeft,
.sb-docs-content .tleft,
.sb-docs-content .floatLeft {
  float: left;
  margin: 0 1rem 1rem 0;
}
.sb-docs-content .thumbcaption {
  font-size: 0.875rem;
  color: var(--bs-secondary-color);
}
.sb-docs-content .imageRight,
.sb-docs-content .imageLeft {
  max-width: 40%;
}
.sb-docs-index h3 {
  font-weight: 600;
}
.sb-docs-index .col-12 > div > p:last-child {
  margin-bottom: 0;
}
/* CSS-only adapter for the shared wiki add-on template; its stored markup stays unchanged. */
.sb-docs-content .bot-addon {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
  gap: 1px;
  margin-bottom: 1.5rem;
  overflow: hidden;
  border: 1px solid var(--bs-border-color);
  border-radius: var(--sb-radius-card, 12px);
  background: var(--bs-border-color);
  font-size: 0.875rem;
}
.sb-docs-content .bot-addon > p:first-child {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.75rem 1rem;
  background: var(--bs-secondary-bg);
  font-weight: 600;
  color: var(--bs-emphasis-color);
}
.sb-docs-content .bot-addon > .block {
  min-width: 0;
  padding: 1rem;
  background: var(--sb-surface, #fff);
}
.sb-docs-content .bot-addon .title {
  margin-bottom: 0.5rem;
  font-weight: 600;
}
.sb-docs-content .bot-addon ul {
  margin: 0;
  padding-left: 1.1rem;
}
.sb-docs-content .bot-addon li + li {
  margin-top: 0.25rem;
}
/* The obsolete menu screenshot is decorative. Keep the actual add-on name as a native-looking menu item. */
.sb-docs-content
  .bot-addon
  .menu-demo
  > p:has(> img[src$="/74f094052447c7c1435d643e.png"]) {
  display: none;
}
.sb-docs-content .bot-addon .menu-demo .name {
  padding: 0.5rem 0.75rem;
  border-left: 3px solid var(--bs-primary);
  border-radius: var(--bs-border-radius-sm);
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-primary-text-emphasis);
  font-weight: 500;
}
.sb-docs-content pre,
.sb-docs-content #toc {
  padding: 1rem;
  overflow: auto;
  background: var(--bs-tertiary-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}
.sb-docs-content pre {
  white-space: pre-wrap;
}
.sb-docs-content #toc h2 {
  margin-top: 0;
  font-size: 1rem;
}
.sb-docs-content #toc ul {
  list-style: none;
  padding-left: 1rem;
}
.sb-docs-content .helpIndexTable {
  width: 100%;
  border-collapse: separate;
  border-spacing: 4px;
}
.sb-docs-content .helpIndexTable td {
  padding: 1rem;
  vertical-align: top;
  background: var(--bs-tertiary-bg);
}
.sb-docs-content .helpIndexTable th {
  width: 32px;
  vertical-align: top;
}
.sb-docs-content .helpIndexTable .colSpanner {
  font-weight: 500;
  color: var(--bs-primary);
}
.sb-docs-content .helpIndexTable p:last-child {
  margin-bottom: 0;
}
.sb-docs-content .printfooter {
  display: none;
}
.sb-docs-content .visualClear {
  clear: both;
}
/* Follow the blog's public-layout breakpoint, not the account sidebar breakpoint. */
@media (min-width: 651px) {
  .sb-docs-toggle {
    display: none;
  }
  #docs-navigation.collapse {
    display: block;
  }
}
@media (max-width: 650px) {
  /* Keep introductory text readable rather than squeezed beside an illustration. */
  .sb-docs-content img.floatRight,
  .sb-docs-content img.floatLeft {
    float: none;
    display: block;
    margin: 0 0 1rem;
  }
  .sb-docs-content .helpIndexTable,
  .sb-docs-content .helpIndexTable tbody {
    display: block;
  }
  .sb-docs-content .helpIndexTable tr {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 4px;
  }
  .sb-docs-content .helpIndexTable td {
    width: 100%;
    min-width: 0;
  }
  .sb-docs-content .helpIndexTable th {
    width: 100%;
    text-align: left;
  }
  .sb-docs-content .helpIndexTable th img {
    max-height: 96px;
  }
}
@media print {
  .sb-public-header,
  .sb-public-sidebar,
  .sb-docs-page > footer {
    display: none;
  }
  .sb-public-layout {
    display: block;
  }
  .sb-docs-article {
    border: 0;
  }
}