/* Shared theme infrastructure. Visual layers never intercept FieldOps controls. */
body[data-theme] {
  min-height: 100vh;
  position: relative;
  isolation: isolate;
}

body[data-theme] > nav,
body[data-theme] > footer {
  position: relative;
  z-index: 2;
}

/* Do not create a stacking context around page modals. Bootstrap appends the
   modal backdrop to <body>; trapping a modal inside z-index:2 puts that
   backdrop above the dialog and blocks every click. */
body[data-theme] > .container-xl {
  position: relative;
}

.theme-effects {
  position: fixed;
  inset: 0;
  z-index: 20;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
}

.theme-effects .theme-fx {
  position: absolute;
  display: block;
  pointer-events: none;
  user-select: none;
  will-change: transform, opacity;
}

.theme-burst {
  position: fixed;
  z-index: 10000;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.4) rotate(-6deg);
  opacity: 0;
  animation: theme-burst-pop .8s cubic-bezier(.16,.9,.25,1) forwards;
}

@keyframes theme-burst-pop {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.35) rotate(-10deg); }
  24% { opacity: 1; transform: translate(-50%, -50%) scale(1.12) rotate(3deg); }
  72% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-2deg); }
  100% { opacity: 0; transform: translate(-50%, -65%) scale(.92) rotate(-2deg); }
}

/* Admin previews are self-contained and do not depend on the active theme. */
.theme-choice-card {
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
}
.theme-choice-card:hover { transform: translateY(-2px); }
.theme-choice-card.is-active { box-shadow: 0 0 0 3px rgba(46,125,50,.35); }
.theme-preview {
  min-height: 128px;
  padding: 1.25rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  font-size: 1.05rem;
}
.theme-preview > * { position: relative; z-index: 1; }
.theme-preview > i { font-size: 2.2rem; }
.theme-preview-orb {
  position: absolute;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  top: -34px;
  right: -20px;
  filter: blur(2px);
}
.theme-preview-standard .theme-preview {
  color: #fff;
  background: linear-gradient(135deg,#1b5e20,#7cb342);
}
.theme-preview-standard .theme-preview-orb { background: rgba(255,255,255,.18); }
.theme-preview-cyberpunk .theme-preview {
  color: #9ffcff;
  background: repeating-linear-gradient(90deg,rgba(0,246,255,.08) 0 1px,transparent 1px 22px),linear-gradient(135deg,#08041f,#3e075b 55%,#001f36);
}
.theme-preview-cyberpunk .theme-preview-orb { background: #ff20c8; box-shadow: 0 0 35px #ff20c8; }
.theme-preview-halloween .theme-preview {
  color: #ffb13b;
  background: radial-gradient(circle at 80% 18%,#f47b20 0 10%,transparent 11%),linear-gradient(145deg,#100716,#341126);
}
.theme-preview-halloween .theme-preview-orb { background: rgba(238,65,20,.5); box-shadow: 0 0 35px #e33b12; }
.theme-preview-xmas_nightmare .theme-preview {
  color: #fff;
  background: linear-gradient(155deg,#091b19,#123d33 57%,#5b0710);
}
.theme-preview-xmas_nightmare .theme-preview-orb { background: #b80f22; box-shadow: 0 0 28px #ff2942; }
.theme-preview-comic .theme-preview {
  color: #111;
  background-color: #ffd83d;
  background-image: radial-gradient(#111 1px,transparent 1px);
  background-size: 7px 7px;
  border-bottom: 5px solid #111;
}
.theme-preview-comic .theme-preview-orb { background: #e82d2d; border: 5px solid #111; }

@media (prefers-reduced-motion: reduce) {
  .theme-effects { display: none !important; }
  .theme-burst { animation: none !important; }
  body[data-theme] *, body[data-theme] *::before, body[data-theme] *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}