/* ---------------------------------------------------------------------------
   Shared listing styles.

   Loaded on every admin page but inert unless the page contains a
   [data-listing] block, so there is nothing to opt into per screen.
   --------------------------------------------------------------------------- */

/* 3D matrix loader — the same one the products listing uses, defined once here
   instead of being pasted into each screen's <style> block. */
.listing-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px;
    min-height: 263px;
    box-shadow: inset 0 0 0 1000px #e8e8e8;
    transition: box-shadow 300ms;
}

@media (prefers-color-scheme: dark) {
    .listing-loader { box-shadow: inset 0 0 0 1000px #fff; }
}

.listing-loader-grid {
    display: grid;
    grid-template-columns: 32px 32px 32px;
    gap: 12px;
    transform-style: preserve-3d;
    transform: rotateX(55deg) rotateZ(45deg);
}

.listing-loader-grid i {
    width: 32px;
    height: 32px;
    background: #00ff41;
    box-shadow: 0 0 15px #00ff41;
    animation: listing-matrix-3d 1200ms infinite;
    border-radius: 2px;
    opacity: .1;
}

.listing-loader-grid i:nth-child(1) { animation-delay: 100ms; }
.listing-loader-grid i:nth-child(2) { animation-delay: 200ms; }
.listing-loader-grid i:nth-child(3) { animation-delay: 300ms; }
.listing-loader-grid i:nth-child(4) { animation-delay: 400ms; }
.listing-loader-grid i:nth-child(5) { animation-delay: 500ms; }
.listing-loader-grid i:nth-child(6) { animation-delay: 600ms; }
.listing-loader-grid i:nth-child(7) { animation-delay: 700ms; }
.listing-loader-grid i:nth-child(8) { animation-delay: 800ms; }
.listing-loader-grid i:nth-child(9) { animation-delay: 900ms; }

@keyframes listing-matrix-3d {
    0%, 100% { transform: translateZ(0);    opacity: .1; filter: brightness(1); }
    50%      { transform: translateZ(60px); opacity: 1;  filter: brightness(2); }
}

/* The loader row spans the table and needs no cell chrome. */
tr.listing-loader-row > td { padding: 0; border: 0; }

/* Respect a reduced-motion preference: keep the grid, drop the movement. */
@media (prefers-reduced-motion: reduce) {
    .listing-loader-grid i { animation: none; opacity: .85; }
}

.listing-footer { gap: .5rem; }
.listing-per-page { width: auto; }
