/*
 * Page-entry motion
 *
 * These classes are attached briefly by page-entry-animations.js when a full
 * page opens. Transforms and clipping do not participate in layout, so cards
 * and reports keep their exact dimensions and the browser keeps its scroll
 * position.
 */
body.laundrix-page-opening .laundrix-page-card {
    animation: laundrix-card-enter 440ms cubic-bezier(.2,.75,.25,1) both;
    animation-delay: var(--laundrix-enter-delay, 0ms);
}

/*
 * Applied synchronously when an SPA/PWA view is inserted.  The JavaScript
 * runner replaces this with the same Web Animation keyframes on the next
 * render frame, preventing the one-frame final-state flash on mobile cards.
 */
.laundrix-page-enter-prepared {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
}


body.laundrix-page-opening .laundrix-page-graph {
    animation: laundrix-graph-reveal 660ms cubic-bezier(.2,.75,.25,1) both;
    animation-delay: var(--laundrix-enter-delay, 80ms);
}

body.laundrix-page-opening .laundrix-page-graph-bar {
    transform-origin: center bottom;
    animation: laundrix-graph-bar-grow 620ms cubic-bezier(.2,.78,.25,1) both;
    animation-delay: var(--laundrix-enter-delay, 120ms);
}

@keyframes laundrix-card-enter {
    from {
        opacity: 0;
        transform: translate3d(0, 10px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes laundrix-graph-reveal {
    from {
        opacity: 0;
        clip-path: inset(0 100% 0 0 round 10px);
    }
    to {
        opacity: 1;
        clip-path: inset(0 0 0 0 round 10px);
    }
}

@keyframes laundrix-graph-bar-grow {
    from {
        opacity: .25;
        transform: scaleY(0);
    }
    to {
        opacity: 1;
        transform: scaleY(1);
    }
}

@media (max-width: 700px) {
    .laundrix-page-enter-prepared {
        transform: translate3d(0, 7px, 0);
    }

    @keyframes laundrix-card-enter {
        from {
            opacity: 0;
            transform: translate3d(0, 7px, 0);
        }
        to {
            opacity: 1;
            transform: translate3d(0, 0, 0);
        }
    }
}

@media (prefers-reduced-motion: reduce) {
    body.laundrix-page-opening .laundrix-page-card,
    body.laundrix-page-opening .laundrix-page-graph,
    body.laundrix-page-opening .laundrix-page-graph-bar {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        clip-path: none !important;
    }
}