/* Webnigerians PWA install experience V29 */
:root{
  --wnpwa-blue:#0B5BD3;
  --wnpwa-blue2:#0874df;
  --wnpwa-navy:#071a38;
  --wnpwa-line:#d7e4f2;
  --wnpwa-muted:#64758c;
  --wnpwa-card:#fff;
}
.wnPwaPrompt{
  position:fixed;right:18px;bottom:18px;z-index:99980;
  width:min(390px,calc(100vw - 28px));
  background:rgba(255,255,255,.985);border:1px solid var(--wnpwa-line);
  border-radius:20px;box-shadow:0 24px 70px rgba(4,38,84,.22);
  padding:14px;display:none;align-items:flex-start;gap:11px;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.wnPwaPrompt.show{display:flex;animation:wnPwaRise .22s ease-out}
@keyframes wnPwaRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.wnPwaIcon{
  width:48px;height:48px;flex:0 0 48px;border-radius:14px;
  display:grid;place-items:center;background:#eff6ff;border:1px solid #d7e7f8;overflow:hidden
}
.wnPwaIcon img{width:38px;height:38px;object-fit:contain;display:block}
.wnPwaBody{min-width:0;flex:1}
.wnPwaBody strong{display:block;color:#0b1f3e;font-size:14px;line-height:1.2}
.wnPwaBody p{margin:4px 0 10px;color:var(--wnpwa-muted);font-size:11px;line-height:1.45}
.wnPwaActions{display:flex;gap:7px;flex-wrap:wrap}
.wnPwaBtn{
  border:1px solid #cbdced;background:#fff;color:#134f91;border-radius:10px;
  min-height:35px;padding:0 11px;font-size:10.5px;font-weight:900;cursor:pointer
}
.wnPwaBtn.primary{background:var(--wnpwa-blue2);color:#fff;border-color:var(--wnpwa-blue2);box-shadow:0 7px 18px rgba(8,116,223,.16)}
.wnPwaDismiss{border:0;background:transparent;color:#7a8a9e;width:30px;height:30px;border-radius:9px;cursor:pointer;font-size:18px;line-height:1}
.wnPwaDismiss:hover{background:#f2f6fa;color:#1e334e}

.wnPwaModal{
  position:fixed;inset:0;z-index:99990;background:rgba(4,20,42,.52);
  display:none;align-items:center;justify-content:center;padding:20px;
  backdrop-filter:blur(3px)
}
.wnPwaModal.open{display:flex}
.wnPwaModalCard{
  width:min(480px,100%);background:#fff;border-radius:22px;border:1px solid #dbe6f1;
  box-shadow:0 30px 90px rgba(0,0,0,.28);overflow:hidden
}
.wnPwaModalHead{display:flex;align-items:center;justify-content:space-between;padding:18px 19px;border-bottom:1px solid #e5edf5}
.wnPwaModalHead strong{font-size:17px;color:#0b1f3e}
.wnPwaModalClose{border:0;background:#f1f5f9;width:34px;height:34px;border-radius:50%;font-size:19px;cursor:pointer}
.wnPwaModalBody{padding:19px;color:#40536b;font-size:13px;line-height:1.6}
.wnPwaStep{display:flex;gap:10px;margin:12px 0}
.wnPwaStepNo{width:28px;height:28px;flex:0 0 28px;border-radius:9px;background:#eaf4ff;color:#0870d8;display:grid;place-items:center;font-size:11px;font-weight:950}
.wnPwaStep b{display:block;color:#112844}
.wnPwaModalFoot{padding:0 19px 19px;display:flex;justify-content:flex-end;gap:8px}

.wnPwaToast{
  position:fixed;left:50%;bottom:22px;z-index:99995;
  transform:translate(-50%,18px);opacity:0;pointer-events:none;
  background:#071a38;color:#fff;border-radius:999px;padding:9px 13px;
  font:800 11px/1.2 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  box-shadow:0 14px 38px rgba(0,0,0,.2);transition:.2s ease
}
.wnPwaToast.show{opacity:1;transform:translate(-50%,0)}
.wnPwaOffline{background:#7d2a18}
.wnPwaOnline{background:#087a58}

@media(display-mode:standalone){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .topbar,.liTopbar{padding-top:env(safe-area-inset-top)}
}
@media(max-width:620px){
  .wnPwaPrompt{right:10px;left:10px;bottom:calc(10px + env(safe-area-inset-bottom));width:auto;border-radius:17px}
  .wnPwaIcon{width:44px;height:44px;flex-basis:44px}
  .wnPwaIcon img{width:35px;height:35px}
}