/* AVP Frontend styles */
body.avp-no-scroll { overflow: hidden; }

.avp-modal { position: fixed; inset: 0; display: none; z-index: 999999;
  /* Center dialog */
  align-items: center; justify-content: center;
}
.avp-modal.avp-open { display: flex; }
.avp-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,var(--avp-backdrop, .68)); }
.avp-dialog { position: relative; z-index: 1; margin: 0; max-width: min(calc(var(--avp-maxw, 960) * 1px), 92vw); background: #000; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.55); max-height: calc(var(--avp-maxvh, 80) * 1vh); display: flex; align-items: center; justify-content: center; }
.avp-video  { position: relative; z-index: 1; display: block; width: 100%; max-height: calc(var(--avp-maxvh, 80) * 1vh); object-fit: var(--avp-fit, contain); background: #000; }
.avp-close  { position: absolute; top: 8px; right: 12px; font-size: 28px; line-height: 1; border: 0; background: transparent; color: #fff; cursor: pointer; opacity: .9; z-index: 3; pointer-events: auto; }
.avp-close:hover, .avp-close:focus { opacity: 1; outline: 2px solid #fff; outline-offset: 2px; }
.avp-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.avp-gesture{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; padding: 10px 16px; font-size: 16px; border: 0; border-radius: 999px; background: #fff; color: #111; cursor: pointer; box-shadow: 0 6px 20px rgba(0,0,0,.3); }
.avp-gesture[hidden] { display: none; }

@keyframes avpZoom { from { transform: scale(.94); opacity: 0 } to { transform: scale(1); opacity: 1 } }
@keyframes avpFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes avpSlideUp { from { transform: translateY(16px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }

.avp-modal.avp-open .avp-dialog.avp-anim-zoom { animation: avpZoom .28s ease-out; }
.avp-modal.avp-open .avp-dialog.avp-anim-fade { animation: avpFade .24s ease-out; }
.avp-modal.avp-open .avp-dialog.avp-anim-slide-up { animation: avpSlideUp .32s cubic-bezier(.2,.8,.2,1); }

/* Countdown – ensure it's above any site UI */
.avp-countdown { position: fixed; z-index: 2147483647; display: flex; align-items: center; gap: 10px; background: #111; color: #fff; border-radius: 999px; padding: 10px 14px; box-shadow: 0 10px 30px rgba(0,0,0,.35); font-size: 14px; }
.avp-countdown .avp-ct-prog { position: relative; width: 120px; height: 6px; background: rgba(255,255,255,.15); border-radius: 999px; overflow: hidden; }
.avp-countdown .avp-ct-bar { height: 100%; width: 0%; background: #fff; }
.avp-countdown .avp-ct-skip { background: #fff; color: #111; border: 0; border-radius: 999px; padding: 6px 10px; cursor: pointer; }

.avp-pos-br { right: 16px; bottom: 16px; }
.avp-pos-bl { left: 16px; bottom: 16px; }
.avp-pos-tr { right: 16px; top: 16px; }
.avp-pos-tl { left: 16px; top: 16px; }
/* Center wrapper needs its own huge z-index to beat other fixed stacking contexts */
.avp-pos-center { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 2147483647; }
.avp-pos-center .avp-countdown { position: static; transform: none; padding: 18px 22px; font-size: 16px; }

@media (max-width: 480px) {
  .avp-dialog { margin: 0; max-width: 100vw; height: 100vh; border-radius: 0; }
  .avp-video  { width: 100%; height: 100%; object-fit: contain; }
}