/* Cratermaker Branding Guide:
Primary Color Palette (Hex):
  - Charcoal Gray: #414042
  - Blue Gray:     #4a5a6a
  - Slate Blue:    #32485e
  - Steel Gray:    #53565a

Secondary Color Palette (Hex):
  - Fog Gray:      #c2c4c6
  - Mist Blue:     #a8b0b8
  - Light Slate:   #d0d4d8
  - Pale Smoke:    #e0e2e4

Primary Typeface: Acumin Variable Concept - Semicondensed Medium
*/

:root {
  --cm-charcoal-gray: #414042;
  --cm-blue-gray: #4a5a6a;
  --cm-slate-blue: #40668d;
  --cm-steel-gray: #53565a;

  --cm-fog-gray: #c2c4c6;
  --cm-mist-blue: #a8b0b8;
  --cm-light-slate: #d0d4d8;
  --cm-pale-smoke: #e0e2e4;

  --cm-font-family: "Acumin Variable Concept", sans-serif;

  /* Optional overrides for pydata-sphinx-theme */
  --pst-color-primary: var(--cm-charcoal-gray);
  --pst-color-secondary: var(--cm-fog-gray);
  --pst-font-family-base: var(--cm-font-family);
}

table.colwidths-given {
    table-layout: fixed;
    width: 100%;
}
table.docutils td {
    white-space: unset;
    word-wrap: break-word;
}

div.bd-header-announcement {
  background-color: unset;
}

/* Reduce left and right margins */

.container, .container-lg, .container-md, .container-sm, .container-xl {
  max-width: 1350px !important;
}

/* The following was found at https://stackoverflow.com/a/77588233 */

/* -- .bd-container and .bd-container__inner both need to adjust ---------- */
/* -- this so 'outer container' grows with browser (no L/R 'dead space') -- */
.bd-container {
  max-width: 99%;
}

/* -- this so the 'inner container' fills the outer container -------------- */
.bd-container .bd-container__inner {
  max-width: 99%;
}

/* -- .bd-article-container holds the "text in the middle" (notebook / md) ------ */
/* -- width is as high as as 100 "ems" (characters) wide, scales with font size -*/
.bd-main .bd-content .bd-article-container {
  max-width: 100em;
}


/* Copied from
https://github.com/bokeh/bokeh/blob/branch-2.4/sphinx/source/bokeh/static/custom.css
*/

:root {
  /* Logo image height + all the paddings/margins make the navbar height. */
  --navbar-height: calc(30px + 0.3125rem * 2 + 0.5rem * 2);
}

.bd-search {
  position: relative;
  padding-bottom: 20px;
}

@media (min-width: 768px) {
  .search-front-page {
    width: 50%;
  }
}

/* minimal copy paste from bootstrap docs css to get sidebars working */

.bd-toc {
  -ms-flex-order: 2;
  order: 2;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  /* font-size: 0.875rem; */
  /* add scrolling sidebar */
  height: calc(100vh - 2rem);
  overflow-y: auto;
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
  .bd-toc {
    position: -webkit-sticky;
    position: sticky;
    top: 4rem;
    height: calc(100vh - 4rem);
    overflow-y: auto;
  }
}

.section-nav {
  padding-left: 0;
  border-left: 1px solid var(--cm-pale-smoke);
  border-bottom: none;
}

.section-nav ul {
  padding-left: 1rem;
}

.toc-entry {
  display: block;
}

.toc-entry a {
  display: block;
  padding: 0.125rem 1.5rem;
  color: var(--cm-blue-gray);
}

.toc-entry a:hover {
  color: rgba(0, 0, 0, 0.85);
  text-decoration: none;
}

.bd-sidebar {
  -ms-flex-order: 0;
  order: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

@media (min-width: 768px) {
  .bd-sidebar {
    border-right: 1px solid rgba(0, 0, 0, 0.1);
  }
  @supports ((position: -webkit-sticky) or (position: sticky)) {
    .bd-sidebar {
      position: -webkit-sticky;
      position: sticky;
      top: var(--navbar-height);
      z-index: 1000;
      height: calc(100vh - var(--navbar-height));
    }
  }
}

@media (min-width: 1200px) {
  .bd-sidebar {
    -ms-flex: 0 1 480px;
    flex: 0 1 480px;
  }
}

.bd-links {
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-right: -15px;
  margin-left: -15px;
}

@media (min-width: 768px) {
  @supports ((position: -webkit-sticky) or (position: sticky)) {
    .bd-links {
      max-height: calc(100vh - 9rem);
      overflow-y: auto;
    }
  }
}

@media (min-width: 768px) {
  .bd-links {
    display: block !important;
  }
}

.bd-sidenav {
  display: none;
}

.bd-toc-link {
  display: block;
  padding: 0.25rem 1.5rem;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.65);
}

