/* ycm.animations.css — animații CSS reutilizabile la nivel de proiect.
 *
 * Fiecare animație = pereche `@keyframes` + clasă utility `.ycm-anim-*` (sau
 * `.ycm-<concept>-<verb>`). Aplicabilă oriunde — DataTables, dashboard widgets,
 * notificări, butoane, modalele de feedback.
 *
 * Convenție nume: prefix `ycm-` pentru namespace (evită coliziune cu Bootstrap,
 * temă, plugin-uri vendor). Animații cu cost scăzut (rotate/scale/translate),
 * NU repaint-heavy properties (top/left, color, background).
 *
 * Inclus în `templates/partials/_head.html.twig` o singură dată per layout.
 */

/* ═════════════════════════════════════════════════════════════════════════
 * .ycm-vibrate — orice pictogramă care „sună"/„vibrează"
 *
 * Pattern „ringing": 35% activ (6 oscilații rapide) + 65% pauză liniștită
 * → cycle de 2s, infinit. Nu e obositor pe ochi cu N rânduri, dar semnal
 * vizual evident că elementul e „live"/„activ"/„notificare în curs".
 *
 * `transform-origin: center` ca rotația să se facă în centrul iconiței
 * (default ar fi baseline al span-ului → pivot aiurea).
 *
 * Generic — aplicabil pe orice <i>, <svg>, span etc. Folosit acum pe:
 *   - `templates/role_ycm/accounts_list.html.twig` — iconiță telefon
 *     (coloana „Verificat tel." pe telefoane confirmate)
 *
 * Idei de utilizare viitoare: clopoțel notificare cu mesaj nou, buton SMS
 * conectare live, iconiță „recording" pe live-stream, etc.
 * ═════════════════════════════════════════════════════════════════════════ */
@keyframes ycm-vibrate {
    0%, 65%, 100% { transform: rotate(0deg); }
    5%, 15%, 25%  { transform: rotate(-15deg); }
    10%, 20%, 30% { transform: rotate(15deg); }
    35%           { transform: rotate(0deg); }
}
.ycm-vibrate {
    display: inline-block;
    animation: ycm-vibrate 2s ease-in-out infinite;
    transform-origin: center;
}