/**
 * Mobile page end — remove the extra navy/blue band at the bottom of every page.
 *
 * Cause:
 *  - body / html / .bg-base use --color-background (navy blue, e.g. #0B1424 / #020617)
 *  - footer gradient fades to --color-black
 *  - .bottom-nav-spacer is transparent → the navy body peeks through as a stripe
 *    between the black footer end and the fixed bottom nav
 *
 * Fix (responsive only): paint the document canvas + spacer pure black so the
 * page ends cleanly. Bottom nav + "back to top" stay fixed and untouched in logic.
 */

@media (max-width: 1023.98px) {
  :root {
    /* Site navy for canvas (avoids black flash under preload). Pure black only on footer/spacer. */
    --cig-page-canvas: #0b1424;
    --cig-page-end: #000000;
  }

  /* Overscroll / canvas = official navy (NOT pure black — black caused preload flash) */
  html {
    background: var(--cig-page-canvas) !important;
    background-color: var(--cig-page-canvas) !important;
  }

  html body,
  html body.bg-base,
  html body.theme-background {
    background: var(--cig-page-canvas) !important;
    background-color: var(--cig-page-canvas) !important;
    background-image: none !important;
  }

  /* SPA shell — navy canvas; page sections keep their own styles */
  #ondagamesv1,
  #ondagamesv1 > .relative,
  #app {
    background-color: var(--cig-page-canvas) !important;
  }

  /*
   * Spacer above fixed bottom nav: was transparent, now solid black so no navy stripe.
   * Height still comes from mobile-footer-layout / mobile-scroll-chrome.
   */
  .bottom-nav-spacer,
  .bottom-nav-spacer[class],
  .cig-bottom-nav-spacer,
  [data-cig-spacer='1'] {
    background: var(--cig-page-end) !important;
    background-color: var(--cig-page-end) !important;
    background-image: none !important;
  }

  /* Footer: solid black end (no blue→black half-band under legal text) */
  .footer-wrapper,
  .footer-wrapper[class] {
    background: var(--cig-page-end) !important;
    background-color: var(--cig-page-end) !important;
    background-image: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .footer-inner,
  .footer-inner[class],
  .footer-bottom,
  .footer-bottom[class] {
    background: transparent !important;
  }

  /*
   * Profile / wallet shells that paint navy radial and leave a blue void under the card.
   * Do not kill their inner cards — only the page-level wrapper.
   */
  .vip-page,
  .vip-page[class],
  .wallet-wrapper,
  .wallet-wrapper[class],
  .deposit-page-wrapper,
  .deposit-page-wrapper[class],
  .support-wrapper,
  .support-wrapper[class] {
    background-color: var(--cig-page-end) !important;
    background-image: none !important;
  }

  /* Common page roots that force full-viewport navy */
  .game-page-root,
  .sport-game-page-root {
    /* leave games alone if they need their own chrome — only fill gaps black */
    background-color: var(--cig-page-end);
  }

  /*
   * Ensure fixed bottom nav keeps its own bar styling (do NOT force black-only
   * on .navBtn — SPA gradient is fine). Just prevent body showing around it.
   */
  .navBtn {
    /* keep existing position/size from other mobile CSS */
    box-shadow:
      0 -10px 35px rgba(0, 0, 0, 0.45),
      0 -1px 0 rgba(0, 0, 0, 0.35) !important;
  }

  /* .btn-scroll-top / .navBtn position & behavior: left to existing mobile CSS + JS */
}

/* Desktop: only neutralize overscroll bounce if any */
@media (min-width: 1024px) {
  html {
    background-color: #000;
  }
}