/* OnlyShows v53: fixed, user-supplied blur wallpapers. */
html[data-background="prism-mono"] {
  --onlyshows-wallpaper-desktop: url("./assets/backgrounds/light-blur-desktop.webp");
  --onlyshows-wallpaper-mobile: url("./assets/backgrounds/light-blur-mobile.webp");
  --onlyshows-wallpaper-base: #aeb7c2;
  --onlyshows-wallpaper-overlay: linear-gradient(rgba(248, 245, 238, .28), rgba(248, 245, 238, .28));
}

html[data-background="prism-violet"] {
  --onlyshows-wallpaper-desktop: url("./assets/backgrounds/dark-blur-desktop.webp");
  --onlyshows-wallpaper-mobile: url("./assets/backgrounds/dark-blur-mobile.webp");
  --onlyshows-wallpaper-base: #031014;
  --onlyshows-wallpaper-overlay: linear-gradient(rgba(0, 7, 9, .26), rgba(0, 7, 9, .26));
}

html[data-background="prism-mono"] body > .theme-backdrop,
html[data-background="prism-violet"] body > .theme-backdrop {
  background-color: var(--onlyshows-wallpaper-base) !important;
  background-image: var(--onlyshows-wallpaper-overlay), var(--onlyshows-wallpaper-desktop) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.background-preview-mono {
  background-image: linear-gradient(rgba(248, 245, 238, .28), rgba(248, 245, 238, .28)), url("./assets/backgrounds/light-blur-mobile.webp") !important;
  background-position: center !important;
  background-size: cover !important;
}

.background-preview-violet {
  background-image: linear-gradient(rgba(0, 7, 9, .26), rgba(0, 7, 9, .26)), url("./assets/backgrounds/dark-blur-mobile.webp") !important;
  background-position: center !important;
  background-size: cover !important;
}

@media (max-width: 719px) {
  html[data-background="prism-mono"] body > .theme-backdrop,
  html[data-background="prism-violet"] body > .theme-backdrop {
    background-image: var(--onlyshows-wallpaper-overlay), var(--onlyshows-wallpaper-mobile) !important;
  }
}