:root {
  /*****************************************************************************
  * Theme config
  **/
  --pst-header-height: 45px;
  /* smaller then heading font sizes*/
  --pst-font-size-milli: 12px;
  --pst-sidebar-font-size: 0.9em;
  --pst-sidebar-caption-font-size: 0.9em;
  /*****************************************************************************
  * Color
  *
  * Colors are defined in rgb string way, "red, green, blue"
  **/
  --pst-color-success: 40, 167, 69;
  --pst-color-info: 0, 123, 255;
  /*23, 162, 184;*/
  --pst-color-danger: 220, 53, 69;
  --pst-color-headerlink: 198, 15, 15;
  --pst-color-headerlink-hover: 255, 255, 255;
  --pst-color-preformatted-text: 34, 34, 34;
  --pst-color-preformatted-background: 250, 250, 250;
  --pst-color-inline-code: 232, 62, 140;
  --pst-color-active-navigation: 19, 6, 84;
  --pst-color-navbar-link: 77, 77, 77;
  --pst-color-navbar-link-hover: var(--pst-color-active-navigation);
  --pst-color-navbar-link-active: var(--pst-color-active-navigation);
  --pst-color-sidebar-link: 77, 77, 77;
  --pst-color-sidebar-link-hover: var(--pst-color-active-navigation);
  --pst-color-sidebar-link-active: var(--pst-color-active-navigation);
  --pst-color-sidebar-expander-background-hover: 244, 244, 244;
  --pst-color-sidebar-caption: 77, 77, 77;
  --pst-color-toc-link: 119, 117, 122;
  --pst-color-toc-link-hover: var(--pst-color-active-navigation);
  --pst-color-toc-link-active: var(--pst-color-active-navigation);
  /*****************************************************************************
  * Icon
  **/
  /* font awesome icons*/
  --pst-icon-check-circle: "\f058";
  --pst-icon-info-circle: "\f05a";
  --pst-icon-exclamation-triangle: "\f071";
  --pst-icon-exclamation-circle: "\f06a";
  --pst-icon-times-circle: "\f057";
  --pst-icon-lightbulb: "\f0eb";
  /*****************************************************************************
  * Admonitions
  **/
  --pst-color-admonition-default: var(--pst-color-info);
  --pst-color-admonition-note: var(--pst-color-info);
  --pst-color-admonition-attention: var(--pst-color-warning);
  --pst-color-admonition-caution: var(--pst-color-warning);
  --pst-color-admonition-warning: var(--pst-color-warning);
  --pst-color-admonition-danger: var(--pst-color-danger);
  --pst-color-admonition-error: var(--pst-color-danger);
  --pst-color-admonition-hint: var(--pst-color-success);
  --pst-color-admonition-tip: var(--pst-color-success);
  --pst-color-admonition-important: var(--pst-color-success);
  --pst-icon-admonition-default: var(--pst-icon-info-circle);
  --pst-icon-admonition-note: var(--pst-icon-info-circle);
  --pst-icon-admonition-attention: var(--pst-icon-exclamation-circle);
  --pst-icon-admonition-caution: var(--pst-icon-exclamation-triangle);
  --pst-icon-admonition-warning: var(--pst-icon-exclamation-triangle);
  --pst-icon-admonition-danger: var(--pst-icon-exclamation-triangle);
  --pst-icon-admonition-error: var(--pst-icon-times-circle);
  --pst-icon-admonition-hint: var(--pst-icon-lightbulb);
  --pst-icon-admonition-tip: var(--pst-icon-lightbulb);
  --pst-icon-admonition-important: var(--pst-icon-exclamation-circle);
}

/* Mobile First Approach */
.bd-page-width {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  margin: 0 auto;
}

/* Tablet */
@media (min-width: 768px) {
  .bd-page-width {
    padding: 20px;
    max-width: 95%;
  }
}

/* Desktop */
@media (min-width: 960px) {
  .bd-page-width {
    max-width: 90%;
    padding: 20px;
  }
}

/* Mobile Sidebar */
.bd-sidebar-primary {
  width: 100%;
  height: 100vh;
  position: fixed;
  z-index: 1050;
  top: 0;
  left: -100%;
  overflow-y: auto;
  padding: 1rem;
  box-sizing: border-box;
  background: white;
  transition: left 0.3s ease-in-out;
}

.bd-sidebar-primary.show {
  left: 0;
}

/* Tablet and Desktop Sidebar */
@media (min-width: 960px) {
  .bd-sidebar-primary {
    flex: 0 0 20%;
    min-width: 250px;
    max-width: 400px;
    width: 20%;
    position: sticky;
    left: 0;
    top: var(--pst-header-height);
    height: calc(100vh - var(--pst-header-height));
    overflow-y: auto;
    overflow-x: auto;
    border-right: 1px solid var(--pst-color-border);
    resize: horizontal;
    padding: 2rem 1rem 1rem;
    -webkit-overflow-scrolling: touch;
  }

  .bd-sidebar-primary .bd-links__item {
    white-space: normal;
    word-wrap: break-word;
  }

  .bd-sidebar-primary::-webkit-scrollbar {
    width: 6px;
  }

  .bd-sidebar-primary::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
  }
}

/* Main Content */
.bd-main .bd-content .bd-article-container {
  max-width: 100%;
  padding: 1rem;
  margin: 0 auto;
}

/* Navigation Toggle Button */
.navbar-toggler {
  display: block;
  position: fixed;
  top: 10px;
  right: 10px;
  padding: 0.25rem 0.75rem;
  font-size: 1.25rem;
  line-height: 1;
  border: none;
  border-radius: 0.25rem;
  z-index: 1060;
  background: transparent;
}

@media (min-width: 960px) {
  .navbar-toggler {
    display: none;
  }
}

/* Hide Section Navigation Title */
nav.bd-links p.bd-links__title {
  display: none;
}

/* Hide Search Button */
.navbar-persistent--container {
  display: none;
}

/* Navbar */
.navbar {
  background: #0095ca !important;
  position: sticky;
  top: 0;
  z-index: 2000;
  width: 100%;
}

/* Video Container */
.video {
  text-align: center;
  position: relative;
  padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}