/* Bètamelding: lint linksonder + welkomstkaart rechtsonder, gedeeld over alle
   portalschillen (beheer: Content > Bètamelding). Vast, neutraal palet (leisteen
   met amber) dat op elk thema leesbaar is; de kaart is wit met donkere tekst.
   [hidden] wint hier altijd van de eigen display, anders kan de kaart niet dicht.
   Alles draagt twee klassen (.pbm-kaart .pbm-x, .pbm .pbm-lint): een thema dat koppen
   wit maakt (body.site-theme-x h2, specificiteit 0,1,2) mag de kaarttitel niet
   onleesbaar maken; dat gebeurde op het hogerheide-thema. */
.pbm .pbm-lint{position:fixed;left:14px;bottom:14px;z-index:1050;display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:#232f3e;color:#eef1f5;font:600 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif;border:1px solid rgba(255,255,255,.25);cursor:pointer}
.pbm .pbm-lint:hover{background:#31415a}
.pbm .pbm-lint:focus-visible{outline:3px solid #dcab48;outline-offset:2px}
.pbm .pbm-bol{width:8px;height:8px;border-radius:50%;background:#dcab48;box-shadow:0 0 6px #dcab48}
.pbm-kaart{position:fixed;right:16px;bottom:16px;z-index:1050;max-width:340px;background:#fff;color:#1b2430;border-radius:12px;border:1px solid #d6dde6;box-shadow:0 10px 34px rgba(15,23,42,.35);padding:18px 18px 16px;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.pbm-kaart[hidden]{display:none !important}
.pbm-kaart .pbm-sluit{position:absolute;top:8px;right:10px;border:0;background:none;font-size:20px;line-height:1;color:#5b6878;cursor:pointer;padding:2px 6px}
.pbm-kaart .pbm-sluit:hover{color:#1b2430}
.pbm-kaart .pbm-tag{display:inline-block;background:#fdf3dd;color:#7a5a12;border:1px solid #dcab48;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:4px 9px;margin-bottom:8px}
.pbm-kaart .pbm-titel{margin:0 0 6px;font-size:17px;line-height:1.3;color:#1b2430}
.pbm-kaart .pbm-tekst{margin:0 0 12px;font-size:14px;line-height:1.5;color:#3c485a}
.pbm-kaart .pbm-rij{display:flex;gap:8px}
.pbm-kaart .pbm-knop{flex:1;text-align:center;border-radius:8px;padding:9px 12px;font:600 14px system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none;border:0;cursor:pointer}
.pbm-kaart .pbm-knop-vol{background:#232f3e;color:#fff}
.pbm-kaart .pbm-knop-vol:hover{background:#31415a;color:#fff}
.pbm-kaart .pbm-knop-los{background:#eef1f5;color:#232f3e}
.pbm-kaart .pbm-knop-los:hover{background:#dde3ea}
.pbm-kaart .pbm-knop:focus-visible,.pbm-kaart .pbm-sluit:focus-visible{outline:3px solid #3a5a7c;outline-offset:2px}
@media (prefers-reduced-motion:no-preference){
  .pbm-kaart{animation:pbmKaartIn .35s ease}
  @keyframes pbmKaartIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
}
@media (max-width:767px){
  /* Op mobiel geen lint (te druk naast de tabbalk) en de kaart boven de mobiele
     navigatie van de portalthema's uit. */
  .pbm .pbm-lint{display:none}
  .pbm-kaart{left:12px;right:12px;bottom:calc(84px + env(safe-area-inset-bottom));max-width:none}
}
