/* Movimento discreto compartilhado pelas telas: apenas opacity e transform. */

@keyframes mps-enter {
    from { opacity: 0; transform: translate3d(0, 8px, 0); }
    to { opacity: 1; transform: none; }
}

@keyframes mps-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.45; }
}

/* Transição entre páginas (navegadores com suporte a View Transitions; nos demais a navegação segue igual). */
@media (prefers-reduced-motion: no-preference) {
    @view-transition {
        navigation: auto;
    }

    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation-duration: 180ms;
    }
}

/* Entrada: a classe é aplicada só na primeira renderização ou em navegação feita pelo usuário (motion.js),
   nunca nas atualizações automáticas de dados. */
.mps-enter > * {
    animation: mps-enter 320ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.mps-enter > :nth-child(2) { animation-delay: 40ms; }
.mps-enter > :nth-child(3) { animation-delay: 80ms; }
.mps-enter > :nth-child(4) { animation-delay: 120ms; }
.mps-enter > :nth-child(5) { animation-delay: 160ms; }
.mps-enter > :nth-child(6) { animation-delay: 200ms; }
.mps-enter > :nth-child(7) { animation-delay: 240ms; }
.mps-enter > :nth-child(n + 8) { animation-delay: 280ms; }

/* Carregamento: a mensagem pulsa enquanto a consulta está em andamento e não há dados na tela. */
.vp-page[aria-busy="true"]:has(#vp-summary[hidden]):has(#vp-detail[hidden]) .vp-message,
.op-page[aria-busy="true"] .op-message,
.pt-page[aria-busy="true"] .pt-message,
.operacao__content[aria-busy="true"] .operacao__message,
.dashboard-prototype[aria-busy="true"] .prototype-message {
    animation: mps-pulse 1.4s ease-in-out infinite;
}

/* Retorno ao toque em cartões e botões. */
.stcard,
.yard,
.iconbtn,
.vp-retry,
.op-retry,
.pt-action,
.pt-faixa,
.pt-card,
.prototype-retry,
.operacao__retry,
.mps-home__action {
    transition: transform 140ms ease;
}

.stcard:not(:disabled):active,
.yard:active,
.navio:has(.navio__detail-link):active,
.iconbtn:active,
.vp-retry:active,
.op-retry:active,
.pt-action:active,
.pt-faixa:active,
.pt-card:active,
.prototype-retry:active,
.operacao__retry:active,
.operacao__button:active,
.mps-home__action:active {
    transform: scale(0.98);
}

@media (prefers-reduced-motion: reduce) {
    .mps-enter > *,
    .vp-page .vp-message,
    .op-page .op-message,
    .pt-page .pt-message,
    .operacao__content .operacao__message,
    .dashboard-prototype .prototype-message {
        animation: none !important;
    }

    .stcard,
    .yard,
    .navio,
    .iconbtn,
    .vp-retry,
    .op-retry,
    .pt-action,
    .pt-faixa,
    .pt-card,
    .prototype-retry,
    .operacao__retry,
    .operacao__button,
    .mps-home__action {
        transition: none;
        transform: none !important;
    }
}
