/*
 * Theme switch: a circular reveal that spreads from the toggle.
 *
 * Shared by the public pages (landing / about / login / complete profile,
 * which theme on `html.dark-mode`) and by all four portals through
 * layouts/dashboard.php (`body.dark-mode`). The engine is
 * public/js/theme-wipe.js — see it for the two rendering paths.
 *
 * Do not fork this file per portal. The `animation: none` below is exactly the
 * kind of rule that breaks silently in the copy nobody remembered to update.
 */

/* ── Path 1: the View Transitions API (Chromium, Safari) ──
 * These selectors are unknown to a browser without the API, which drops the
 * rules — which is precisely the wanted behaviour, since path 2 takes over.
 */
::view-transition-old(root),
::view-transition-new(root) {
    /* Replace the default cross-fade — the disc IS the transition. Leaving it
       on plays both at once and the wipe reads as a muddy dissolve. */
    animation: none;
    mix-blend-mode: normal;
}
::view-transition-old(root) { z-index: 0; }
::view-transition-new(root) { z-index: 1; }

/* ── Path 2: an overlay disc, for everything else ── */
.theme-wipe {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Above the portals' modals and sidebar, and the public pages' loader. */
    z-index: 2147483000;
    pointer-events: none;
    will-change: clip-path;
}

/* No wipe at all when motion is unwelcome — the theme just changes. */
@media (prefers-reduced-motion: reduce) {
    .theme-wipe { display: none; }
}