/* ============================================================================
   NAVBAR AUTO-HIDE SYSTEM
   For sub-pages only (NOT for main 5 pages)
   Provides more screen space while maintaining easy access
   Created: January 21, 2026
   ============================================================================ */

/* Auto-hide State - Hidden by default on scroll */
.desktop-navbar.autohide {
    transform: translateY(-100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Show State - Visible */
.desktop-navbar.autohide.show {
    transform: translateY(0);
}

/* Always show on page load initially — transition persists so show is also animated */
.desktop-navbar {
    transform: translateY(0);
    will-change: transform;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Mobile - Disable autohide (always show) */
@media (max-width: 768px) {
    .desktop-navbar.autohide {
        transform: translateY(0) !important;
    }
}

/* ============================================================================
   SMOOTH BODY SHIFT SYSTEM
   Body padding shrinks to 0 when navbar is hidden — no wasted space.
   Content/filter-bar rises smoothly, then drops back when navbar returns.
   ============================================================================ */

body {
    transition: padding-top 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body:has(.desktop-navbar.autohide:not(.show)) {
    padding-top: 0 !important;
}

/* Sticky filter bars / toolbars that sit at top: 85px should shift too */
.filter-bar,
.sticky-bar,
.toolbar-sticky,
.lib-header,
.page-header,
.manager-header {
    transition: top 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body:has(.desktop-navbar.autohide:not(.show)) .filter-bar,
body:has(.desktop-navbar.autohide:not(.show)) .sticky-bar,
body:has(.desktop-navbar.autohide:not(.show)) .toolbar-sticky,
body:has(.desktop-navbar.autohide:not(.show)) .lib-header,
body:has(.desktop-navbar.autohide:not(.show)) .page-header,
body:has(.desktop-navbar.autohide:not(.show)) .manager-header {
    top: 0 !important;
}

/* Code viewer wrapper - the whole viewer shifts up when navbar hides */
.viewer-wrapper {
    transition: top 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body:has(.desktop-navbar.autohide:not(.show)) .viewer-wrapper {
    top: 0 !important;
    height: 100vh !important;
}

/* Main content wrapper (L-shaped layout) - shifts from 153px to 68px when navbar hides */
.main-content-wrapper {
    transition: top 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body:has(.desktop-navbar.autohide:not(.show)) .main-content-wrapper {
    top: 68px !important;
    height: calc(100vh - 68px) !important;
}