/* REV10W FIX81 R11 — one final floating-navigation geometry authority.
   This file is deliberately injected after every theme/device layer so older
   fixes can keep visual personality without changing slot geometry. */
:root{--gc-r11-nav-columns:5}
html body .gcAppBottomNav{
  --gc-nav-columns:5!important;
  position:fixed!important;
  z-index:2147481000!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:repeat(var(--gc-r11-nav-columns),minmax(0,1fr))!important;
  grid-auto-flow:column!important;
  grid-auto-columns:minmax(0,1fr)!important;
  align-items:stretch!important;
  justify-items:stretch!important;
  gap:8px!important;
  left:50%!important;
  right:auto!important;
  bottom:max(12px,calc(env(safe-area-inset-bottom,0px) + 12px))!important;
  transform:translateX(-50%)!important;
  width:min(880px,calc(100vw - 48px))!important;
  max-width:880px!important;
  min-width:0!important;
  padding:8px!important;
  min-height:80px!important;
  height:auto!important;
  overflow:visible!important;
  border-radius:26px!important;
}
html body .gcAppBottomNav>.gcAppNavButton,
html body .gcAppBottomNav>a.gcAppNavButton,
html body .gcAppBottomNav>button.gcAppNavButton{
  grid-column:auto!important;
  grid-row:auto!important;
  justify-self:stretch!important;
  align-self:stretch!important;
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  min-height:64px!important;
  height:64px!important;
  margin:0!important;
  padding:6px 8px!important;
  display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  border-radius:18px!important;
  transform:none!important;
  scale:1!important;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-align:center!important;
  overflow:hidden!important;
}
html body .gcAppBottomNav>.gcAppNavButton::before,
html body .gcAppBottomNav>.gcAppNavButton::after{max-width:100%!important;inset-inline:0!important;transform:none!important}
html body .gcAppBottomNav>.gcAppNavButton.isActive,
html body .gcAppBottomNav>.gcAppNavButton[aria-current="page"]{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  transform:none!important;
  scale:1!important;
}
html body .gcAppBottomNav .gcAppNavIcon{
  flex:0 0 24px!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  max-width:24px!important;
  display:grid!important;
  place-items:center!important;
  line-height:0!important;
}
html body .gcAppBottomNav .gcAppNavIcon svg{width:24px!important;height:24px!important;max-width:24px!important;max-height:24px!important}
html body .gcAppBottomNav>.gcAppNavButton>span:last-child{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  line-height:1.05!important;
  text-align:center!important;
}
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcAppNavProfileIcon,
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatarWrap{width:30px!important;height:30px!important;flex:0 0 30px!important}
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatar{width:27px!important;height:27px!important}

/* Tablet/compact desktop: still five equal slots, just slightly tighter. */
@media (min-width:641px) and (max-width:980px){
  html body .gcAppBottomNav{width:min(760px,calc(100vw - 32px))!important;max-width:760px!important;gap:5px!important;padding:7px!important;min-height:76px!important}
  html body .gcAppBottomNav>.gcAppNavButton{height:60px!important;min-height:60px!important;padding-inline:5px!important;border-radius:16px!important;font-size:10px!important;gap:5px!important}
}

/* Phones/PWAs: viewport-edge authority with equal five-slot geometry. */
@media (max-width:640px){
  html body .gcAppBottomNav{
    left:max(7px,env(safe-area-inset-left,0px))!important;
    right:max(7px,env(safe-area-inset-right,0px))!important;
    bottom:max(8px,calc(env(safe-area-inset-bottom,0px) + 8px))!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    gap:2px!important;
    padding:6px!important;
    min-height:68px!important;
    border-radius:22px!important;
    overflow:hidden!important;
  }
  html body .gcAppBottomNav>.gcAppNavButton{
    min-height:56px!important;
    height:56px!important;
    padding:4px 1px!important;
    border-radius:15px!important;
    gap:4px!important;
    font-size:9px!important;
    overflow:visible!important;
  }
  html body .gcAppBottomNav>.gcAppNavButton>span:last-child{overflow:visible!important;text-overflow:clip!important;font-size:inherit!important}
  html body .gcAppBottomNav .gcAppNavIcon,
  html body .gcAppBottomNav .gcAppNavIcon svg{width:21px!important;height:21px!important;min-width:21px!important;max-width:21px!important;flex-basis:21px!important}
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcAppNavProfileIcon,
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatarWrap{width:27px!important;height:27px!important;flex-basis:27px!important}
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatar{width:24px!important;height:24px!important}
}
@media (max-width:360px){
  html body .gcAppBottomNav{left:max(4px,env(safe-area-inset-left,0px))!important;right:max(4px,env(safe-area-inset-right,0px))!important;gap:1px!important;padding:5px!important}
  html body .gcAppBottomNav>.gcAppNavButton{padding-inline:0!important;font-size:8px!important}
}

