:root{
    --cpd-bg:#fff;--cpd-text:#2a2a2a;--cpd-shadow:0 16px 40px rgba(0,0,0,.28);--cpd-radius:14px;
  }
  
  /* overlay */
  .wppopups-whole {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55); /* lớp nền tối */
    backdrop-filter: blur(6px);   /* làm mờ nền */
    -webkit-backdrop-filter: blur(6px); /* Safari iOS */
    z-index: 99999;
    cursor: pointer;
  }
  
  html.cpd-popup-open body{overflow:hidden}
  
  /* box */
  .spu-box{position:absolute;background:var(--cpd-bg);color:var(--cpd-text);border-radius:var(--cpd-radius);box-shadow:var(--cpd-shadow);overflow:hidden;width:90%;max-width:400px;will-change:transform,opacity;cursor:pointer}
  .spu-content img{width:100%;display:block;height:auto}
  
  /* positions */
  .cpd-position-center{top:50%;left:50%;transform:translate(-50%,-50%);bottom:auto!important;right:auto!important}
  .cpd-position-bottom-center{bottom:20px;left:50%;transform:translateX(-50%)}
  .cpd-position-bottom-right{bottom:20px;right:20px}
  .cpd-position-bottom-left{bottom:20px;left:20px}
  .cpd-position-top-center{top:20px;left:50%;transform:translateX(-50%)}

  /* animations */
  @media(prefers-reduced-motion:reduce){.spu-animation{animation:none}}
  
  /* slide‑up for non‑center */
  @media(prefers-reduced-motion:no-preference){
    .spu-animation:not(.cpd-position-center){animation:popupSlide .5s cubic-bezier(.22,.61,.36,1) both}
    @keyframes popupSlide{0%{opacity:0;transform:translateY(36px) scale(.9)}100%{opacity:1;transform:translateY(0) scale(1)}}
    /* scale‑in for center */
    .cpd-position-center.spu-animation{animation:popupScale .45s cubic-bezier(.23,.86,.46,1.2) both;transform-origin:center}
    @keyframes popupScale{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
  }
  
  /* close btn */
  .spu-close{position:absolute;top:10px;right:10px;background:none;border:none;width:24px;height:24px;cursor:pointer}
  
  /* countdown */
  .cpd-countdown{margin-top:40px;font-size:1.2em;text-align:center}
  
  /* mobile bottom‑sheet (ngoại trừ center) */
  @media(max-width:480px){
    .spu-box:not(.cpd-position-center){width:100%;max-width:none;left:0;right:0;bottom:env(safe-area-inset-bottom);border-radius:16px 16px 0 0}
  }