/* ================================================================
   APNEA Knowledge Publications v1.1.4
   JS-managed sticky navigation for desktop, tablet and mobile.
   This intentionally does not depend on CSS position:sticky because
   WordPress/theme ancestor overflow and transforms can disable it.
   ================================================================ */

.apnea-publication-single .apnea-article-page,
.apnea-publication-single .apnea-article-main,
.apnea-publication-single .apnea-article-layout {
  overflow: visible !important;
}

.apnea-publication-single .apnea-article-main {
  position: relative !important;
}

/* ================================================================
   DESKTOP TOC
   ================================================================ */
@media (min-width: 1025px) {
  .apnea-publication-single .apnea-article-aside {
    display: block !important;
    position: relative !important;
    align-self: stretch !important;
    min-width: 0;
  }

  .apnea-publication-single .apnea-article-aside-inner {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
    width: 100%;
    max-height: calc(100vh - var(--apnea-fixed-header-height, 84px) - 52px);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(15, 139, 141, .35) transparent;
    padding-right: 8px;
  }

  .apnea-publication-single .apnea-article-aside-inner.is-apnea-toc-fixed {
    position: fixed !important;
    z-index: 120 !important;
    margin: 0 !important;
  }

  .apnea-publication-single .apnea-article-aside-inner.is-apnea-toc-bottom {
    position: absolute !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1 !important;
    margin: 0 !important;
  }

  .apnea-publication-single .apnea-article-aside-inner::-webkit-scrollbar {
    width: 5px;
  }

  .apnea-publication-single .apnea-article-aside-inner::-webkit-scrollbar-thumb {
    background: rgba(15, 139, 141, .28);
    border-radius: 999px;
  }

  .apnea-publication-single .apnea-article-mobile-toc-slot {
    display: none !important;
  }

  .apnea-publication-single .apnea-article-content h2,
  .apnea-publication-single .apnea-article-content h3,
  .apnea-publication-single .apnea-article-content h4 {
    scroll-margin-top: calc(var(--apnea-fixed-header-height, 84px) + 30px) !important;
  }

  body.admin-bar.apnea-publication-single .apnea-article-content h2,
  body.admin-bar.apnea-publication-single .apnea-article-content h3,
  body.admin-bar.apnea-publication-single .apnea-article-content h4 {
    scroll-margin-top: calc(var(--apnea-fixed-header-height, 84px) + 62px) !important;
  }
}

/* ================================================================
   TABLET + MOBILE TOC
   ================================================================ */
