/* Minimal styling required for uicomponents guide */

.top-nav {
  z-index: 1;
}

/* Table of contents. (Manually adding it to every file is not elegant.) */
.toc { margin-top: 1em; }
/* Sidebar is sticky */
#toc-nav {
  position: sticky;
  top: 3rem;
  height: calc(100vh - 3rem);
  overflow-y: auto;
  min-width: 10rem;
  display: block;
}
/* Don't show the sidebar on small screens */
@media screen and (max-width: 640px) {
  #toc-nav {
    display: none;
  }
}
/* Highlight the current scrollspy level */
#toc-nav [data-level].active {
  color: #000;
  font-weight: bold;
}
#toc-nav [data-level] {
  padding: 0.1rem 0;
}
/* Second-level sidebar navigation entries should be smaller and indented. */
#toc-nav [data-level="l2"] {
  margin-left: 0.5rem;
  font-size: 80%;
  white-space: nowrap;
}

#theme-picker {
  z-index: 100;
  right: 0;
  top: 2.8rem;
}

/* The main contents section may go beyond the page. Don't extend page width for this. */
.show-source main { overflow-x: auto; }
.viewsource-wrapper pre { display: none; }
.show-source .viewsource-wrapper pre { display: block; }

/* Predefined background URL image */
.bg-img { background-image: url('bg.png'); }
.bg-img-sm { background-image: url('bg-small.png'); }

/* Container to demo overflows */
.o-box {
  font-size: 1.5em;
  width: 6em;
  height: 2.5em;
}
