/* assets/css/ad-notice.css — opmaak van de advertentiemelding uit partials/ad-notice.php.
 *
 * WAAROM EEN EIGEN BESTAND EN NIET SITE.CSS. De melding moet er op ELKE pagina die
 * advertenties toont hetzelfde uitzien, en die pagina's laden niet allemaal dezelfde
 * stylesheet. waardecheck-mobile.php en fr/waardecheck-mobile.php laden site.css helemaal
 * niet (die draaien op bootstrap + public-chrome.css), en waardecheck.php en
 * fr/waardecheck.php linkten site.css zonder ?v=, met een Expires van een jaar erop — een
 * terugkerende bezoeker hield daar dus de oude opmaak. Stond de melding alleen in site.css,
 * dan viel ze op precies die pagina's stuurloos uit elkaar.
 *
 * Daarom reist de opmaak nu mee met de partial zelf: die zet er vlak vóór haar script een
 * <link rel="stylesheet"> naartoe (body-ok volgens de HTML-specificatie) met ?v=filemtime.
 * Eén kopie, een jaar cachebaar, en ze is er gegarandeerd wanneer de melding er is.
 *
 * VORM. De kaart staat MIDDEN in het scherm boven een verduisterde achtergrond, want ze moet
 * opvallen. 'fixed' met top/left 50% en een translate van -50%: daardoor blijft ze in het
 * midden staan terwijl de pagina eronder doorscrolt, verschuift ze niets en kost ze geen CLS.
 *
 * De sluier ligt onder de kaart (2147482999 tegen 2147483000) en allebei blijven ze ONDER
 * #immo-cc (2147483600): mochten het toestemmingsvenster en deze melding ooit samenvallen,
 * dan wint de toestemming.
 *
 * Geen overflow:hidden op de body en niets met touch-action: een 'fixed' laag die zelf niet
 * scrolt geeft het scrollgebaar door aan de pagina eronder, en dat is precies de bedoeling —
 * de melding scrolt mee, de bezoeker kan blijven lezen.
 */
.imo-adnotice-veil{position:fixed;inset:0;z-index:2147482999;background:rgba(3,12,8,.66);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;transition:opacity .3s ease}
.imo-adnotice-veil.is-in{opacity:1}
/* display/right/bottom staan er expliciet bij als vangnet: tot 05/2026 stonden deze regels in
   site.css als een bandje ONDERAAN (display:flex, right:12px, bottom:12px). Blijft die oude
   site.css ergens hangen — een trage upload, een cache — dan zou de kaart met de standaard-
   overerving een rij worden in plaats van een blok. Nu niet. */
.imo-adnotice{position:fixed;top:50%;left:50%;right:auto;bottom:auto;display:block;z-index:2147483000;box-sizing:border-box;width:calc(100vw - 32px);max-width:440px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;margin:0;padding:26px 24px 22px;text-align:center;background:#1a3a2a;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.25);font-family:inherit;font-size:14.5px;line-height:1.55;transform:translate(-50%,-50%) scale(.9);opacity:0;transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .3s ease}
.imo-adnotice.is-in{transform:translate(-50%,-50%) scale(1);opacity:1}
.imo-adnotice__mark{display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin:0 auto 14px;border-radius:50%;background:rgba(95,224,138,.16);color:#5fe08a}
.imo-adnotice__mark svg{display:block;width:24px;height:24px}
.imo-adnotice__kop{margin:0 0 8px;padding:0;font-size:17px;line-height:1.35;font-weight:800;color:#fff}
.imo-adnotice__txt{margin:0;padding:0;font-size:14.5px;color:rgba(255,255,255,.86)}
.imo-adnotice__btn{display:block;width:100%;margin:20px 0 0;background:#5fe08a;color:#0d2419;border:0;border-radius:10px;padding:12px 18px;font-family:inherit;font-size:14.5px;font-weight:800;line-height:1.3;text-transform:none;cursor:pointer;transition:background .15s,transform .1s}
.imo-adnotice__btn:hover{background:#74e89a}
.imo-adnotice__btn:active{transform:translateY(1px)}
.imo-adnotice__btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* Alleen wanneer LOCK_CLOSE in ad-notice.php aan staat: geen uitgang vóór de 30 seconden om zijn. */
.imo-adnotice.is-vast .imo-adnotice__btn{display:none}
@media(max-width:560px){
  .imo-adnotice{padding:22px 18px 18px;font-size:14px}
  .imo-adnotice__kop{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
  .imo-adnotice-veil{transition:opacity .2s ease}
  .imo-adnotice{transition:opacity .2s ease;transform:translate(-50%,-50%)}
  .imo-adnotice.is-in{transform:translate(-50%,-50%)}
}
