/* ==========================================================================
   Nexsage popups — modal / slide-in / banner / fullscreen. Uses theme tokens.
   Hidden by default (no CLS); shown via .is-open.
   ========================================================================== */
.nx-popup { position: fixed; z-index: var(--nx-z-popup, 2000); inset: 0; display: none; }
.nx-popup.is-open { display: block; }
.nx-popup[hidden] { display: none; }

.nx-popup__overlay { position: absolute; inset: 0; background: rgba(11,27,63,.55); opacity: 0; transition: opacity .3s ease; }
.nx-popup.is-open .nx-popup__overlay { opacity: 1; }

.nx-popup__box {
  position: relative; background: #fff; border-radius: var(--nx-r-lg, 24px);
  box-shadow: var(--nx-sh-lg, 0 24px 60px -20px rgba(15,23,42,.4));
  padding: clamp(1.5rem, 4vw, 2.5rem); width: min(520px, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); overflow: auto;
}
.nx-popup__close {
  position: absolute; top: .75rem; right: .75rem; width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center; color: var(--nx-slate, #475569); background: var(--nx-mist, #F8FAFC);
}
.nx-popup__close:hover { background: var(--nx-line, #E2E8F0); color: var(--nx-navy-ink, #222A41); }
.nx-popup__content h2, .nx-popup__content h3 { margin-bottom: .5rem; }
.nx-popup__content p { margin-bottom: 1rem; }

/* Centered modal */
.nx-popup--modal .nx-popup__box,
.nx-popup--fullscreen .nx-popup__box { margin: auto; position: absolute; inset: 0; height: max-content; }
.nx-popup--modal .nx-popup__box { transform: translateY(12px) scale(.98); opacity: 0; transition: transform .35s cubic-bezier(.16,1,.3,1), opacity .3s ease; }
.nx-popup--modal.is-open .nx-popup__box { transform: translateY(0) scale(1); opacity: 1; }

/* Slide-in corner */
.nx-popup--slide-in .nx-popup__overlay { background: transparent; pointer-events: none; }
.nx-popup--slide-in .nx-popup__box { position: absolute; width: min(380px, calc(100vw - 2rem)); transform: translateX(120%); opacity: 0; transition: transform .4s cubic-bezier(.16,1,.3,1), opacity .3s ease; pointer-events: auto; }
.nx-popup--slide-in.nx-popup--bottom-right .nx-popup__box { right: 1.25rem; bottom: 1.25rem; }
.nx-popup--slide-in.is-open .nx-popup__box { transform: translateX(0); opacity: 1; }

/* Banner */
.nx-popup--banner .nx-popup__overlay { display: none; }
.nx-popup--banner .nx-popup__box {
  position: absolute; left: 0; right: 0; width: 100%; max-width: 100%; border-radius: 0;
  display: flex; align-items: center; justify-content: center; gap: 1.5rem; padding: 1rem 3rem;
  transform: translateY(-100%); transition: transform .4s cubic-bezier(.16,1,.3,1);
}
.nx-popup--banner.nx-popup--bottom .nx-popup__box { bottom: 0; top: auto; transform: translateY(100%); }
.nx-popup--banner.nx-popup--top .nx-popup__box { top: 0; }
.nx-popup--banner.is-open .nx-popup__box { transform: translateY(0); }
.nx-popup--banner .nx-popup__content { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; justify-content: center; }
.nx-popup--banner .nx-popup__content p { margin: 0; }

/* Fullscreen */
.nx-popup--fullscreen .nx-popup__box { width: 100%; max-width: 100%; height: 100%; max-height: 100%; border-radius: 0; display: grid; place-content: center; text-align: center; }

@media (prefers-reduced-motion: reduce) {
  .nx-popup__box, .nx-popup__overlay { transition: none !important; }
}