/* bm-chart-celebration.css — celebration-icon annotation styling for BMApexChart/BMTextAnnotation.
   Targets the ApexCharts-rendered SVG <text> nodes via the annotation's CssClass parameter
   (BMTextAnnotationDescriptor.CssClass → ApexCharts drawText() cssClass, #41214). ApexCharts
   annotation labels render as plain SVG text inside the chart's overlay <svg>, so this is a
   normal (non-scoped) stylesheet — Blazor's per-component CSS isolation can't reach nodes that
   ApexCharts creates client-side from a JSON config, only a globally-loaded stylesheet can.

   Two celebration markers on the Rentals Initiated dashboard charts (Home.razor,
   BuildRentalsCelebrationAnnotations):
     - .bm-rentals-celebrate-trophy — 🏆 "beat last year", static.
     - .bm-rentals-celebrate-party  — 🎉 "hit FY goal", animated confetti-pop.
   Both get a white text-shadow halo so the emoji glyph (unaffected by CSS `color`) stays
   legible against any underlying bar color, light or dark theme. */

.bm-rentals-celebrate-trophy,
.bm-rentals-celebrate-party {
    text-shadow:
        0 0 3px #fff,
        0 0 3px #fff,
        0 1px 2px rgba(0, 0, 0, 0.35);
    paint-order: stroke fill;
}

.bm-rentals-celebrate-party {
    transform-box: fill-box;
    transform-origin: center;
    animation: bm-confetti-pop 1.6s ease-in-out infinite;
}

@keyframes bm-confetti-pop {
    0%, 100% { transform: scale(1) rotate(0deg); }
    15%      { transform: scale(1.35) rotate(-8deg); }
    30%      { transform: scale(1.1) rotate(6deg); }
    45%      { transform: scale(1.25) rotate(-4deg); }
    60%      { transform: scale(1) rotate(0deg); }
}

/* Respect reduced-motion preference — fall back to the static icon, no animation. */
@media (prefers-reduced-motion: reduce) {
    .bm-rentals-celebrate-party {
        animation: none;
    }
}