/* public/css/kq-bg-core.css - core helpers (animation-only, no background overrides) */
.kq-bg-section {
  position: relative;
  overflow: visible;
  min-height: 100vh;
  background: transparent; /* do not force a background; user will set group background */
  --kq-overlay-z: 0;
}

/* section-scoped canvas if present */
.kq-bg-section .kq-bg-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: var(--kq-overlay-z);
}

/* fallback canvas (used when overlay appended to body) */
.kq-bg-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: var(--kq-overlay-z);
}

/* Force content above overlays (very large z-index to avoid theme stacking surprises) */
.kq-bg-section .kq-bg-content,
.kq-leaderboard,
.kq-bg-content {
  position: relative !important;
  z-index: 100001 !important; /* keep content above overlay */
  box-sizing: border-box;
  pointer-events: auto !important;
}

/* Global overlay containers (default absolute; JS may switch to fixed for rare full-screen fallback) */
.kq-bg-asteroids-overlay,
.kq-bg-fairy-overlay,
.kq-bg-firecrackers-overlay,
.kq-bg-bouncing-overlay,
.kq-bg-snake-overlay,
.kq-bg-ocean-overlay,
.kq-bg-moonrain-overlay,
.kq-bg-generic-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 0 !important;
}

/* full/auto fallback: fixed but still no background colors */
.kq-bg-asteroids-overlay[data-kq-bg-auto="1"],
.kq-bg-fairy-overlay[data-kq-bg-auto="1"],
.kq-bg-firecrackers-overlay[data-kq-bg-auto="1"],
.kq-bg-bouncing-overlay[data-kq-bg-auto="1"],
.kq-bg-snake-overlay[data-kq-bg-auto="1"],
.kq-bg-ocean-overlay[data-kq-bg-auto="1"],
.kq-bg-moonrain-overlay[data-kq-bg-auto="1"],
.kq-bg-generic-overlay[data-kq-bg-auto="1"] {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  inset: 0;
  z-index: 0 !important;
  pointer-events: none;
  overflow: hidden;
}

/* interactive elements inside overlays must receive pointer events */
.kq-bg-asteroids-overlay .kq-bg-rocket,
.kq-bg-section .kq-bg-rocket,
.kq-bg-fairy-overlay .kq-fairy,
.kq-bg-generic-overlay .kq-bg-interactive {
  pointer-events: auto;
  user-select: none;
  touch-action: none;
}

/* reduced motion helper */
.kq-bg-reduced-motion * { animation: none !important; transition: none !important; }

/* removed: theme background neutralization — user manages group background via editor */

/* Keep WP adminbar visible and functional */
.kq-bg-active #wpadminbar,
.kq-bg-section.kq-bg-active #wpadminbar { z-index: 100000 !important; position: relative !important; }

/* small responsive tweak */
@media (max-width:760px) {
  .kq-bg-section .kq-bg-rocket { transform-origin: 40% 50%; }
}