/* ============================================
   Universal Fullscreen Lockdown
   ============================================
   When any counter or scorekeeper goes fullscreen — either via CSS
   fallback (.is-fullscreen on per-counter cards or .counter-fullscreen
   on the home counter card) or native Fullscreen API (:fullscreen) —
   we hide the site chrome (app header, footer, chat bubble bookkeeping
   left to its own reparenting) and lock the body so the fullscreen
   surface owns the entire viewport. Without this:
     - the .hv2 fixed header at z-index 1100 can poke through stacking
       contexts and clip the counter/scorekeeper's own header
     - the page can still scroll behind the fixed-position card
     - elements with z-index > 9999 (modals, chat) can float over the
       counter unexpectedly
   This is CSS-only so it works whether the fullscreen entry was via
   native API or the CSS class fallback.
*/

body:has(.is-fullscreen),
body:has(.counter-fullscreen),
body:has(:fullscreen),
body:fullscreen {
    overflow: hidden !important;
    overscroll-behavior: none;
}

/* Hide site chrome */
body:has(.is-fullscreen) .hv2,
body:has(.counter-fullscreen) .hv2,
body:has(:fullscreen) .hv2,
body:has(.is-fullscreen) .site-header,
body:has(.counter-fullscreen) .site-header,
body:has(:fullscreen) .site-header,
body:has(.is-fullscreen) .demo-footer,
body:has(.counter-fullscreen) .demo-footer,
body:has(:fullscreen) .demo-footer,
body:has(.is-fullscreen) > footer,
body:has(.counter-fullscreen) > footer,
body:has(:fullscreen) > footer {
    display: none !important;
}

/* Drop main's reserved space for the now-hidden header so anything that
   isn't actually using position:fixed still gets a clean top-of-viewport. */
body:has(.is-fullscreen) > main,
body:has(.counter-fullscreen) > main,
body:has(:fullscreen) > main {
    padding-top: 0 !important;
}

/* Promo banner / consent bar / install drawer — also hide so the user
   sees ONLY the fullscreen counter while in this mode. */
body:has(.is-fullscreen) .pwa-install-drawer,
body:has(.counter-fullscreen) .pwa-install-drawer,
body:has(:fullscreen) .pwa-install-drawer,
body:has(.is-fullscreen) .feature-banner,
body:has(.counter-fullscreen) .feature-banner,
body:has(:fullscreen) .feature-banner,
body:has(.is-fullscreen) .guest-banner,
body:has(.counter-fullscreen) .guest-banner,
body:has(:fullscreen) .guest-banner {
    display: none !important;
}