.MockupElement_shape {
    background-color: var(--color-bg-weaker);
    position: relative;
    overflow: hidden;

    &::after {
        content: "";
        @include absolute-fill;
        width: 200px;
        transform-origin: left;
        animation: 2000ms ease-out 0ms infinite mockup-loading;
        background: linear-gradient(to right, rgba(255, 255, 255, 0), var(--color-border), rgba(255, 255, 255, 0));
    }
}

/* ANIMATION */

@keyframes mockup-loading {
    0% {
        opacity: 0;
        transform: scaleX(0) translateX(0%);
    }

    50% {
        opacity: 0.15;
    }

    100% {
        opacity: 0;
        transform: scaleX(1) translateX(50%);
    }
}

/* CHILDREN */

@import "./mockup-block.scss";
@import "./mockup-text.scss";
@import "./mockup-search.scss";