#promo-sticky,#promo-sticky *{box-sizing:border-box!important;text-align:left!important}
#promo-sticky{position:fixed;left:0;right:0;bottom:0;z-index:9990;margin:0;padding:12px 18px calc(12px + env(safe-area-inset-bottom,0px));background:#0A1017;border-top:3px solid #169A47;box-shadow:0 -6px 20px rgba(8,14,20,.18);font-family:'Plus Jakarta Sans',system-ui,sans-serif;transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
#promo-sticky.show{transform:translateY(0);visibility:visible;transition:transform .25s ease,visibility 0s}

/* Computer: zwevende kaart bovenaan, 12px onder het menu */
#promo-sticky.is-top{left:50%;right:auto;top:var(--ps-top,81px);bottom:auto;width:min(1180px,calc(100% - 48px));padding:0;border:1px solid rgba(255,255,255,.10);border-top:3px solid #169A47;border-radius:16px;overflow:hidden;box-shadow:0 12px 30px rgba(8,14,20,.28);transform:translate(-50%,calc(-100% - var(--ps-top,81px) - 20px))}
#promo-sticky.is-top.show{transform:translate(-50%,0)}
#promo-sticky.is-top .ps-in{max-width:none;padding:10px 12px 10px 14px}

#promo-sticky .ps-in{display:flex;align-items:center;justify-content:space-between;gap:14px;max-width:1180px;margin:0 auto}
#promo-sticky .ps-left{display:flex;align-items:center;gap:12px;min-width:0}
#promo-sticky .ps-logo{width:42px;height:42px;flex:none;border-radius:11px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
#promo-sticky .ps-logo img{display:block;width:100%;height:100%;object-fit:contain;padding:4px;margin:0;border:0}
#promo-sticky .ps-txt{min-width:0}
#promo-sticky .ps-bonus{font-family:'Poppins',system-ui,sans-serif;font-size:17px;font-weight:700;line-height:1.2;letter-spacing:-.01em;color:#6CC08B;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#promo-sticky .ps-bm{margin:2px 0 0;font-size:12.5px;font-weight:500;line-height:1.3;color:#A9B7C2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#promo-sticky .ps-right{display:flex;align-items:center;gap:6px;flex:none}

/* Claimknop: mat groen, geen lift of glow */
#promo-sticky a.ps-claim{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;height:46px;margin:0!important;padding:0 22px!important;background:#169A47!important;background-image:none!important;border:1px solid #169A47!important;border-radius:12px!important;box-shadow:none!important;filter:none!important;transform:none!important;color:#fff!important;font-family:'Poppins',system-ui,sans-serif!important;font-size:14.5px!important;font-weight:600!important;line-height:1!important;letter-spacing:0!important;text-transform:none!important;text-decoration:none!important;white-space:nowrap;transition:background-color .15s ease,border-color .15s ease}
#promo-sticky a.ps-claim:hover{background:#12833D!important;border-color:#12833D!important;color:#fff!important}
#promo-sticky a.ps-claim:focus-visible,#promo-sticky button.ps-close:focus-visible{outline:2px solid #6CC08B!important;outline-offset:2px}
#promo-sticky .ps-arr{display:block;width:15px;height:15px;flex:none;transition:transform .15s ease}
#promo-sticky a.ps-claim:hover .ps-arr{transform:translateX(2px)}
#promo-sticky.is-top a.ps-claim{height:44px}

#promo-sticky button.ps-close{display:inline-flex!important;align-items:center;justify-content:center;width:34px;height:34px;margin:0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:999px!important;box-shadow:none!important;color:#8A97A0!important;cursor:pointer;transition:background-color .15s ease,color .15s ease}
#promo-sticky button.ps-close:hover{background:rgba(255,255,255,.08)!important;color:#F2F6F4!important}
#promo-sticky button.ps-close svg{display:block;width:16px;height:16px}

/* Zwevende knoppen (cookie #cb-reopen, leeftijd #av-reopen) omhoog zolang de balk onderaan zichtbaar is */
body.ps-on #av-reopen,body.ps-on #cb-reopen,body.ps-on .fs-cc-manager_component-2{bottom:calc(var(--ps-h,72px) + 12px)!important;transition:bottom .25s ease}

/* Mobiel: zwevende kaart (zoals de claimbalk op de nieuwspagina), knop over de hele breedte */
@media (max-width:600px){
  #promo-sticky{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));padding:0;border:1px solid rgba(255,255,255,.10);border-top:3px solid #169A47;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(8,14,20,.35);transform:translateY(calc(100% + 30px))}
  #promo-sticky .ps-in{display:grid;grid-template-columns:minmax(0,1fr) 28px;grid-template-areas:"left close" "cta cta";align-items:center;gap:10px 8px;padding:12px 12px 12px 14px}
  #promo-sticky .ps-left{grid-area:left;gap:12px}
  #promo-sticky .ps-right{display:contents}
  #promo-sticky .ps-logo{width:40px;height:40px;border-radius:10px}
  #promo-sticky .ps-bonus{font-size:15px;line-height:1.3;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  #promo-sticky .ps-bm{font-size:12px}
  #promo-sticky a.ps-claim{grid-area:cta;width:100%;height:44px;padding:0 16px!important;font-size:14.5px!important}
  #promo-sticky button.ps-close{grid-area:close;justify-self:end;align-self:start;width:28px;height:28px;margin:-4px -4px 0 0!important}
}
@media (prefers-reduced-motion:reduce){#promo-sticky,#promo-sticky *{transition:none!important}}