@keyframes kbq-progress {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 64px 0;
    }
}

.kbq-progress {
    position: relative;

    &:after {
        content: '';
        position: absolute;
        border-radius: inherit;

        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        $lighter: rgba(255, 255, 255, 0.1);
        $darker: rgba(0, 0, 0, 0.04);

        background: linear-gradient(
                135deg,
                $darker 12px,
                $lighter 12px,
                $lighter 22px,
                $darker 22px,
                $darker 34px,
                $lighter 34px
            )
            repeat;
        background-size: 32px 32px;
        animation: kbq-progress 1s linear infinite;
    }
}
