/* Popper — animazioni dashboard */

/* Entrata a cascata dei widget */
@keyframes popper-in {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.fi-wi-widget {
    animation: popper-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Ritardo progressivo: i widget entrano uno dopo l'altro */
.fi-wi-widget:nth-child(1)  { animation-delay: 0.05s; }
.fi-wi-widget:nth-child(2)  { animation-delay: 0.10s; }
.fi-wi-widget:nth-child(3)  { animation-delay: 0.15s; }
.fi-wi-widget:nth-child(4)  { animation-delay: 0.20s; }
.fi-wi-widget:nth-child(5)  { animation-delay: 0.25s; }
.fi-wi-widget:nth-child(6)  { animation-delay: 0.30s; }
.fi-wi-widget:nth-child(7)  { animation-delay: 0.35s; }
.fi-wi-widget:nth-child(8)  { animation-delay: 0.40s; }
.fi-wi-widget:nth-child(9)  { animation-delay: 0.45s; }
.fi-wi-widget:nth-child(10) { animation-delay: 0.50s; }

/* I numeri dei KPI "saltano" in scena */
@keyframes popper-pop {
    from {
        opacity: 0;
        transform: scale(0.85);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.fi-wi-stats-overview-stat-value {
    animation: popper-pop 0.5s 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

/* Righe della tabella che arrivano in sequenza */
@keyframes popper-row {
    from {
        opacity: 0;
        transform: translateX(-10px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fi-ta-row {
    animation: popper-row 0.4s ease both;
}

.fi-ta-row:nth-child(1) { animation-delay: 0.05s; }
.fi-ta-row:nth-child(2) { animation-delay: 0.10s; }
.fi-ta-row:nth-child(3) { animation-delay: 0.15s; }
.fi-ta-row:nth-child(4) { animation-delay: 0.20s; }
.fi-ta-row:nth-child(5) { animation-delay: 0.25s; }
.fi-ta-row:nth-child(6) { animation-delay: 0.30s; }
.fi-ta-row:nth-child(7) { animation-delay: 0.35s; }
.fi-ta-row:nth-child(8) { animation-delay: 0.40s; }

/* Badge delle sale: pulsazione discreta */
@keyframes popper-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgb(245 158 11 / 0); }
    50% { box-shadow: 0 0 0 4px rgb(245 158 11 / 0.15); }
}

.fi-badge {
    animation: popper-pulse 3s ease-in-out infinite;
}

/* Rispetta chi preferisce meno movimento */
@media (prefers-reduced-motion: reduce) {
    .fi-wi-widget,
    .fi-wi-stats-overview-stat-value,
    .fi-ta-row,
    .fi-badge,
    .fi-sidebar-item-button {
        animation: none !important;
        transition: none !important;
    }
}

/* Larghezza di default della sidebar (ridimensionabile via drag) */
@media (min-width: 1024px) {
    :root {
        --sidebar-width: 13.5rem;
    }
}