/* ========================================================================== Scroll Enhancer — scroll-enhancer.css ========================================================================== */ /* ------------------------------------------------------------------ 1. SMOOTH SCROLLING Also applied inline on via PHP for instant effect before this file loads. Reduced-motion users get instant jumps. ------------------------------------------------------------------ */ html { scroll-behavior: smooth; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } /* ------------------------------------------------------------------ 2. HIDE SCROLLBAR — cross-browser The page stays fully scrollable; only the visual bar is removed. ------------------------------------------------------------------ */ /* Firefox */ html { scrollbar-width: none; } /* IE / legacy Edge */ html, body { -ms-overflow-style: none; } /* Chrome, Safari, Opera — target both html and body to be safe */ html::-webkit-scrollbar, body::-webkit-scrollbar { display: none; width: 0; height: 0; } /* ------------------------------------------------------------------ 3. KEEP THE THEME'S EXISTING BACK-TO-TOP BUTTON VISIBLE Hiding the scrollbar can sometimes push the browser's scrollbar layer on top of fixed/absolute elements, or themes may set a z-index that conflicts. This ruleset covers the most common class names and IDs used by popular WordPress themes and plugins (Astra, OceanWP, GeneratePress, Hello Elementor, Flatsome, Neve, Divi, WP Rocket, Jetpack, etc.). The JS in scroll-enhancer.js also auto-detects and patches any button the CSS list might miss. ------------------------------------------------------------------ */ /* — Common ID selectors — */ #scroll-to-top, #scrollToTop, #back-to-top, #backToTop, #back_to_top, #toTop, #to-top, #gotop, #go-top, #scrolltop, #scroll-top, #topBtn, #top-btn, #returnTop, #scrollUp, #scroll-up, /* — Common class selectors — */ .scroll-to-top, .scrollToTop, .back-to-top, .backToTop, .back_to_top, .to-top, .toTop, .gotop, .go-top, .scrolltop, .scroll-top, .topBtn, .top-btn, .returnTop, .scrollUp, .scroll-up, /* — Theme-specific selectors — */ .ast-scroll-to-top, /* Astra */ .oceanwp-scroll-top, /* OceanWP */ .scroll-top.back-to-top, /* GeneratePress */ .go-top, /* Flatsome */ .navbar-fixed .go-top, .nv-top-scroll-btn, /* Neve */ .et_pb_scroll_top, /* Divi */ .elementor-button.scroll-to-top, /* Elementor */ .wprocket-back-to-top, /* WP Rocket */ .site-scroll-top, .wpex-scrolltop, /* Total theme */ .themify-back-top, /* Themify */ .uabb-scroll-to-top, /* Ultimate Addons */ .sahf-scroll-to-top, .btt-button, /* Back to Top Button plugin */ #btt-button, .backtotop, #backtotop, .back-top, #back-top { position: fixed !important; z-index: 99999 !important; /* * Do NOT force display/visibility here — the theme controls * show/hide logic via its own classes (active, visible, show, etc.). * We only guarantee the button sits above the scrollbar layer. */ }