/* com_nxnpage — kiegészítések az SPPB-kivonathoz (sppb-base.css). */

/* Belépő animáció: csak akkor rejt, ha a JS bekapcsolta (html.nxnpage-anim), és a JS
   vagy a 3 mp-es biztonsági időzítő mindenképp feloldja. */
/* Az animate.css osztálya (pl. fadeInUp) már a HTML-ben rajta van: amíg nem látszik, az
   animáció-név ki van kapcsolva, különben rejtve futna le. */
.nxnpage-anim .sppb-wow:not(.sppb-animated) { visibility: hidden; animation-name: none !important; }
.sppb-wow.sppb-animated { animation-duration: 1s; animation-fill-mode: both; }

@media (prefers-reduced-motion: reduce) {
  .nxnpage-anim .sppb-wow:not(.sppb-animated) { visibility: visible; }
  .sppb-wow.sppb-animated { animation: none !important; }
}

/* Az accordion fejléce gomb: az SPPB reset-osztálya mellett a fókusz látszódjon. */
.sppb-panel-heading:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Előnézet (piszkozat) jelzése a szerkesztőnek. */
.nxnpage-preview-bar {
  position: sticky;
  top: 0;
  z-index: 10000;
  padding: .5rem 1rem;
  background: #fff3cd;
  color: #664d03;
  border-bottom: 1px solid #ffe69c;
  font: 600 14px/1.4 system-ui, sans-serif;
  text-align: center;
}

/* Fülek: a fókusz látszódjon. */
.sppb-nav a[data-toggle="sppb-tab"]:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Galéria-nagyítás (nxnpage.js, <dialog>). */
.nxnpage-lightbox { padding: 0; border: 0; background: transparent; max-width: 96vw; max-height: 96vh; overflow: visible; }
.nxnpage-lightbox::backdrop { background: rgba(0, 0, 0, .85); }
.nxnpage-lightbox figure { margin: 0; text-align: center; }
.nxnpage-lightbox img { display: block; max-width: 92vw; max-height: 86vh; margin: 0 auto; }
.nxnpage-lightbox figcaption { color: #fff; padding: .6rem 1rem 0; font: 15px/1.4 system-ui, sans-serif; }
.nxnpage-lightbox button {
  position: fixed; border: 0; background: rgba(0, 0, 0, .45); color: #fff; font: 600 34px/1 system-ui, sans-serif;
  width: 48px; height: 48px; border-radius: 50%; cursor: pointer;
}
.nxnpage-lightbox button:hover, .nxnpage-lightbox button:focus-visible { background: rgba(0, 0, 0, .75); }
.nxnpage-lb-prev { left: 12px; top: 50%; transform: translateY(-50%); }
.nxnpage-lb-next { right: 12px; top: 50%; transform: translateY(-50%); }
.nxnpage-lb-close { right: 12px; top: 12px; }
