/* 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;animation:pbm-klop 2.4s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){.pbm .pbm-bol{animation:none}}
.pbm-kaart{position:fixed;right:16px;bottom:16px;z-index:1050;width:calc(100vw - 32px);max-width:400px;background:#fff;color:#1b2430;border-radius:14px;border:1px solid #d6dde6;border-left:5px solid #dcab48;box-shadow:0 16px 44px rgba(15,23,42,.42);padding:20px 20px 18px;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-flex;align-items:center;gap:6px;background:#fdf3dd;color:#7a5a12;border:1px solid #dcab48;border-radius:999px;font-size:11.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:5px 11px;margin-bottom:10px}
.pbm-kaart .pbm-tag-bol{width:7px;height:7px;border-radius:50%;background:#dcab48;box-shadow:0 0 6px #dcab48;animation:pbm-klop 2.4s ease-in-out infinite}
@keyframes pbm-klop{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.72)}}
@media (prefers-reduced-motion: reduce){.pbm-kaart .pbm-tag-bol{animation:none}}
.pbm-kaart .pbm-titel{margin:0 0 8px;font-size:19px;line-height:1.25;color:#1b2430;font-weight:800}
.pbm-kaart .pbm-tekst{margin:0 0 14px;font-size:14.5px;line-height:1.55;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-rand{background:#fff;color:#232f3e;border:1px solid #c3ccd8}
.pbm-kaart .pbm-knop-rand:hover{background:#f3f6f9;color:#232f3e}
/* "Even niet" is geen hoofdkeuze; die staat als tekstregel onder de knoppen. */
.pbm-kaart .pbm-later{display:block;width:100%;margin-top:10px;border:0;background:none;padding:6px 0 0;font:500 12.5px system-ui,-apple-system,"Segoe UI",sans-serif;color:#5b6878;cursor:pointer;text-align:center}
.pbm-kaart .pbm-later:hover{color:#1b2430;text-decoration:underline}
.pbm-kaart .pbm-later:focus-visible{outline:3px solid #3a5a7c;outline-offset:2px}
.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}
}