components/footer.js

class CustomFooter extends HTMLElement {
  connectedCallback() {
    this.attachShadow({ mode: 'open' });
    this.shadowRoot.innerHTML = `
      <style>
        footer {
          background: rgba(17, 24, 39, 0.8);
          color: #9ca3af;
          padding: 1rem;
          text-align: center;
          border-top: 1px solid rgba(56, 182, 255, 0.1);
        }
        .disclaimer {
          font-size: 0.8rem;
          opacity: 0.7;
          line-height: 1.5;
          margin-bottom: 0.5rem;
        }
      </style>
      <footer>
        <p class="disclaimer">
          Disclaimer: CrashOracle Pro provides predictions based on statistical analysis. Gambling involves risk. 
          Only play with what you can afford to lose. Must be 18+ to use our service. Predictions are not guaranteed.
        </p>
        <p class="copyright">
          &copy; ${new Date().getFullYear()} CrashOracle Pro. All rights reserved.
        </p>
      </footer>
`;
  }
}
customElements.define('custom-footer', CustomFooter);