/* PER-TYPE ANIMATION SWITCHES (issue #1821): one rule group per animation type. `client/js/motion-setting.js` paints this
 * browser's switched-off ids as `data-anim-off="<ids>"` on <html> (before first paint); a type listed there loses its
 * CSS animation at once, live, no reload. ABSENT MEANS EVERY TYPE ON. The ids are the list in
 * web/src/lib/motion/animation-types.ts. Rules that stop motion for everything at once (`data-motion="off"`) live in
 * animation-pause.css. The JS-driven types (theme-backdrop, cursor-blink, swarm-characters, layout-moves) have no
 * rule here: effects-base.js, motion-setting.js, clock.ts and viewport.svelte.ts read the same attribute.
 * `transitions` drops every CSS transition, so the end state shows with no easing.
 * Selectors name the elements that carry the keyframes (inventory: docs/animation-type-switches.md). */

@layer legacy {
/* status-lights: the status light's spinning ring and breathing glow, the status dot pulses, the connected badge pulse */
:root[data-anim-off~="status-lights"] .status-led,
:root[data-anim-off~="status-lights"] .status-led::before,
:root[data-anim-off~="status-lights"] .status-led::after,
:root[data-anim-off~="status-lights"] .status-dot,
:root[data-anim-off~="status-lights"] .status-dot::before,
:root[data-anim-off~="status-lights"] .status-dot::after,
:root[data-anim-off~="status-lights"] .status.connected,
:root[data-anim-off~="status-lights"] .status.connected::before,
:root[data-anim-off~="status-lights"] .status.connected::after,
:root[data-anim-off~="status-lights"] .mw-step,
:root[data-anim-off~="status-lights"] .mw-step::before,
:root[data-anim-off~="status-lights"] .mw-step::after {
    animation: none !important;
}

/* avatar-spiral: the account avatar's turning spiral */
:root[data-anim-off~="avatar-spiral"] .session-sidebar-bar__avatar .spiral-turn {
    animation: none !important;
}

/* terminal-ring: the breathing ring around the selected terminal */
:root[data-anim-off~="terminal-ring"] .oc-frame[data-oc-focus]:not(.oc-frame-terminal)::before {
    animation: none !important;
}

/* dialog-glow: the glow that circles a dialog or popup edge */
:root[data-anim-off~="dialog-glow"] .popup-focus,
:root[data-anim-off~="dialog-glow"] .popup-focus-turn > .pf-sheen::before,
:root[data-anim-off~="dialog-glow"] .modal-content > .mg-sheen::before,
:root[data-anim-off~="dialog-glow"] .sidebar-help__lightbox-body > .mg-sheen::before {
    animation: none !important;
}

/* effort-badges: the shimmer, sheen, rainbow and twinkle on high effort model marks */
:root[data-anim-off~="effort-badges"] .effort-level,
:root[data-anim-off~="effort-badges"] .effort-level::before,
:root[data-anim-off~="effort-badges"] .effort-level::after,
:root[data-anim-off~="effort-badges"] .effort-level *,
:root[data-anim-off~="effort-badges"] .effort-level *::before,
:root[data-anim-off~="effort-badges"] .effort-level *::after {
    animation: none !important;
}

/* drawer-bands: the shimmer and pulse on animated drawer bands and group labels */
:root[data-anim-off~="drawer-bands"] .session-sidebar-row[data-layout-anim] .session-sidebar-row-name,
:root[data-anim-off~="drawer-bands"] .session-sidebar-group[data-group-anim] .session-sidebar-group__label {
    animation: none !important;
}

/* The shimmer's reveal windows (session-sidebar-colours.css) park where the old gradient did with its animation off: the
 * band at its start, the highlight off the label's right edge. */
:root[data-anim-off~="drawer-bands"] .band-fx {
    animation: none !important;
    transform: translateX(75%);
}

:root[data-anim-off~="drawer-bands"] .band-fx > i::before {
    animation: none !important;
    transform: translateX(-75%);
}

/* sparks-steam: the sparks on model and auto switch icons, the steam on the keep awake cup */
:root[data-anim-off~="sparks-steam"] .session-sidebar-row-model__spark,
:root[data-anim-off~="sparks-steam"] .session-sidebar-row-model__spark::before,
:root[data-anim-off~="sparks-steam"] .session-sidebar-row-model__spark::after,
:root[data-anim-off~="sparks-steam"] .asw-spark,
:root[data-anim-off~="sparks-steam"] .asw-spark::before,
:root[data-anim-off~="sparks-steam"] .asw-spark::after,
:root[data-anim-off~="sparks-steam"] .kaw-steam,
:root[data-anim-off~="sparks-steam"] .kaw-steam::before,
:root[data-anim-off~="sparks-steam"] .kaw-steam::after {
    animation: none !important;
}

/* busy-pulses: the pulsing workflow icons and tabs */
:root[data-anim-off~="busy-pulses"] .session-sidebar-row-workflow-icon,
:root[data-anim-off~="busy-pulses"] .oc-tab-workflow {
    animation: none !important;
}

/* attention-cues: the nudges and flashes that point at something: rail cues, resize chevrons, new entries, a found setting, the task manager timer fill */
:root[data-anim-off~="attention-cues"] .oc-resize-guide-chevron,
:root[data-anim-off~="attention-cues"] .settings-page .st-highlight-flash,
:root[data-anim-off~="attention-cues"] .hdtl-fill,
:root[data-anim-off~="attention-cues"] .ai-entry--fresh::after {
    animation: none !important;
}

/* pop-ins: panels, dialogs and menus sliding or fading in when they open */
:root[data-anim-off~="pop-ins"] .modal-overlay,
:root[data-anim-off~="pop-ins"] .modal-content,
:root[data-anim-off~="pop-ins"] .slash-commands-modal-content,
:root[data-anim-off~="pop-ins"] .cloude-attach-menu,
:root[data-anim-off~="pop-ins"] .cloude-touch-copy,
:root[data-anim-off~="pop-ins"] .config-editor-picker-content,
:root[data-anim-off~="pop-ins"] .config-editor-modal-content,
:root[data-anim-off~="pop-ins"] #session-notes-panel,
:root[data-anim-off~="pop-ins"] .sp-pn,
:root[data-anim-off~="pop-ins"] .sp-pn-body,
:root[data-anim-off~="pop-ins"] .tkm-post-close,
:root[data-anim-off~="pop-ins"] .pkp-it.pkp-drag-plop,
:root[data-anim-off~="pop-ins"] .ai-entry--fresh {
    animation: none !important;
}

/* transitions: every CSS transition, so hover fades, drawer and menu slides land instantly. */
:root[data-anim-off~="transitions"] *,
:root[data-anim-off~="transitions"] *::before,
:root[data-anim-off~="transitions"] *::after {
    transition: none !important;
}
}