/* CodeGeek PWA mobile bottom navigation.
   Visible only when pwa.js detects an installed/standalone PWA. */
#codegeek-pwa-nav { display: none; }
@media (max-width: 767px) {
  #codegeek-pwa-nav {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 99999; display: grid; grid-template-columns: repeat(5, 1fr);
    height: 66px; padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); box-sizing: content-box;
    background: #16181c; border-top: 1px solid rgba(255, 181, 0, 0.35); box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.25);
  }
  #codegeek-pwa-nav a {
    min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    color: #ffffff; text-decoration: none; font-family: var(--body, Arial, Helvetica, sans-serif); font-size: 10px; font-weight: 600; line-height: 1.1;
    -webkit-tap-highlight-color: transparent;
  }
  #codegeek-pwa-nav a .cg-nav-icon { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 19px; line-height: 1; }
  #codegeek-pwa-nav a.active { color: #FFB500; }
  #codegeek-pwa-nav a.active .cg-nav-icon { background: #FFB500; color: #000000; }
  body:has(#codegeek-pwa-nav) { padding-bottom: 84px; }
  body:has(#codegeek-pwa-nav) .wa, body:has(#codegeek-pwa-nav) #codegeek-cookie-settings { bottom: 84px; }
}