/* ============================================================================
   Zentrale Animations-Utilities (app-weit, wiederverwendbar).
   `fn-pulse` = 1:1 aus FlowDesk (pk-mailbox-pulse, 21.04.2026): ein dezenter,
   expandierender Ring-Glow, der die Aufmerksamkeit auf ein Icon/Element zieht
   (Postkorb bei neuer Post, (i)-Taste, Alarme, …). 2 s pro Puls, endlos, solange
   die Klasse gesetzt ist — Stoppen = Klasse entfernen (kein JS nötig).
   Farbe über `--fn-pulse-color` überschreibbar (Default: Warnfarbe, wie FlowDesk).
   Nur Tokens (kein Hex) — der Alpha-Ring kommt aus color-mix mit dem Farb-Token.
   ============================================================================ */
.fn-pulse {
    --fn-pulse-color: var(--fn-warning);
    animation: fn-pulse 2s ease-in-out infinite;
    border-radius: 6px;
}
@keyframes fn-pulse {
    0%   { box-shadow: 0 0 0 0    color-mix(in srgb, var(--fn-pulse-color) 55%, transparent); }
    70%  { box-shadow: 0 0 0 10px transparent; }
    100% { box-shadow: 0 0 0 0    transparent; }
}

/* Variante in Primärfarbe (z. B. Hinweis-/(i)-Taste). */
.fn-pulse-primary { --fn-pulse-color: var(--fn-primary); }

/* Respektiere Nutzer-Einstellung „reduzierte Bewegung". */
@media (prefers-reduced-motion: reduce) {
    .fn-pulse { animation: none; }
}