/* Table filter / search transition animations */

.table-wrap {
    transition: opacity 200ms ease, transform 200ms ease;
}

.table-wrap.is-filtering {
    opacity: 0.42;
    transform: scale(0.996);
}

.zenith-table tbody.is-filtering tr {
    opacity: 0.25;
    transition: opacity 180ms ease, transform 180ms ease;
}

.page-toolbar {
    transition: opacity 200ms ease;
}

.page-toolbar.is-filtering .page-toolbar__input,
.page-toolbar.is-filtering .searchable-select__trigger {
    border-color: color-mix(in oklab, var(--im-gold, #d4af37) 45%, var(--border));
    box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.14);
    transition: border-color 200ms ease, box-shadow 200ms ease;
}

.zenith-table tbody tr.data-row.data-row--filter-enter {
    opacity: 0;
    transform: translateY(10px);
    animation: tableRowFilterIn 300ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: var(--row-enter-delay, 0ms);
}

.zenith-table tbody tr.table-empty--filter-enter {
    opacity: 0;
    transform: translateY(6px);
    animation: tableEmptyFilterIn 260ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes tableRowFilterIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes tableEmptyFilterIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .table-wrap,
    .table-wrap.is-filtering,
    .zenith-table tbody.is-filtering tr,
    .zenith-table tbody tr.data-row.data-row--filter-enter,
    .zenith-table tbody tr.table-empty--filter-enter {
        transition: none !important;
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}