/*!
 *  This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
 *  See the accompanying LICENSE file for applicable licenses.
 */

:root {
  --dita-prussian-blue: #1d365d;
  --dita-maroon: #800000;
  --dita-violet: var(--bs-purple);
}

[data-bs-theme='dark'] {
  --dita-prussian-blue: #6a91cf;
  --dita-violet: #cc99cd;
  --dita-maroon: #ff7676;
}

.bs-toggler-dark,
.bs-toggler-light {
  display: none;
}

[data-bs-theme='light'] .bs-toggler-light {
  display: inherit;
}

[data-bs-theme='light'] .bs-toggler-auto {
  display: none;
}

[data-bs-theme='dark'] .bs-toggler-dark {
  display: inherit;
}

[data-bs-theme='dark'] .bs-toggler-auto {
  display: none;
}

@media (prefers-color-scheme: dark) {
  :root {
    --dita-prussian-blue: #6a91cf;
    --dita-violet: #cc99cd;
    --dita-maroon: #ff7676;
  }

  [data-bs-theme='light'] {
    --dita-prussian-blue: #1d365d;
    --dita-maroon: #800000;
    --dita-violet: var(--bs-purple);
  }
}

.syntaxdiagram {
  color: var(--dita-maroon);
}

.numcharref,
.parameterentity,
.textentity,
.xmlatt,
.xmlelement,
.xmlnsname,
.xmlpi {
  color: var(--dita-violet);
  font-family: var(--bs-font-monospace);
}

.cmdname,
.codeph,
.filepath,
.option,
.parmname {
  color: var(--bs-code-color);
  font-family: var(--bs-font-monospace);
}

.cmdname,
.parmname {
  color: var(--dita-prussian-blue);
  font-weight: bold;
}

.boolean {
  color: var(--bs-green);
}

.state {
  color: var(--bs-red);
}

.navbar-brand > svg {
  margin: 4px 6px;
  vertical-align: text-top;
}

.bs-container {
  margin: 3rem auto;
}

.bs-sidebar-nav {
  overflow: auto;
}

.bs-header {
  z-index: 1020;
}

/* [type='search'] {
  background: var(--bs-nav-link-hover-color);
} */

[type='search']::placeholder {
  color: #6a91cf !important;
}

/*!
 *  This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
 *  See the accompanying LICENSE file for applicable licenses.
 */

/*! These values define the relative width of the
 *  main content window compared with the sidebar-nav
 */

.bs-container {
  display: grid;
  gap: 1.5rem;
  grid-template-areas: 'sidebar main';
  grid-template-columns: 2fr 7fr;
  /* grid-template-columns: 2.5fr 7fr; */
  /* grid-template-columns:  22% 80%; */
}

.bs-sidebar {
  grid-area: sidebar;
}

.bs-main {
  grid-area: main;
}

.bs-content {
  grid-area: content;
  min-width: 1px;
}

.bs-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

@media (max-width: 991.98px) {
  .bs-main {
    max-width: 760px;
    margin-inline: auto;
  }
}

@media (min-width: 768px) {
  .bs-main {
    display: grid;
    grid-template-areas: 'content';
    grid-template-rows: auto auto 1fr;
    gap: inherit;
  }
}

@media (min-width: 992px) {
  .bs-main {
    grid-template-areas: 'content';
    grid-template-rows: auto 1fr;
  }

  .codeblock {
    max-width: calc(80vw - 2rem);
    min-width: 100%;
  }

  .bs-sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    display: block !important;
    height: calc(100vh - 6rem);
    padding-left: 0.25rem;
    margin-left: -0.25rem;
    overflow-y: auto;
  }
}

@media (max-width: 991.98px) {
  .bd-navbar .bd-navbar-toggle {
    width: 4.25rem;
  }

  .bs-container {
    grid-template-columns: 0fr 1fr;
  }

  .codeblock {
    max-width: calc(100vw - 11rem);
    min-width: 100%;
  }

  .bs-sidebar .offcanvas-lg {
    border-right-color: var(--bs-border-color);
  }
}
@media (min-width: 992px){
  .offcanvas-lg .offcanvas-body {
    display: block;
  }
}

/*!
 *  This file is part of the DITA Bootstrap plug-in for DITA Open Toolkit.
 *  See the accompanying LICENSE file for applicable licenses.
 */

/*! These values define the relative width of the
 *  main content window compared with the sidebar-nav
 */

.bd-links {
  overflow: auto;
  font-weight: 600;
  padding-left: none;
}

.bd-links a {
  padding: 0.1875rem 0.5rem;
  margin-top: 0.125rem;
  text-decoration: none;
  color: var(--bs-body-color);
}

.bd-links a:hover {
  color: var(--bs-link-hover-color);
}

.bd-links span {
  color: var(--bs-body-color);
}

.bd-links span:hover {
  color: var(--bs-link-hover-color);
}

@media (min-width: 768px) {
  .bd-links {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    display: block !important;
    height: calc(100vh - 7rem);
    padding-left: 0.25rem;
    margin-left: -0.25rem;
    overflow-y: auto;
  }
}

@media (max-width: 767.98px) {
  .bd-links > ul {
    padding: 1.5rem 0.75rem;
    background-color: var(--bs-body-bg);
    /* border-bottom: 1px solid; */
    /* border-bottom-color: var(--bs-body-color); */
  }
}

.bd-links li li a {
  font-size: 0.875em;
}

.bd-links .btn {
  padding-top: 0.25rem;
  font-weight: 600;
  background-color: transparent;
  border: 0;
  box-shadow: none;
  color: var(--bs-body-color);
}

.bd-links svg:hover {
  color: var(--bs-link-hover-color);
}

[dir='rtl'] .bd-links svg {
  transform: rotate(180deg);
}

.bd-links .btn[aria-expanded='true'] svg {
  transform: rotate(90deg);
}

.bd-links .btn:focus-visible {
  outline: 2px solid;
  outline-color: var(--bs-link-hover-color);
}

.bd-links .active {
  font-weight: 600;
  color: var(--bs-body-color);
}