/* Hydration rule remains fail-closed: geometry never makes a stale dock visible. */
html body #profileBottomNav.gcAppBottomNav:not(.gcCustomNavReady){visibility:hidden!important;opacity:0!important;pointer-events:none!important}
html body #profileBottomNav.gcAppBottomNav.gcCustomNavReady{visibility:visible!important;opacity:1!important}


/* REV10W FIX83 — preserve a true circular Profile avatar across every non-Admin mobile PWA route. */
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatarWrap{
  width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;max-width:30px!important;max-height:30px!important;
  flex:0 0 30px!important;aspect-ratio:1/1!important;box-sizing:border-box!important;border-radius:999px!important;transform:none!important;
}
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatar{
  width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important;max-width:27px!important;max-height:27px!important;
  aspect-ratio:1/1!important;box-sizing:border-box!important;border-radius:999px!important;object-fit:cover!important;object-position:center!important;clip-path:circle(50% at 50% 50%)!important;transform:none!important;
}
@media(max-width:760px){
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatarWrap{width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important;max-width:27px!important;max-height:27px!important;flex-basis:27px!important}
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatar{width:24px!important;height:24px!important;min-width:24px!important;min-height:24px!important;max-width:24px!important;max-height:24px!important}
}

/* FIX101 — one shared icon lane for every floating-nav item.
   Profile previously overrode the outer icon box to 27px while inheriting
   the regular 21px min/max constraints on phones. The avatar therefore
   overflowed to the right and its taller stack pushed the Profile label down.
   Keep the slot/label geometry identical; only the artwork inside the lane
   changes size. */
html body .gcAppBottomNav .gcAppNavIcon,
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcAppNavProfileIcon{
  box-sizing:border-box!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  max-width:30px!important;
  max-height:30px!important;
  flex:0 0 30px!important;
  flex-basis:30px!important;
  display:grid!important;
  place-items:center!important;
  margin-inline:auto!important;
  transform:none!important;
}
html body .gcAppBottomNav .gcAppNavIcon svg{
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
  display:block!important;
  margin:auto!important;
}
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatarWrap{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  max-width:30px!important;
  max-height:30px!important;
  flex:0 0 30px!important;
  margin:auto!important;
  display:grid!important;
  place-items:center!important;
}
html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatar{
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  min-height:27px!important;
  max-width:27px!important;
  max-height:27px!important;
  margin:auto!important;
}
html body .gcAppBottomNav>.gcAppNavButton>span:last-child{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 1.05em!important;
  height:1.05em!important;
  min-height:1.05em!important;
  line-height:1.05!important;
  margin:0!important;
}
@media(max-width:640px){
  html body .gcAppBottomNav .gcAppNavIcon,
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcAppNavProfileIcon{
    width:27px!important;
    height:27px!important;
    min-width:27px!important;
    min-height:27px!important;
    max-width:27px!important;
    max-height:27px!important;
    flex:0 0 27px!important;
    flex-basis:27px!important;
  }
  html body .gcAppBottomNav .gcAppNavIcon svg{
    width:21px!important;
    height:21px!important;
    min-width:21px!important;
    min-height:21px!important;
    max-width:21px!important;
    max-height:21px!important;
  }
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatarWrap{
    width:27px!important;
    height:27px!important;
    min-width:27px!important;
    min-height:27px!important;
    max-width:27px!important;
    max-height:27px!important;
    flex:0 0 27px!important;
  }
  html body .gcAppBottomNav [data-app-nav-page="profile"] .gcNavProfileAvatar{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    min-height:24px!important;
    max-width:24px!important;
    max-height:24px!important;
  }
}

