/* RC14.0.5 · iPhone Safari PWA edge-to-edge bottom navigation.
   Native Capacitor uses native-app-v1.css and is intentionally excluded. */
@media(max-width:999px){
  html.is-ios:not(.is-native-app){
    --ios-shell-top:0px;
    --ios-shell-bottom:0px;
    --ios-header-content:58px;
    --ios-nav-content:60px;
    --ios-nav-reserved:60px;
    --ios-nav-offset:0px;
  }

  /* Browser Safari already keeps system chrome outside the content viewport.
     Keep the navigation compact, but anchor it to the visual viewport and
     lower it a few pixels so no body-coloured gap remains below it. */
  html.is-ios:not(.is-standalone):not(.is-native-app){
    --ios-shell-top:0px;
    --ios-shell-bottom:0px;
    --ios-nav-content:57px;
    --ios-nav-reserved:52px;
    --ios-nav-offset:-5px;
  }

  /* Installed Safari PWA extends under the status bar and home indicator.
     Keep the bar background at the physical bottom edge, but use only the
     minimum safe padding needed for the home indicator. This moves the
     navigation controls visibly lower without changing normal Safari or
     the native Capacitor app. */
  html.is-ios.is-standalone:not(.is-native-app){
    --ios-shell-top:env(safe-area-inset-top,0px);
    --ios-shell-bottom:env(safe-area-inset-bottom,0px);
    --ios-pwa-nav-bottom-pad:max(13px,calc(env(safe-area-inset-bottom,0px) - 19px));
    --ios-pwa-nav-drop:10px;
    --ios-pwa-nav-offset:-10px;
    --ios-pwa-nav-surface:rgba(255,255,255,.985);
    --ios-nav-content:56px;
    /* The bar is deliberately shifted below the CSS viewport. Reserve only
       the visible part, so content ends exactly where the bar begins. */
    --ios-nav-reserved:calc(var(--ios-nav-content) + var(--ios-pwa-nav-bottom-pad) - var(--ios-pwa-nav-drop));
  }

  html.is-ios.is-standalone[data-theme="dark"]:not(.is-native-app){
    --ios-pwa-nav-surface:rgba(17,24,39,.985);
  }

  html.is-ios:not(.is-native-app),
  html.is-ios:not(.is-native-app) body{
    width:100%;
    height:var(--app-visual-height,100dvh);
    min-height:var(--app-visual-height,100dvh);
    overflow:hidden;
  }

  html.is-ios:not(.is-native-app) body .site-shell,
  html.is-ios:not(.is-native-app) body .phone-stage,
  html.is-ios:not(.is-native-app) body .phone-frame{
    width:100%!important;
    height:var(--app-visual-height,100dvh)!important;
    min-height:0!important;
    max-height:none!important;
  }

  html.is-ios:not(.is-native-app) body .phone-frame{
    position:relative!important;
    overflow:hidden!important;
  }

  html.is-ios:not(.is-native-app) body .app-header{
    position:absolute!important;
    inset:0 0 auto 0!important;
    width:100%!important;
    height:calc(var(--ios-header-content) + var(--ios-shell-top))!important;
    min-height:calc(var(--ios-header-content) + var(--ios-shell-top))!important;
    padding:var(--ios-shell-top) 12px 0!important;
    align-items:center!important;
    gap:9px!important;
    transform:none!important;
    -webkit-transform:none!important;
    pointer-events:auto!important;
    touch-action:manipulation;
    z-index:1000!important;
  }

  html.is-ios:not(.is-native-app) body .app-header .mini-brand{
    width:36px!important;
    height:36px!important;
  }

  html.is-ios:not(.is-native-app) body .app-header .icon-btn,
  html.is-ios:not(.is-native-app) body .app-header .header-avatar-link,
  html.is-ios:not(.is-native-app) body .app-header .global-theme-toggle{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }

  html.is-ios:not(.is-native-app) body .header-title strong{font-size:15px!important}
  html.is-ios:not(.is-native-app) body .header-title small{font-size:10px!important}

  html.is-ios:not(.is-native-app) body .screen{
    position:absolute!important;
    inset:calc(var(--ios-header-content) + var(--ios-shell-top)) 0 var(--ios-nav-reserved)!important;
    height:auto!important;
    min-height:0!important;
    padding-bottom:16px!important;
    scroll-padding-top:12px!important;
    scroll-padding-bottom:20px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
  }

  html.is-ios:not(.is-native-app) body:not(.has-bottom-nav) .screen{
    bottom:0!important;
    padding-bottom:calc(16px + var(--ios-shell-bottom))!important;
  }

  /* Default and installed-PWA layout stays compact and contained inside the
     app frame. */
  html.is-ios:not(.is-native-app) body .bottom-nav{
    position:absolute!important;
    inset:auto 0 var(--ios-nav-offset) 0!important;
    width:100%!important;
    height:calc(var(--ios-nav-content) + var(--ios-shell-bottom))!important;
    min-height:calc(var(--ios-nav-content) + var(--ios-shell-bottom))!important;
    padding:3px 7px var(--ios-shell-bottom)!important;
    align-items:center!important;
    transform:none!important;
    -webkit-transform:none!important;
    z-index:1050!important;
  }



  /* Safari PWA only: the visible bar starts at the same place as the scroll
     area ends, while the box itself continues below the viewport. This makes
     the surface reach the physical rounded edge of the iPhone instead of
     leaving a body-coloured strip under the navigation. */
  html.is-ios.is-standalone:not(.is-native-app) body .bottom-nav{
    position:fixed!important;
    inset:auto -1px var(--ios-pwa-nav-offset) -1px!important;
    width:auto!important;
    height:calc(var(--ios-nav-content) + var(--ios-pwa-nav-bottom-pad))!important;
    min-height:calc(var(--ios-nav-content) + var(--ios-pwa-nav-bottom-pad))!important;
    margin:0!important;
    padding:1px 8px var(--ios-pwa-nav-bottom-pad)!important;
    border-radius:0!important;
    background:var(--ios-pwa-nav-surface)!important;
    box-shadow:0 -8px 24px rgba(31,24,62,.075),0 18px 0 18px var(--ios-pwa-nav-surface)!important;
    box-sizing:border-box!important;
  }

  /* Paint the shell under the bar with the same colour. It is a fallback for
     iOS versions that briefly expose the overscroll/safe-area canvas. */
  html.is-ios.is-standalone:not(.is-native-app),
  html.is-ios.is-standalone:not(.is-native-app) body,
  html.is-ios.is-standalone:not(.is-native-app) body .site-shell,
  html.is-ios.is-standalone:not(.is-native-app) body .phone-stage,
  html.is-ios.is-standalone:not(.is-native-app) body .phone-frame{
    background-color:var(--ios-pwa-nav-surface)!important;
  }

  html.is-ios.is-standalone:not(.is-native-app) body .screen{
    background-color:var(--surface,#fff)!important;
  }

  /* Only normal Safari needs visual-viewport anchoring. Keep the compact
     geometry from RC14.0.1; do not enlarge the bar or the central action. */
  html.is-ios:not(.is-standalone):not(.is-native-app) body .bottom-nav{
    position:fixed!important;
    inset:auto 0 var(--ios-nav-offset) 0!important;
    max-width:none!important;
    margin:0!important;
    box-sizing:border-box!important;
    padding:2px 7px 5px!important;
  }

  html.is-ios:not(.is-native-app) body .bottom-nav>a,
  html.is-ios:not(.is-native-app) body .bottom-nav>button{
    min-height:46px!important;
    padding:2px 2px 1px!important;
    justify-content:center!important;
  }

  html.is-ios:not(.is-native-app) body .bottom-nav a small{
    margin-top:1px!important;
    font-size:9px!important;
    line-height:1!important;
  }

  html.is-ios:not(.is-native-app) body .bottom-nav .nav-create{
    width:47px!important;
    height:47px!important;
    min-height:47px!important;
    transform:translateY(-4px)!important;
  }

  /* Final Safari-PWA-only geometry override. It is intentionally placed after
     the shared mobile rules so normal Safari keeps RC14.0.3 unchanged. */
  html.is-ios.is-standalone:not(.is-native-app) body .bottom-nav>a,
  html.is-ios.is-standalone:not(.is-native-app) body .bottom-nav>button{
    min-height:45px!important;
    padding:1px 2px 0!important;
  }

  html.is-ios.is-standalone:not(.is-native-app) body .bottom-nav .nav-create{
    transform:translateY(-2px)!important;
  }

  /* The scroll area already ends above navigation. Do not reserve the
     safe-area and navigation a second time in page content/footer. */
  html.is-ios:not(.is-native-app) body.has-bottom-nav .global-app-footer{
    margin-bottom:8px!important;
  }

  html.is-ios.is-standalone:not(.is-native-app) .global-app-footer{
    display:none!important;
  }

  html.is-ios:not(.is-native-app) body .flash{
    top:calc(var(--ios-header-content) + var(--ios-shell-top) + 6px)!important;
  }

  html.is-ios:not(.is-native-app) body .active-task-dock{
    bottom:calc(var(--ios-nav-reserved) + 8px)!important;
  }

  html.is-ios:not(.is-native-app) body .cookie-consent-banner,
  html.is-ios:not(.is-native-app) body.has-bottom-nav .social-presence-sheet,
  html.is-ios:not(.is-native-app) body.has-bottom-nav .social-contact-sheet,
  html.is-ios:not(.is-native-app) body.has-bottom-nav .social-person-sheet{
    bottom:calc(var(--ios-nav-reserved) + 8px)!important;
  }

  html.is-ios:not(.is-native-app) body.mobile-keyboard-open .bottom-nav{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(100%)!important;
  }

  html.is-ios:not(.is-native-app) body.mobile-keyboard-open .screen{
    bottom:0!important;
    padding-bottom:14px!important;
  }
}
