/* REALM Group Canada v1.15 "Get the app" (ported from REALM Group America PR #20 / Philippines public/app/pwa.css, itself from Fiji). Linked in the <head> of src/layouts/Base.astro: header button on wide screens,
   a slim strip under the header on phones, and the small install banner from /app/pwa.js. All hidden inside the app. */
[data-install-app][hidden]{display:none!important}
.nav-account .nav-app{display:none}
@media (min-width:1181px){.nav-account .nav-app{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.nav-account .btn{flex:none;white-space:nowrap}}
/* Canada: full text from 1360px (fits at 1366/1440); icon only (44x44, name kept for screen readers) from 1181 to 1359px so "Sign in" never wraps. */
@media (min-width:1181px) and (max-width:1359px){.nav-account .btn.small.nav-app{width:44px;padding:0;justify-content:center}.nav-account .nav-app svg{flex:none;width:20px;height:20px}.nav-app .nav-app-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
.get-app-bar{display:none}
@media (max-width:760px){
  a.get-app-bar{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:6px 16px;background:var(--forest-2);color:#fff;font-size:.98rem;font-weight:700;text-decoration:none;border-bottom:3px solid var(--orange)}
  a.get-app-bar svg{width:22px;height:22px;flex:none;color:var(--orange-light)}
  a.get-app-bar .go{color:var(--orange-light);font-size:1.3rem;line-height:1}
  a.get-app-bar span:not(.go){min-width:0}
  a.get-app-bar:active{background:var(--forest-3)}
}
@media (display-mode:standalone){.nav-app,.get-app-bar,.get-app-link{display:none!important}}
.pwa-banner{position:fixed;left:12px;right:12px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:9000;display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:10px 12px;padding:14px 52px 14px 14px;max-width:calc(100vw - 24px);box-sizing:border-box;background:var(--forest);color:#fff;border:2px solid var(--orange);border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.28);transform:translateY(120%);opacity:0;transition:transform .3s ease,opacity .3s ease}
.pwa-banner.show{transform:none;opacity:1}
.pwa-banner img{width:48px;height:48px;border-radius:10px}
.pwa-banner-text{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:.93rem;line-height:1.35;overflow-wrap:break-word}
.pwa-banner-text strong{font-size:1rem}
.pwa-banner-text span{color:#cfe0d3}
.pwa-banner-actions{display:contents}
.pwa-banner .btn.small{min-height:44px;padding:0 18px;white-space:nowrap}
.pwa-close{position:absolute;top:4px;right:4px;appearance:none;background:transparent;border:0;color:#fff;font-size:26px;line-height:1;width:44px;height:44px;border-radius:50%;cursor:pointer}
.pwa-close:hover{background:rgba(255,255,255,.1)}
.pwa-close:focus-visible{outline:3px solid var(--orange);outline-offset:0}
@media (max-width:480px){.pwa-banner{grid-template-columns:48px minmax(0,1fr)}.pwa-banner .btn.small{grid-column:1/-1;width:100%;white-space:normal}}
@media (min-width:760px){.pwa-banner{left:auto;right:24px;bottom:96px;max-width:460px}}
@media (prefers-reduced-motion:reduce){.pwa-banner{transition:none}}