@import '../../themes/default/index';
@import '../../mixins/index';

.ps-loading {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1050;
    background-color: rgba(255, 255, 255, 0.4);
    // opacity: 0.4;

    &.fullscreen {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 100vw;
    }

    .ps-spinner {
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        animation: spin infinite;
        animation-duration: 1s;
        animation-timing-function: linear;

        background-color: transparent;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;

        font-size: 25px;
        color: #377ef2;
        text-shadow: 0 0 .1em #377ef2;

        &:before {
            .ps-iconfont("\E263");
        }
    }

    @keyframes spin {
        0% {
            transform: rotate(0);
        }
        100% {
            transform: rotate(360deg);
        }
    }

    @keyframes spin3d {
        to {
            transform: rotate3d(0, 1, 0, 359deg);
        }
    }
}