<!-- BEGIN COPY / PASTE -->
    // App.js
    import React, { useState } from 'react';
    import './App.css';

    function App() {
      const [darkMode, setDarkMode] = useState(false);

      const toggleDarkMode = () => {
        setDarkMode(!darkMode);
        document.documentElement.setAttribute('data-theme', darkMode ? 'light' : 'dark');
      };

      return (
        <div className="App">
          <button onClick={toggleDarkMode}>
            Toggle Dark Mode
          </button>
        </div>
      );
    }

    export default App;

    /* App.css */
    :root {
      --background-color: white;
      --text-color: black;
    }

    [data-theme="dark"] {
      --background-color: black;
      --text-color: white;
    }

    .App {
      background-color: var(--background-color);
      color: var(--text-color);
      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    <!-- END COPY / PASTE -->