/* Working Indicator Animations */
@keyframes sparkle-flip {
    0%, 24% { transform: scaleX(1); }
    25%, 49% { transform: scaleX(-1); }
    50%, 74% { transform: scaleX(1); }
    75%, 100% { transform: scaleX(-1); }
}

@keyframes sparkle-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.sparkle-animated svg {
    animation:
        sparkle-flip 3s step-end infinite,
        sparkle-pulse 2s ease-in-out infinite;
    transform-origin: center;
}

/* Badge positioning is handled by Filament's own `.fi-icon-btn-badge-ctn`
   (see vendor/filament/support/resources/css/components/icon-button.css):
   the badge is a child of the icon button and positioned absolutely against
   the button itself. Passing :badge to <x-filament::icon-button /> renders
   it inside that container — same offset as Filament's database-notifications
   bell next to us in the topbar. No custom rule needed here. */