/* =========================================================
   WildRoute — Dark Force
   Location: assets/css/css-front/dark-force.css
   This file MUST be the LAST stylesheet on every page.
   It exists for one purpose: paint html, body, and every
   common page wrapper dark. Nothing else.
   ========================================================= */

/* HIGHEST SPECIFICITY: html body:not(.x) = (0,1,2) + !important
   Beats any `body { background:#fff }`, `.wrapper { background:#fff }`,
   `body { background:#fff !important }` (specificity 0,0,1) it can meet. */
html body:not(.wf-does-not-exist),
html body.wf-does-not-exist {
  background-color: #050816 !important;
  background-image:
    radial-gradient(60% 40% at 85% 0%, rgba(47, 91, 255, 0.28), transparent 70%),
    radial-gradient(50% 35% at 0% 60%, rgba(47, 91, 255, 0.16), transparent 70%) !important;
  color: #ffffff !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  color-scheme: dark !important;
}

html {
  background-color: #050816 !important;
  min-height: 100% !important;
  color-scheme: dark !important;
  overscroll-behavior-y: none !important;
}

/* Every wrapper between <body> and <main> must be transparent */
html body:not(.wf-does-not-exist) #page,
html body:not(.wf-does-not-exist) #wrapper,
html body:not(.wf-does-not-exist) #app,
html body:not(.wf-does-not-exist) #root,
html body:not(.wf-does-not-exist) #content,
html body:not(.wf-does-not-exist) #main-content,
html body:not(.wf-does-not-exist) .page,
html body:not(.wf-does-not-exist) .page-wrapper,
html body:not(.wf-does-not-exist) .site,
html body:not(.wf-does-not-exist) .site-wrapper,
html body:not(.wf-does-not-exist) .site-content,
html body:not(.wf-does-not-exist) .wrapper,
html body:not(.wf-does-not-exist) .main-wrapper,
html body:not(.wf-does-not-exist) .content-wrapper,
html body:not(.wf-does-not-exist) .app,
html body:not(.wf-does-not-exist) .layout,
html body:not(.wf-does-not-exist) .container,
html body:not(.wf-does-not-exist) .container-fluid {
  background-color: transparent !important;
  background-image: none !important;
}

/* Any bare <div> child of <body> that is not our known elements
   must be transparent so the dark body shows through */
html body:not(.wf-does-not-exist) > div:not([class]):not([id]) {
  background-color: transparent !important;
}

/* Header + footer hard dark */
html body:not(.wf-does-not-exist) > header,
html body:not(.wf-does-not-exist) > footer,
html body:not(.wf-does-not-exist) .wr-header,
html body:not(.wf-does-not-exist) .site-header,
html body:not(.wf-does-not-exist) .main-header,
html body:not(.wf-does-not-exist) .site-footer,
html body:not(.wf-does-not-exist) .main-footer,
html body:not(.wf-does-not-exist) footer,
html body:not(.wf-does-not-exist) header {
  background-color: #0d1330 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/* Kill any leftover white from a reset's `* { background: #fff }` */
html body:not(.wf-does-not-exist) * {
  color-scheme: dark;
}

/* iOS Safari: no white strip at top / bottom */
@supports (-webkit-touch-callout: none) {
  html,
  html body:not(.wf-does-not-exist) {
    background-color: #050816 !important;
  }
}

/* =========================================================
   END
   ========================================================= */