/*
 * Dead End Legacy Pages
 * Purpose: Protect existing WPBakery landing pages from future theme changes.
 * Source: CSS provided by Jason Morris for The Space Rodent and The Yellow Balloon pages.
 */

/* TSR landing page only (page-id-4462) */
/* 1) Put the background on the elements that actually paint the page */
body.page-id-4462,
body.page-id-4462 #page,
body.page-id-4462 .site {
  background:
    /* LIGHT overlay (your image is already dark) */
    linear-gradient(to bottom, rgba(0,0,0,0.12), rgba(0,0,0,0.70)),
    url("https://www.deadendfilms.org/wp-content/uploads/2026/01/bg-1-scaled.jpg") !important;
  background-size: cover !important;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-color: #000 !important;
}

/* 2) Make sure inner wrappers/rows aren't painting solid colors over it */
body.page-id-4462 .site-content,
body.page-id-4462 #content,
body.page-id-4462 #primary,
body.page-id-4462 .content-area,
body.page-id-4462 .entry-content,
body.page-id-4462 .wpb-content--blank,
body.page-id-4462 .wpb-content-wrapper,
body.page-id-4462 .wpb_wrapper,
body.page-id-4462 .vc_row,
body.page-id-4462 .vc_row-has-fill,
body.page-id-4462 .vc_column_container,
body.page-id-4462 .vc_column-inner {
  background: transparent !important;
}

/* 3) Mobile: fixed backgrounds can be flaky, this prevents disappearing/jittering issues */
@media (max-width: 1024px) {
  body.page-id-4462,
  body.page-id-4462 #page,
  body.page-id-4462 .site {
    background-attachment: scroll !important;
  }
}

/* THE YELLOW BALLOON page only */
/* Using both page-id and postid selectors just in case your theme outputs one or both */
body.page-id-4846,
body.postid-4846,
body.page-id-4846 #page,
body.postid-4846 #page,
body.page-id-4846 .site,
body.postid-4846 .site {
  background:
    linear-gradient(
      to bottom,
      rgba(0,0,0,0.18),
      rgba(0,0,0,0.58),
      rgba(0,0,0,0.82)
    ),
    url("https://www.deadendfilms.org/wp-content/uploads/2026/04/Webpage-Background_Cabin.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-color: #000 !important;
}

/* Make sure inner wrappers are not painting over the background */
body.page-id-4846 .site-content,
body.postid-4846 .site-content,
body.page-id-4846 #content,
body.postid-4846 #content,
body.page-id-4846 #primary,
body.postid-4846 #primary,
body.page-id-4846 .content-area,
body.postid-4846 .content-area,
body.page-id-4846 .entry-content,
body.postid-4846 .entry-content,
body.page-id-4846 .wpb-content--blank,
body.postid-4846 .wpb-content--blank,
body.page-id-4846 .wpb-content-wrapper,
body.postid-4846 .wpb-content-wrapper,
body.page-id-4846 .wpb_wrapper,
body.postid-4846 .wpb_wrapper,
body.page-id-4846 .vc_row,
body.postid-4846 .vc_row,
body.page-id-4846 .vc_row-has-fill,
body.postid-4846 .vc_row-has-fill,
body.page-id-4846 .vc_column_container,
body.postid-4846 .vc_column_container,
body.page-id-4846 .vc_column-inner,
body.postid-4846 .vc_column-inner {
  background: transparent !important;
}

/* Mobile fix: fixed backgrounds can disappear or jitter */
@media (max-width: 1024px) {
  body.page-id-4846,
  body.postid-4846,
  body.page-id-4846 #page,
  body.postid-4846 #page,
  body.page-id-4846 .site,
  body.postid-4846 .site {
    background-attachment: scroll !important;
  }
}

/* THE YELLOW BALLOON 2 page only */
/* Using both page-id and postid selectors just in case your theme outputs one or both */
body.page-id-4930,
body.postid-4930,
body.page-id-4930 #page,
body.postid-4930 #page,
body.page-id-4930 .site,
body.postid-4930 .site {
  background:
    linear-gradient(
      to bottom,
      rgba(0,0,0,0.18),
      rgba(0,0,0,0.58),
      rgba(0,0,0,0.82)
    ),
    url("https://www.deadendfilms.org/wp-content/uploads/2026/04/Webpage-Background_Cabin.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-color: #000 !important;
}

/* Make sure inner wrappers are not painting over the background */
body.page-id-4930 .site-content,
body.postid-4930 .site-content,
body.page-id-4930 #content,
body.postid-4930 #content,
body.page-id-4930 #primary,
body.postid-4930 #primary,
body.page-id-4930 .content-area,
body.postid-4930 .content-area,
body.page-id-4930 .entry-content,
body.postid-4930 .entry-content,
body.page-id-4930 .wpb-content--blank,
body.postid-4930 .wpb-content--blank,
body.page-id-4930 .wpb-content-wrapper,
body.postid-4930 .wpb-content-wrapper,
body.page-id-4930 .wpb_wrapper,
body.postid-4930 .wpb_wrapper,
body.page-id-4930 .vc_row,
body.postid-4930 .vc_row,
body.page-id-4930 .vc_row-has-fill,
body.postid-4930 .vc_row-has-fill,
body.page-id-4930 .vc_column_container,
body.postid-4930 .vc_column_container,
body.page-id-4930 .vc_column-inner,
body.postid-4930 .vc_column-inner {
  background: transparent !important;
}

/* Mobile fix: fixed backgrounds can disappear or jitter */
@media (max-width: 1024px) {
  body.page-id-4930,
  body.postid-4930,
  body.page-id-4930 #page,
  body.postid-4930 #page,
  body.page-id-4930 .site,
  body.postid-4930 .site {
    background-attachment: scroll !important;
  }
}
