/**

 * Hydra mobile — auto-hide topbar + bottom nav on scroll.

 * Load after hydra-mobile-polish-final.css (≤900px only).

 */



@media (max-width: 900px) {

  body.use-new-ui.mobile-chrome-auto-hide header.topbar,

  body.use-new-ui.mobile-chrome-auto-hide .topbar,

  body.use-new-ui.mobile-chrome-auto-hide .mobile-owner-header,

  body.use-new-ui.mobile-chrome-auto-hide #mobileOwnerBottomNav.mobile-owner-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide #mobileOwnerBottomNav.mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide nav.mobile-owner-bottom-nav.mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide .mobile-owner-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide .mobile-bottom-nav {

    position: fixed !important;

    transition: transform 220ms ease, opacity 160ms ease !important;

    will-change: transform, opacity;

  }



  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden header.topbar,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .topbar,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .mobile-owner-header,

  body.use-new-ui.mobile-chrome-hidden .mobile-owner-header,

  body.use-new-ui.mobile-chrome-hidden header.topbar,

  body.use-new-ui.mobile-chrome-hidden .topbar {

    transform: translateY(-110%) !important;

    opacity: 0 !important;

    pointer-events: none !important;

  }



  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden #mobileOwnerBottomNav.mobile-owner-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden #mobileOwnerBottomNav.mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden nav.mobile-owner-bottom-nav.mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .mobile-owner-bottom-nav.mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-hidden .mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-hidden #mobileOwnerBottomNav.mobile-bottom-nav,

  body.use-new-ui.mobile-chrome-hidden .mobile-owner-bottom-nav {

    transform: translateY(110%) !important;

    opacity: 0 !important;

    pointer-events: none !important;

  }



  /* Reclaim vertical space — no phantom inset when chrome hidden */

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .mobile-page-content.content-scroll {

    padding-top: calc(env(safe-area-inset-top, 0px) + 8px) !important;

    scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 8px);

    transition: padding-top 220ms ease, padding-bottom 220ms ease;

  }



  body.use-new-ui.mobile-chrome-auto-hide #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide .content-scroll {

    transition: padding-top 220ms ease, padding-bottom 220ms ease;

  }



  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-orders #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-orders .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-inventory #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-inventory .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-dashboard #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-dashboard .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-cashflow #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-cashflow .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-expenses #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-expenses .content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-storefront-inquiries #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden.route-storefront-inquiries .content-scroll {

    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px) !important;

  }



  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden[data-owner-fab-route] #contentScroll.content-scroll,

  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden[data-owner-fab-route] .content-scroll {

    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 64px) !important;

  }



  body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden[data-owner-fab-route] #mobileOwnerFab:not([hidden]) {

    bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(10px, 2.5vw, 16px)) !important;

    opacity: 1 !important;

    visibility: visible !important;

    pointer-events: auto !important;

    transform: none !important;

    transition: bottom 220ms ease, transform 180ms ease, opacity 160ms ease;

  }



  @media (prefers-reduced-motion: reduce) {

    body.use-new-ui.mobile-chrome-auto-hide header.topbar,

    body.use-new-ui.mobile-chrome-auto-hide .topbar,

    body.use-new-ui.mobile-chrome-auto-hide #mobileOwnerBottomNav,

    body.use-new-ui.mobile-chrome-auto-hide #contentScroll.content-scroll,

    body.use-new-ui.mobile-chrome-auto-hide .content-scroll,

    body.use-new-ui.mobile-chrome-auto-hide[data-owner-fab-route] #mobileOwnerFab:not([hidden]) {

      transition: none !important;

    }



    body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden header.topbar,

    body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden .topbar,

    body.use-new-ui.mobile-chrome-auto-hide.mobile-chrome-hidden #mobileOwnerBottomNav {

      transform: none !important;

      opacity: 1 !important;

      visibility: visible !important;

    }

  }



  /* —— HYDRA Tools header (no bottom nav) —— */

  body.tools-mode.tools-chrome-auto-hide #hydraToolsShell .hydra-tools-shell__header,

  body.tools-mode.tools-chrome-auto-hide #hydraToolsShell .tools-header {

    position: fixed !important;

    top: 0;

    left: 0;

    right: 0;

    z-index: 8100;

    transition: transform 220ms ease;

    will-change: transform;

  }



  body.tools-mode.tools-chrome-auto-hide #hydraToolsShell .hydra-tools-shell__main {

    padding-top: calc(var(--tools-chrome-header-h, 96px) + 16px) !important;

    transition: padding-top 220ms ease;

  }



  body.tools-mode.tools-chrome-auto-hide.tools-chrome-hidden #hydraToolsShell .hydra-tools-shell__header,

  body.tools-mode.tools-chrome-auto-hide.tools-chrome-hidden #hydraToolsShell .tools-header {

    transform: translateY(-110%) !important;

    pointer-events: none;

  }



  body.tools-mode.tools-chrome-auto-hide.tools-chrome-hidden #hydraToolsShell .hydra-tools-shell__main {

    padding-top: calc(env(safe-area-inset-top, 0px) + 8px) !important;

  }



  @media (prefers-reduced-motion: reduce) {

    body.tools-mode.tools-chrome-auto-hide #hydraToolsShell .hydra-tools-shell__header,

    body.tools-mode.tools-chrome-auto-hide #hydraToolsShell .hydra-tools-shell__main {

      transition: none !important;

    }



    body.tools-mode.tools-chrome-auto-hide.tools-chrome-hidden #hydraToolsShell .hydra-tools-shell__header {

      transform: none !important;

    }

  }

}