.bd-toc-link:hover {
  color: rgba(0, 0, 0, 0.85);
  text-decoration: none;
}

.bd-toc-item.active {
  margin-bottom: 1rem;
}

.bd-toc-item.active:not(:first-child) {
  margin-top: 1rem;
}

.bd-toc-item.active > .bd-toc-link {
  color: rgba(0, 0, 0, 0.85);
}

.bd-toc-item.active > .bd-toc-link:hover {
  background-color: transparent;
}

.bd-toc-item.active > .bd-sidenav {
  display: block;
}

.bd-sidebar .nav > li > a {
  display: block;
  padding: 0.25rem 1.5rem;
  font-size: 90%;
}

.bd-sidebar .nav > li > a:hover {
  text-decoration: none;
  background-color: transparent;
}

.bd-sidebar .nav > .active > a,
.bd-sidebar .nav > .active:hover > a {
  font-weight: 400;
  /* adjusted from original
  color: rgba(0, 0, 0, 0.85);
  background-color: transparent; */
}

.bd-sidebar .nav > li > ul {
  list-style: none;
  padding: 0.25rem 1.5rem;
}

.bd-sidebar .nav > li > ul > li > a {
  display: block;
  padding: 0.25rem 1.5rem;
  font-size: 90%;
}

.bd-sidebar .nav > li > ul > .active > a,
.bd-sidebar .nav > li > ul > .active:hover > a {
  font-weight: 400;
}

dt:target {
  background-color: initial;
}

/* Offsetting anchored elements within the main content to adjust for fixed header
 https://github.com/pandas-dev/pandas-sphinx-theme/issues/6 */
main *:target::before {
  display: block;
  content: '';
  height: var(--navbar-height);
  margin-top: calc(-1 * var(--navbar-height));
}

body {
  font-family: var(--cm-font-family);
  /* Add padding to body to avoid overlap with navbar. */
  padding-top: var(--navbar-height);
  width: 100%;
}

/* adjust toc font sizes to improve overview */
.toc-h2 {
  font-size: 0.85rem;
}

.toc-h3 {
  font-size: 0.75rem;
}

.toc-h4 {
  font-size: 0.65rem;
}

.toc-entry > .nav-link.active {
  font-weight: 400;
  color: var(--cm-slate-blue);
  background-color: transparent;
  border-left: 2px solid var(--cm-fog-gray);
}

.nav-link:hover {
  border-style: none;
}

/* Collapsing of the TOC sidebar while scrolling */

/* Nav: hide second level (shown on .active) */
.bd-toc .nav .nav {
  display: none;
}

.bd-toc .nav > .active > ul {
  display: block;
}

/* Main index page overview cards */

.sd-card-img-top {
  width: 33% !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}

/* Hide ToC on mobile */
@media (max-width: 1200px) {
  .bd-sidebar-secondary {
    display: none;
  }

  .bd-sidebar-secondary.active .bd-toc.active {
    display: block;
  }

  .article-header-buttons .sidebar-toggle {
    display: block;
  }

  label.sidebar-toggle.primary-toggle {
    display: none;
  }
  label.sidebar-toggle.secondary-toggle {
    display: inline-block; /* or 'block', depending on desired layout */
  }
}

/* Global link styling with theme awareness */
[data-theme="light"] a {
  color: var(--cm-slate-blue);
}

[data-theme="light"] a:hover,
[data-theme="light"] a:focus {
  color: var(--cm-blue-gray);
  text-decoration: underline;
}

[data-theme="dark"] a {
  color: var(--cm-blue-gray);
}

[data-theme="dark"] a:hover,
[data-theme="dark"] a:focus {
  color: var(--cm-fog-gray);
  text-decoration: underline;
}

/* Announcement banner theme-specific colors */
[data-theme="light"] .bd-header-announcement {
  color: var(--cm-mist-blue);
}

[data-theme="dark"] .bd-header-announcement {
  color: var(--cm-blue-gray);
}


html[data-theme="light"] .bd-footer .prev-next-area a p.prev-next-title  {
  background-color: transparent !important;
  border-color: var(--cm-slate-blue) !important;
}

html[data-theme="dark"] .bd-footer .prev-next-area a p.prev-next-title {
  background-color: transparent !important;
  border-color: var(--cm-blue-gray) !important;
}

/* Previous/Next link colors override */
[data-theme="light"] .bd-footer .prev-next-area a {
  color: var(--cm-slate-blue) !important;
}

[data-theme="light"] .bd-footer .prev-next-area a:hover {
  color: var(--cm-blue-gray) !important;
}

[data-theme="dark"] .bd-footer .prev-next-area a {
  color: var(--cm-blue-gray) !important;
}

[data-theme="dark"] .bd-footer .prev-next-area a:hover {
  color: var(--cm-fog-gray) !important;
}