/* ============================================================
   Onesown Blazor Components – Loading Bar
   ============================================================ */

.oo-loading-bar {
    padding-top: 1px;
}

.oo-loading-bar::before {
    content: "";
}

.oo-loading-bar__track {
    animation: oo-loading-bar 2s linear infinite;
    background: var(--oo-primary);
    bottom: 0;
    height: 3px;
    position: absolute;
    top: 0;
    width: 0;
    transition: background var(--oo-transition);
}

@keyframes oo-loading-bar {
    0% {
        left: 0;
        right: 100%;
        width: 0;
    }

    10% {
        left: 0;
        right: 75%;
        width: 25%;
    }

    90% {
        left: 75%;
        right: 0;
        width: 25%;
    }

    to {
        left: 100%;
        right: 0;
        width: 0;
    }
}