Как сделать кнопку смены темы влияющую на все контролы на экране без JavaScript

Используя CSS-переменные и `prefers-color-scheme`, можно реализовать смену тем без JavaScript. 1. Определяем переменные для тем: ```css :root { --bg-color: #fff; --text-color: #000; } @media (prefers-color-scheme: dark) { :root { --bg-color: #222; --text-color: #fff; } } ``` 2. Применяем переменные к элементам: ```css body { background: var(--bg-color); color: var(--text-color); } button { background: var(--bg-color); color: var(--text-color); border: 1px solid var(--text-color); } ``` 3. Для ручного переключения можно использовать чекбокс + `:has()` (если поддерживается): ```css .theme-toggle:checked ~ * { --bg-color: #222; --text-color: #fff; } ``` Пример HTML: ```html Toggle theme ``` Недостаток: без JavaScript сложно сохранять выбор темы между страницами.