@media (max-width: 1024px) {
  .apnea-publication-single {
    --apnea-publication-toc-gap: 16px;
    --apnea-publication-toc-height: 78px;
  }

  .apnea-publication-single .apnea-article-aside {
    display: none !important;
  }

  .apnea-publication-single .apnea-article-mobile-toc-slot {
    display: block !important;
    position: relative !important;
    width: min(calc(100% - 48px), var(--apnea-container, 1240px));
    min-height: var(--apnea-publication-toc-height);
    margin: 0 auto 34px;
    overflow: visible !important;
  }

  .apnea-publication-single .apnea-article-mobile-toc-shell {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100%;
    z-index: 99990 !important;
    isolation: isolate;
  }

  .apnea-publication-single .apnea-article-mobile-toc-shell.is-apnea-toc-fixed {
    position: fixed !important;
    margin: 0 !important;
  }

  /* Button reset with enough specificity to beat WordPress/theme states. */
  .apnea-publication-single button.apnea-article-mobile-toc-toggle,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle:hover,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle:focus,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle:active,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle[aria-expanded="true"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    position: relative;
    display: block !important;
    width: 100% !important;
    min-height: var(--apnea-publication-toc-height);
    margin: 0 !important;
    padding: 13px 60px 12px 16px !important;
    border: 1px solid rgba(7, 29, 43, .16) !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .985) !important;
    background-image: none !important;
    box-shadow: 0 9px 26px rgba(7, 29, 43, .09) !important;
    color: var(--apnea-ink, #071D2B) !important;
    text-align: left !important;
    text-transform: none !important;
    cursor: pointer;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    -webkit-tap-highlight-color: transparent;
  }

  .apnea-publication-single button.apnea-article-mobile-toc-toggle:hover {
    border-color: rgba(15, 139, 141, .30) !important;
    box-shadow: 0 11px 30px rgba(7, 29, 43, .11) !important;
  }

  .apnea-publication-single button.apnea-article-mobile-toc-toggle[aria-expanded="true"] {
    border-color: rgba(15, 139, 141, .42) !important;
    box-shadow: 0 12px 34px rgba(7, 29, 43, .12) !important;
  }

  .apnea-publication-single button.apnea-article-mobile-toc-toggle:focus {
    outline: none !important;
  }

  .apnea-publication-single button.apnea-article-mobile-toc-toggle:focus-visible {
    outline: 3px solid rgba(15, 139, 141, .22) !important;
    outline-offset: 3px;
  }

  .apnea-publication-single .apnea-article-mobile-toc-toggle-copy {
    min-width: 0;
    display: block;
  }

  .apnea-publication-single .apnea-article-mobile-toc-toggle-copy small {
    display: block;
    margin-bottom: 3px;
    color: var(--apnea-teal, #0F8B8D) !important;
    font-size: 9px;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
  }

  .apnea-publication-single .apnea-article-mobile-toc-toggle-copy strong {
    display: block;
    color: var(--apnea-ink, #071D2B) !important;
    font-family: "Barlow Condensed", "Arial Narrow", Arial, sans-serif !important;
    font-size: 22px;
    line-height: 1.03;
    font-weight: 800;
  }

  .apnea-publication-single .apnea-article-mobile-toc-current {
    display: block;
    min-width: 0;
    max-width: 100%;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px solid rgba(7, 29, 43, .08);
    overflow: hidden;
    color: var(--apnea-muted, #5C6B73) !important;
    font-size: 11.5px;
    line-height: 1.25;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* Keep the control on the far right instead of beside the title text. */
  .apnea-publication-single .apnea-article-mobile-toc-icon {
    position: absolute !important;
    top: 50% !important;
    right: 14px !important;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: var(--apnea-ink, #071D2B) !important;
    box-shadow: 0 3px 10px rgba(7, 29, 43, .12);
  }

  .apnea-publication-single .apnea-article-mobile-toc-icon::before,
  .apnea-publication-single .apnea-article-mobile-toc-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 8px;
    height: 2px;
    border-radius: 2px;
    background: #FFFFFF !important;
    transition: transform 180ms ease;
  }

  .apnea-publication-single .apnea-article-mobile-toc-icon::before {
    left: 10px;
    transform: translateY(-50%) rotate(45deg);
  }

  .apnea-publication-single .apnea-article-mobile-toc-icon::after {
    right: 10px;
    transform: translateY(-50%) rotate(-45deg);
  }

  .apnea-publication-single .apnea-article-mobile-toc-toggle[aria-expanded="true"] .apnea-article-mobile-toc-icon::before {
    transform: translateY(-50%) rotate(-45deg);
  }

  .apnea-publication-single .apnea-article-mobile-toc-toggle[aria-expanded="true"] .apnea-article-mobile-toc-icon::after {
    transform: translateY(-50%) rotate(45deg);
  }

  .apnea-publication-single .apnea-article-mobile-toc-panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    max-height: min(54vh, 480px);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: auto;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    padding: 8px 12px 12px;
    border: 1px solid rgba(7, 29, 43, .14);
    border-radius: 12px;
    background: #FFFFFF !important;
    box-shadow: 0 20px 44px rgba(7, 29, 43, .16);
    scrollbar-width: thin;
    scrollbar-color: rgba(15, 139, 141, .35) transparent;
  }

  .apnea-publication-single .apnea-article-toc-mobile {
    border-top: 0;
  }

  .apnea-publication-single .apnea-article-toc-mobile a,
  .apnea-publication-single .apnea-article-toc-mobile a:visited,
  .apnea-publication-single .apnea-article-toc-mobile a:hover,
  .apnea-publication-single .apnea-article-toc-mobile a:focus,
  .apnea-publication-single .apnea-article-toc-mobile a:active {
    display: block;
    padding: 12px 10px 12px 16px;
    color: var(--apnea-muted, #5C6B73) !important;
    background: transparent !important;
    font-size: 13px;
    line-height: 1.35;
    text-decoration: none !important;
    -webkit-tap-highlight-color: transparent;
  }

  .apnea-publication-single .apnea-article-toc-mobile a:first-child {
    border-top: 0;
  }

  .apnea-publication-single .apnea-article-toc-mobile a:hover,
  .apnea-publication-single .apnea-article-toc-mobile a:focus,
  .apnea-publication-single .apnea-article-toc-mobile a.is-active {
    color: var(--apnea-ink, #071D2B) !important;
    background: rgba(15, 139, 141, .055) !important;
  }

  .apnea-publication-single .apnea-article-toc-mobile a:focus-visible {
    outline: 2px solid rgba(15, 139, 141, .22);
    outline-offset: -2px;
  }

  .apnea-publication-single .apnea-article-content h2,
  .apnea-publication-single .apnea-article-content h3,
  .apnea-publication-single .apnea-article-content h4 {
    scroll-margin-top: calc(
      var(--apnea-fixed-header-height, 76px) +
      var(--apnea-publication-toc-gap) +
      var(--apnea-publication-toc-height) +
      22px
    ) !important;
  }

  body.admin-bar.apnea-publication-single .apnea-article-content h2,
  body.admin-bar.apnea-publication-single .apnea-article-content h3,
  body.admin-bar.apnea-publication-single .apnea-article-content h4 {
    scroll-margin-top: calc(
      var(--apnea-fixed-header-height, 76px) +
      32px +
      var(--apnea-publication-toc-gap) +
      var(--apnea-publication-toc-height) +
      22px
    ) !important;
  }
}

@media (max-width: 782px) {
  body.admin-bar.apnea-publication-single .apnea-article-content h2,
  body.admin-bar.apnea-publication-single .apnea-article-content h3,
  body.admin-bar.apnea-publication-single .apnea-article-content h4 {
    scroll-margin-top: calc(
      var(--apnea-fixed-header-height, 68px) +
      46px +
      var(--apnea-publication-toc-gap) +
      var(--apnea-publication-toc-height) +
      22px
    ) !important;
  }
}

@media (max-width: 767px) {
  .apnea-publication-single {
    --apnea-publication-toc-gap: 14px;
    --apnea-publication-toc-height: 76px;
  }

  .apnea-publication-single .apnea-article-mobile-toc-slot {
    width: min(calc(100% - 32px), var(--apnea-container, 1240px));
    margin-bottom: 28px;
  }

  .apnea-publication-single button.apnea-article-mobile-toc-toggle,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle:hover,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle:focus,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle:active,
  .apnea-publication-single button.apnea-article-mobile-toc-toggle[aria-expanded="true"] {
    min-height: var(--apnea-publication-toc-height);
    padding: 12px 54px 11px 13px !important;
    border-radius: 11px !important;
  }

  .apnea-publication-single .apnea-article-mobile-toc-toggle-copy strong {
    font-size: 20px;
  }

  .apnea-publication-single .apnea-article-mobile-toc-current {
    margin-top: 7px;
    padding-top: 6px;
    font-size: 10.8px;
  }

  .apnea-publication-single .apnea-article-mobile-toc-icon {
    right: 12px !important;
    width: 34px;
    height: 34px;
  }

  .apnea-publication-single .apnea-article-mobile-toc-panel {
    max-height: min(46vh, 380px);
    padding-inline: 8px;
  }
}


/* ================================================================
   v1.1.4 VIEWPORT PORTAL COORDINATES

   Root cause fixed here:
   the normal-flow rules intentionally use top/left:auto !important.
   In v1.1.3 JavaScript then tried to set ordinary inline top/left values.
   A stylesheet !important declaration outranks a normal inline value, so
   the fixed TOC kept top:auto/left:auto and scrolled out of view.

   v1.1.4 feeds coordinates through CSS custom properties and consumes
   them here with !important declarations. This makes the fixed position
   deterministic on desktop, tablet and mobile.
   ================================================================ */
body.apnea-publication-single > .apnea-article-aside-inner.is-apnea-toc-portal,
body.apnea-publication-single > .apnea-article-mobile-toc-shell.is-apnea-toc-portal {
  position: fixed !important;
  top: var(--apnea-toc-fixed-top, 0px) !important;
  left: var(--apnea-toc-fixed-left, 0px) !important;
  right: auto !important;
  bottom: auto !important;
  width: var(--apnea-toc-fixed-width, auto) !important;
  margin: 0 !important;
  transform: none !important;
  translate: none !important;
  filter: none !important;
  perspective: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  will-change: top, left;
}

body.apnea-publication-single > .apnea-article-aside-inner.is-apnea-toc-portal {
  z-index: 99980 !important;
  max-height: var(--apnea-toc-fixed-max-height, calc(100vh - 136px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

body.apnea-publication-single > .apnea-article-mobile-toc-shell.is-apnea-toc-portal {
  z-index: 99990 !important;
  overflow: visible !important;
}

@media (prefers-reduced-motion: reduce) {
  .apnea-publication-single .apnea-article-mobile-toc-icon::before,
  .apnea-publication-single .apnea-article-mobile-toc-icon::after {
    transition: none !important;
  }
}