/* DOC mobile navigation 2153-1; match the original drawer's 800px breakpoint. */
#doc-nav-backdrop,
#doc-nav-collapse { display: none; }

@media (max-width: 800px) {
  body.doc-mobile-nav-ready .sidebar {
    z-index: 901;
    max-width: calc(100vw - 56px);
    visibility: hidden;
    overscroll-behavior: contain;
    transition: transform .2s ease, visibility 0s .2s;
  }
  body.doc-mobile-nav-ready.menu-open .sidebar {
    visibility: visible;
    transition: transform .2s ease;
  }
  body.doc-mobile-nav-ready main { margin-left: 0; width: 100%; }
  body.doc-mobile-nav-ready .sidebar nav { overscroll-behavior: contain; }
  body.doc-mobile-nav-ready.menu-open #doc-nav-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 900;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: rgba(24, 37, 59, .28);
    touch-action: none;
    -webkit-tap-highlight-color: transparent;
  }
  body.doc-mobile-nav-ready.menu-open #doc-nav-collapse {
    display: flex;
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: 902;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 64px;
    padding: 0;
    margin: 0;
    border: 1px solid #dce5f1;
    border-left: 0;
    border-radius: 0 14px 14px 0;
    background: #f7faff;
    color: #316bba;
    box-shadow: 5px 2px 12px rgba(25, 48, 85, .12);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  #doc-nav-collapse span {
    display: block;
    width: 11px;
    height: 11px;
    margin-left: 5px;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
  }
  #doc-nav-collapse:active { background: #e6effc; }
  #doc-nav-collapse:focus-visible { outline: 3px solid #316bba; outline-offset: 2px; }
}
@media (max-width: 800px) and (prefers-reduced-motion: reduce) {
  body.doc-mobile-nav-ready .sidebar { transition: none; }
}
