
/* v2.8.5 - PWA polish: slimme iPhone/Android/Desktop uitleg */
.wkp .wkp-pwa-install-card,
.wkp-pwa-install-card{
  margin:18px 0;
  padding:18px;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(17,24,39,.96),rgba(6,78,59,.94));
  border:1px solid rgba(37,211,102,.55);
  box-shadow:0 18px 42px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.08);
  color:#fff;
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
}
.wkp .wkp-pwa-install-card span{display:block;color:#25D366;font-weight:950;text-transform:uppercase;letter-spacing:.04em;font-size:12px;margin-bottom:4px;}
.wkp .wkp-pwa-install-card strong{display:block;font-size:clamp(20px,4.5vw,30px);line-height:1.05;font-weight:1000;color:#fff;}
.wkp .wkp-pwa-install-card p{margin:7px 0 0;color:rgba(255,255,255,.86);font-weight:700;line-height:1.35;}
.wkp .wkp-pwa-help{margin-top:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.10);border-radius:14px;padding:11px 12px;color:#fff;font-weight:800;line-height:1.45;}
.wkp .wkp-share-icon{display:inline-flex !important;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.16);color:#fff !important;font-weight:1000;margin:0 3px;font-size:15px;letter-spacing:0;text-transform:none;}
.wkp .wkp-pwa-install-button{
  appearance:none;border:0;border-radius:999px;background:#25D366;color:#052e16 !important;
  font-weight:1000;padding:13px 18px;white-space:nowrap;cursor:pointer;
  box-shadow:0 10px 22px rgba(37,211,102,.25);
}
.wkp .wkp-pwa-install-button[hidden]{display:none !important;}

.wkp .wkp-pwa-install-card.is-installed{display:none;}
@media(max-width:640px){.wkp .wkp-pwa-install-card{grid-template-columns:1fr}.wkp .wkp-pwa-install-button{width:100%;}}

/* v2.8.5 polish */
.wkp .wkp-pwa-visual{margin-top:12px;display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.13);border-radius:16px;padding:10px 13px;}
.wkp .wkp-pwa-bigicon{width:46px;height:46px;border-radius:15px;background:rgba(255,255,255,.16);display:inline-flex !important;align-items:center;justify-content:center;font-size:28px;margin:0 !important;color:#fff !important;text-transform:none !important;letter-spacing:0 !important;}
.wkp .wkp-pwa-visual small{font-weight:1000;color:#fff;opacity:.92;}
.wkp .wkp-pwa-install-card.is-ios{border-color:rgba(249,115,22,.58);background:linear-gradient(135deg,rgba(17,24,39,.97),rgba(124,45,18,.92));}
.wkp .wkp-pwa-install-card.is-android{border-color:rgba(37,211,102,.65);}
.wkp .wkp-pwa-install-card.is-desktop{border-color:rgba(96,165,250,.45);background:linear-gradient(135deg,rgba(17,24,39,.97),rgba(30,58,138,.85));}
.wkp .wkp-pwa-install-card.is-installed{display:grid;background:linear-gradient(135deg,rgba(5,46,22,.96),rgba(6,78,59,.92));border-color:rgba(34,197,94,.70);}
.wkp .wkp-pwa-install-card.is-installed .wkp-pwa-help{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.24);}
@media(max-width:640px){.wkp .wkp-pwa-visual{display:flex;width:100%;justify-content:center}.wkp .wkp-pwa-bigicon{width:54px;height:54px;font-size:30px}}

/* v2.9.1 - Ome Piet fix: geen nepknop meer, maar browserbalk aanwijzen */
.wkp .wkp-pwa-install-card .wkp-pwa-intro{
  font-size:14px;
  color:rgba(255,255,255,.90);
}
.wkp .wkp-pwa-install-card.is-ios .wkp-pwa-visual{
  display:block;
  width:100%;
  background:rgba(0,0,0,.20);
  border:1px solid rgba(249,115,22,.35);
  padding:14px;
}
.wkp .wkp-pwa-browser-demo{
  position:relative;
  width:min(360px,100%);
  margin:0 auto;
  padding:14px 12px 46px;
  border-radius:22px;
  background:linear-gradient(180deg,#111827,#020617);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 14px 34px rgba(0,0,0,.35);
}
.wkp .wkp-pwa-urlbar{
  background:#f8fafc;
  color:#111827;
  border-radius:999px;
  padding:9px 14px;
  text-align:center;
  font-size:13px;
  font-weight:900;
  margin-bottom:14px;
}
.wkp .wkp-pwa-toolbar{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  align-items:center;
  background:#0f172a;
  border-radius:16px;
  padding:8px;
  border:1px solid rgba(255,255,255,.14);
}
.wkp .wkp-pwa-toolbar i,
.wkp .wkp-pwa-toolbar b{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border-radius:13px;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-style:normal;
  font-size:22px;
  line-height:1;
}
.wkp .wkp-pwa-toolbar b{
  position:relative;
  background:#fff7ed;
  color:#f97316;
  outline:4px solid #f97316;
  box-shadow:0 0 0 8px rgba(249,115,22,.18),0 0 28px rgba(249,115,22,.75);
  transform:scale(1.04);
}
.wkp .wkp-pwa-arrow{
  position:absolute;
  left:50%;
  bottom:8px;
  transform:translateX(-50%);
  background:#f97316;
  color:#fff;
  border-radius:999px;
  padding:8px 14px;
  font-weight:1000;
  font-size:13px;
  letter-spacing:.03em;
  white-space:nowrap;
  box-shadow:0 10px 24px rgba(249,115,22,.35);
}
.wkp .wkp-pwa-arrow:before{
  content:'⬆';
  position:absolute;
  top:-30px;
  left:50%;
  transform:translateX(-50%);
  font-size:28px;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.5));
}
.wkp .wkp-pwa-help b{
  color:#fff;
}
.wkp .wkp-pwa-dismiss{
  margin-top:12px;
  appearance:none;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#fff;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
}
.wkp .wkp-pwa-dismiss:hover{background:rgba(255,255,255,.16);}
.wkp .wkp-pwa-android-demo,
.wkp .wkp-pwa-desktop-demo,
.wkp .wkp-pwa-installed-demo{
  width:min(360px,100%);
  margin:0 auto;
  border-radius:18px;
  padding:18px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  text-align:center;
  font-weight:1000;
}
.wkp .wkp-pwa-phone-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  border-radius:999px;
  background:#f8fafc;
  color:#111827;
  padding:10px 14px;
}
.wkp .wkp-pwa-android-demo{position:relative;padding-bottom:54px;}
.wkp .wkp-pwa-android-demo .wkp-pwa-arrow.right{bottom:10px;right:12px;left:auto;transform:none;}
.wkp .wkp-pwa-android-demo .wkp-pwa-arrow.right:before{left:auto;right:18px;transform:none;}
@media(max-width:640px){
  .wkp .wkp-pwa-install-card strong{font-size:24px;}
  .wkp .wkp-pwa-help{font-size:15px;}
  .wkp .wkp-pwa-browser-demo{padding-left:10px;padding-right:10px;}
}
