class NsfwWarning extends HTMLElement {
  connectedCallback() {
    this.attachShadow({ mode: 'open' });
    this.shadowRoot.innerHTML = `
      <style>
        .nsfw-warning {
          position: fixed;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background: rgba(0,0,0,0.9);
          z-index: 9999;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          text-align: center;
          padding: 2rem;
        }
        .nsfw-warning h2 {
          font-size: 2.5rem;
          color: #ef4444;
          margin-bottom: 1.5rem;
        }
        .nsfw-warning p {
          font-size: 1.2rem;
          color: white;
          max-width: 600px;
          margin-bottom: 2rem;
        }
        .nsfw-warning button {
          background: #ef4444;
          color: white;
          border: none;
          padding: 1rem 2rem;
          font-size: 1.1rem;
          border-radius: 5px;
          cursor: pointer;
          transition: background 0.3s;
        }
        .nsfw-warning button:hover {
          background: #dc2626;
        }
      </style>
      <div class="nsfw-warning">
        <h2>ADULT CONTENT WARNING</h2>
        <p>This website contains adult content and is intended for mature audiences only. By entering, you confirm that you are at least 18 years of age or the legal age in your jurisdiction to view such material.</p>
        <button id="enter-btn">ENTER SITE</button>
        <a href="https://www.google.com" style="color: #999; margin-top: 1rem;">I want to leave</a>
      </div>
    `;

    this.shadowRoot.getElementById('enter-btn').addEventListener('click', () => {
      this.remove();
      document.cookie = "nsfw_warning_accepted=true; path=/; max-age=86400"; // 1 day
    });
  }
}

customElements.define('nsfw-warning', NsfwWarning);