/* AI Project Universe V5.2 — CV Research Hub vertical drawer + AcademIQ reliable document scroll */

.apu-v52-cv-bar,
.apu-v52-cv-scrim {
  display: none;
}

@media (max-width: 54rem) {
  /* Shared mobile safety: one document scroller, no clipped route content. */
  html[data-scroll-theme="computer-vision"],
  html[data-scroll-theme="computer-vision"] body,
  html[data-scroll-theme="student-performance"],
  html[data-scroll-theme="student-performance"] body {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    position: static !important;
    inset: auto !important;
    touch-action: pan-y pinch-zoom !important;
    -webkit-overflow-scrolling: touch;
  }

  /* ------------------------------------------------------------------
     CV RESEARCH HUB
     The original desktop aside becomes a true full-height vertical drawer.
     ------------------------------------------------------------------ */
  html[data-scroll-theme="computer-vision"] {
    --apu-v52-cv-bg: #141414;
    --apu-v52-cv-panel: #1c1c1c;
    --apu-v52-cv-line: #343434;
    --apu-v52-cv-text: #f8f8f8;
    --apu-v52-cv-muted: #aeaeae;
    --apu-v52-cv-accent: #adadad;
  }

  html[data-scroll-theme="computer-vision"] #root,
  html[data-scroll-theme="computer-vision"] #root > div,
  html[data-scroll-theme="computer-vision"] main {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  html[data-scroll-theme="computer-vision"] main {
    padding-left: 14px !important;
    padding-right: 14px !important;
    padding-bottom: max(72px, env(safe-area-inset-bottom)) !important;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-bar {
    position: sticky;
    top: 0;
    z-index: 2147482500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 60px;
    padding: max(9px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 9px max(12px, env(safe-area-inset-left));
    border-bottom: 1px solid var(--apu-v52-cv-line);
    background: var(--apu-v52-cv-bg);
    color: var(--apu-v52-cv-text);
    box-shadow: 0 8px 22px rgba(0,0,0,.24);
    isolation: isolate;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-mark {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #343434;
    color: var(--apu-v52-cv-accent);
    font: 900 13px/1 system-ui, sans-serif;
    box-shadow: inset 0 0 0 1px rgba(173, 173, 173,.28);
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand-text {
    min-width: 0;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand-text strong,
  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand-text small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand-text strong {
    color: var(--apu-v52-cv-text);
    font: 850 13px/1.2 system-ui, sans-serif;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand-text small {
    margin-top: 2px;
    color: var(--apu-v52-cv-muted);
    font: 600 10px/1.2 system-ui, sans-serif;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-toggle {
    flex: 0 0 auto;
    min-width: 76px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid #4c4c4c;
    border-radius: 11px;
    background: #242424;
    color: #fff;
    font: 850 12px/1 system-ui, sans-serif;
    cursor: pointer;
    touch-action: manipulation;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-toggle::before {
    content: "☰";
    font-size: 17px;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-toggle[aria-expanded="true"]::before {
    content: "×";
    font-size: 22px;
  }

  html[data-scroll-theme="computer-vision"] [data-apu-v52-cv-sidebar="true"] {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    z-index: 2147482600 !important;
    display: flex !important;
    flex-direction: column !important;
    width: min(86vw, 330px) !important;
    min-width: 0 !important;
    max-width: 330px !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding-top: max(14px, env(safe-area-inset-top)) !important;
    padding-bottom: max(18px, env(safe-area-inset-bottom)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    background: var(--apu-v52-cv-panel) !important;
    background-image: none !important;
    border-right: 1px solid var(--apu-v52-cv-line) !important;
    box-shadow: 18px 0 46px rgba(0,0,0,.38) !important;
    opacity: 1 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate3d(-105%,0,0) !important;
    transition: transform .22s ease, visibility 0s linear .22s !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    isolation: isolate;
  }

  html[data-scroll-theme="computer-vision"] [data-apu-v52-cv-sidebar="true"].is-open {
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate3d(0,0,0) !important;
    transition: transform .22s ease !important;
  }

  html[data-scroll-theme="computer-vision"] [data-apu-v52-cv-sidebar="true"] nav,
  html[data-scroll-theme="computer-vision"] [data-apu-v52-cv-sidebar="true"] ul {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 5px !important;
  }

  html[data-scroll-theme="computer-vision"] [data-apu-v52-cv-sidebar="true"] a {
    width: 100% !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    white-space: normal !important;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-drawer-close {
    position: sticky;
    top: 0;
    z-index: 3;
    width: calc(100% - 24px);
    min-height: 42px;
    margin: 0 12px 12px;
    border: 1px solid #4c4c4c;
    border-radius: 11px;
    background: #242424;
    color: #fff;
    font: 850 12px/1 system-ui, sans-serif;
    cursor: pointer;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-scrim {
    position: fixed;
    inset: 0;
    z-index: 2147482550;
    display: block;
    border: 0;
    padding: 0;
    background: rgba(7, 7, 7,.48);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility 0s linear .2s;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-scrim.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .2s ease;
  }

  html[data-scroll-theme="computer-vision"][data-apu-v52-cv-open="true"] body {
    overflow: hidden !important;
  }

  /* ------------------------------------------------------------------
     ACADEMIQ / STUDENT PERFORMANCE
     Force one native vertical document scroller and remove nested locks.
     ------------------------------------------------------------------ */
  html[data-scroll-theme="student-performance"] {
    scroll-behavior: smooth;
    scrollbar-gutter: auto !important;
  }

  html[data-scroll-theme="student-performance"] body {
    min-height: 100dvh !important;
    overscroll-behavior-y: auto !important;
  }

  html[data-scroll-theme="student-performance"] .sp-app,
  html[data-scroll-theme="student-performance"] .sp-main,
  html[data-scroll-theme="student-performance"] .sp-view,
  html[data-scroll-theme="student-performance"] .sp-view.is-active {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    contain: none !important;
  }

  html[data-scroll-theme="student-performance"] .sp-app {
    display: block !important;
  }

  html[data-scroll-theme="student-performance"] .sp-sidebar {
    display: none !important;
  }

  html[data-scroll-theme="student-performance"] .sp-main {
    display: block !important;
    margin: 0 !important;
    padding: 18px 12px max(88px, env(safe-area-inset-bottom)) !important;
  }

  html[data-scroll-theme="student-performance"] .sp-view.is-active {
    display: block !important;
  }

  html[data-scroll-theme="student-performance"] .sp-page-head,
  html[data-scroll-theme="student-performance"] .sp-section,
  html[data-scroll-theme="student-performance"] .sp-card,
  html[data-scroll-theme="student-performance"] .sp-footer,
  html[data-scroll-theme="student-performance"] #spReportBody {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  html[data-scroll-theme="student-performance"] .sp-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  html[data-scroll-theme="student-performance"] .apu-v5-mobile-project-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 2147482400 !important;
  }

  html[data-scroll-theme="student-performance"] .apu-v5-mobile-nav-drawer {
    position: sticky !important;
    top: 58px !important;
    z-index: 2147482399 !important;
    max-height: min(68dvh, 520px) !important;
    overflow-y: auto !important;
  }

  html[data-scroll-theme="student-performance"] .sp-scroll-end {
    display: block !important;
    min-height: 2px !important;
    margin-top: 28px !important;
  }
}

@media (max-width: 430px) {
  html[data-scroll-theme="computer-vision"] main,
  html[data-scroll-theme="student-performance"] .sp-main {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html[data-scroll-theme="computer-vision"] .apu-v52-cv-brand-text strong {
    max-width: 170px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-scroll-theme="computer-vision"] [data-apu-v52-cv-sidebar="true"],
  html[data-scroll-theme="computer-vision"] .apu-v52-cv-scrim {
    transition: none !important;
  }

  html[data-scroll-theme="student-performance"] {
    scroll-behavior: auto !important;
  }
}
