/* LineDancer Radio site-wide fixed background.
 * A fixed pseudo-element is used instead of background-attachment: fixed
 * because iOS/iPadOS Safari does not reliably support fixed body backgrounds.
 */
:root {
  --ldrfe-site-background: url("https://linedancer-radio.com/wp-content/uploads/2026/05/544F0E95-3641-4282-8A02-28D240D76720.png");
}

html {
  min-height: 100%;
  background: #050b18;
}

body:not(.wp-admin) {
  min-height: 100%;
  background: transparent !important;
  isolation: isolate;
}

body:not(.wp-admin)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  pointer-events: none;
  background-color: #050b18;
  background-image: var(--ldrfe-site-background);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  will-change: transform;
}

/* Keep Elementor's outer page canvas transparent so the fixed image remains visible.
 * Individual sections/cards can still use their own backgrounds in Elementor.
 */
body:not(.wp-admin) #page,
body:not(.wp-admin) .site,
body:not(.wp-admin) .site-content,
body:not(.wp-admin) .content-area,
body:not(.wp-admin) .elementor-location-single,
body:not(.wp-admin) .elementor-location-archive,
body:not(.wp-admin) .elementor-page,
body:not(.wp-admin) .elementor-page > .elementor {
  background-color: transparent;
}

@media (max-width: 1024px) {
  body:not(.wp-admin)::before {
    /* Slightly wider rendering prevents exposed edges during mobile browser resizing. */
    inset: -2px;
    width: calc(100vw + 4px);
    height: calc(100vh + 4px);
    height: calc(100dvh + 4px);
  }
}
