/* Shared styles for ecosystem filter sidebars */
.filter-sidebar .filter-option.selected label{
  background: linear-gradient(90deg, rgba(0,144,255,.2), rgba(83,211,255,.16), rgba(201,247,66,.22));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
  font-weight: 800;
    transition: background 0.3s ease, box-shadow 0.3s ease !important;
}

/* ============================================================
   FILTER ANIMATION SYSTEM
   Cards animate out → grid reflows → cards animate in
   ============================================================ */

/* Phase 1 – EXIT: card shrinks and fades out via animation (beats any transition !important) */
@keyframes eco-card-exit {
    from { opacity: 1; transform: scale(1) translateY(0); }
    to   { opacity: 0; transform: scale(0.90) translateY(6px); }
}

.product-card.eco-exiting {
    animation: eco-card-exit 230ms cubic-bezier(0.4, 0, 1, 1) both !important;
    pointer-events: none !important;
}

/* Truly hidden – removed from document flow so grid reflows cleanly */
.product-card.eco-hidden {
    display: none !important;
}

/* Phase 2 – ENTER: card rises and fades in after grid reflows */
@keyframes eco-card-enter {
    from {
        opacity: 0;
        transform: translateY(20px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.product-card.eco-entering {
    animation: eco-card-enter 380ms cubic-bezier(0.0, 0.0, 0.2, 1) both !important;
}

/* Stagger entering cards for a wave effect */
.product-card.eco-entering:nth-child(2)  { animation-delay:  40ms !important; }
.product-card.eco-entering:nth-child(3)  { animation-delay:  80ms !important; }
.product-card.eco-entering:nth-child(4)  { animation-delay: 120ms !important; }
.product-card.eco-entering:nth-child(5)  { animation-delay: 160ms !important; }
.product-card.eco-entering:nth-child(6)  { animation-delay: 200ms !important; }
.product-card.eco-entering:nth-child(7)  { animation-delay: 240ms !important; }
.product-card.eco-entering:nth-child(8)  { animation-delay: 280ms !important; }
.product-card.eco-entering:nth-child(9)  { animation-delay: 320ms !important; }
.product-card.eco-entering:nth-child(10) { animation-delay: 360ms !important; }

.products-empty-state{ display:none; }
.products-empty-state.show{ display:block !important; }

