// ==UserScript==
// @name         Shredsauce dark Theme
// @namespace    stylish
// @version      1.6
// @description  All-black dark theme + Gheat Menu for Shredsauce website by Gheat
// @match        *://shredsauce.com/*
// @run-at       document-start
// @grant        none
// @license      CC-BY-4.0
// @downloadURL none
// ==/UserScript==

(function() {
    const style = document.createElement('style');
    style.innerText = `
        body, html {
            background-color: #000 !important;
            color: #fff !important;
        }

        mobileContainer, #webContainer, .scroll-section, .carousel, .navbar, footer, #contentContainer, #playerContainerOverlay {
            background-color: #000 !important;
            color: #fff !important;
        }

        button, .btn, .flickity-button, .playButton, #playButton {
            background-color: #333 !important;
            color: #fff !important;
            border: 1px solid #555 !important;
        }

        button:hover, .btn:hover, .flickity-button:hover, .playButton:hover, #playButton:hover {
            background-color: #444 !important;
        }

        .navbar, .navbar nav ul li a, .social-icons a, .dropdown-content a, .logoContainer img, .videoOverlayLogo {
            filter: brightness(0) invert(1) !important;
        }

        #playContainerInfoBox, .updateTitle, .text, .leaderboardContainer, .skyscraperContainer, .pull-right, .clearfix {
            background-color: #000 !important;
            color: #fff !important;
        }

        img, video, .carousel img, .flickity-button svg, .videoOverlayLogo {
            filter: brightness(0.8) !important;
        }

        #playIcon path {
            fill: #fff !important;
        }

        a, a:link, a:visited {
            color: #66ccff !important;
        }

        a:hover {
            color: #00aaff !important;
        }

        .adContainer, .adsbygoogle, iframe, [class*="ad"], .ad-container, #div-gpt-ad, .banner-ad, .myAds {
            display: none !important;
        }

        * {
            background-color: transparent !important;
        }

        #gheat-message {
            position: fixed;
            bottom: 10px;
            right: 20px;
            font-size: 12px;
            color: #aaa;
            font-family: monospace;
            z-index: 99999;
        }
        #leaderboardContainer,
#skyscraperContainer,
div[class*="8p7p6pdb282"] {
    display: none !important;
}
    `;
    document.head.appendChild(style);

    window.addEventListener('load', () => {
        // credit msg
        const msg = document.createElement('div');
        msg.id = 'gheat-message';
        msg.innerText = 'https://sites.google.com/view/shredhub/home - Gheat';
        document.body.appendChild(msg);

        const allowedIds = ['webContainer', 'mobileContainer', 'gheat-message', 'gheat-menu'];

        function nukeUnwanted() {
            [...document.body.children].forEach(el => {
                const isAllowed = allowedIds.includes(el.id);
                if (!isAllowed) el.remove();
            });

            document.querySelectorAll('div[style]').forEach(div => {
                const style = div.getAttribute('style')?.trim();
                if (style && style.startsWith('bottom:')) {
                    div.remove();
                }
            });
        }

        setTimeout(() => {
            allowedIds.push('gheat-menu');
            nukeUnwanted();

            const observer = new MutationObserver(() => nukeUnwanted());
            observer.observe(document.body, { childList: true, subtree: true });
        }, 5000);
    });
})();
window.addEventListener('load', () => {
    // clear the top title
    const titleDiv = document.querySelector('.updateTitle');
    if (titleDiv) titleDiv.textContent = '';

    // replace entire text block
    const msgContainer = document.querySelector('.text');
    if (msgContainer) {
        msgContainer.innerHTML = `
            <em>sites.google.com/view/shredhub</em><br>
            <em>April 6 2025</em><br><br>
            Thank you for using my theme<br><br>
            - Gheat
        `;
    }
});
window.addEventListener('load', () => {
  // create the menu
  const menu = document.createElement('div');
  menu.id = 'gheat-menu';
  menu.innerHTML = `
  <div style="
  position: fixed;
 top: 50%;
  right: 20px;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.75);
  color: white;
  font-family: Arial, sans-serif;
  padding: 20px;
  border-radius: 12px;
  z-index: 99999;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  text-align: center;
  width: max-content;
">
    <div style="font-weight: bold; font-size: 16px; margin-bottom: 12px;">Gheat Menu</div>
    <button id="cheatBtn" style="display: block; margin: 8px auto; padding: 8px 16px; border: none; border-radius: 6px; background: #444; color: white; cursor: pointer;">
      Cheat Sheet
    </button>
    <button id="toolsBtn" style="display: block; margin: 8px auto; padding: 8px 16px; border: none; border-radius: 6px; background: #444; color: white; cursor: pointer;">
      Tools
    </button>
  </div>
`;

  // add to page
  document.body.appendChild(menu);

  // add working button listeners
  document.getElementById('cheatBtn').onclick = () => {
    window.open('https://sites.google.com/view/shredhub/cheats', '_blank');
  };

  document.getElementById('toolsBtn').onclick = () => {
    alert('Tools menu coming soon 😎');
  };
});