.smart-grid .smart-loader.smart-hidden,
.smart-list-box .smart-loader.smart-hidden,
.smart-list-menu .smart-loader.smart-hidden,
.smart-list-menu-view.smart-drop-down-repositioned .smart-loader.smart-hidden,
.smart-tree .smart-loader.smart-hidden {
    display: none;
}

.smart-grid .smart-loader,
.smart-list-box .smart-loader,
.smart-list-menu .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned .smart-loader,
smart-tree .smart-loader {
    margin: inherit;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0.85;
    text-align: left;
    border: 6px solid var(--smart-theme-border);
    box-sizing: border-box;
    background-clip: padding-box;
    border-radius: 50%;
    z-index: 10;
}

.smart-grid .smart-loader,
.smart-grid[loading-indicator-position="center"] .smart-loader,
.smart-list-box .smart-loader,
.smart-list-box[loading-indicator-position="center"] .smart-loader,
.smart-list-menu .smart-loader,
.smart-list-menu[loading-indicator-position="center"] .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="center"] .smart-loader,
.smart-tree .smart-loader,
.smart-tree[loading-indicator-position="center"] .smart-loader {
    width: calc(var(--smart-loader-size) + 10px);
    height: calc(var(--smart-loader-size) + 10px);
}

.smart-grid[loading-indicator-position="top"] .smart-loader,
.smart-grid[loading-indicator-position="bottom"] .smart-loader,
.smart-list-box[loading-indicator-position="top"] .smart-loader,
.smart-list-box[loading-indicator-position="bottom"] .smart-loader,
.smart-list-menu[loading-indicator-position="top"] .smart-loader,
.smart-list-menu[loading-indicator-position="bottom"] .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="top"] .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="bottom"] .smart-loader,
.smart-tree[loading-indicator-position="top"] .smart-loader,
.smart-tree[loading-indicator-position="bottom"] .smart-loader {
    width: var(--smart-loader-size);
    height: var(--smart-loader-size);
}

.smart-grid[loading-indicator-position="bottom"] .smart-loader-container.smart-hidden,
.smart-grid[loading-indicator-position="top"] .smart-loader-container.smart-hidden,
.smart-list-box[loading-indicator-position="bottom"] .smart-loader-container.smart-hidden,
.smart-list-box[loading-indicator-position="top"] .smart-loader-container.smart-hidden,
.smart-list-menu[loading-indicator-position="bottom"] .smart-loader-container.smart-hidden,
.smart-list-menu[loading-indicator-position="top"] .smart-loader-container.smart-hidden,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="bottom"] .smart-loader-container.smart-hidden,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="top"] .smart-loader-container.smart-hidden,
.smart-tree[loading-indicator-position="bottom"] .smart-loader-container.smart-hidden,
.smart-tree[loading-indicator-position="top"] .smart-loader-container.smart-hidden {
    display: none;
}

.smart-grid[loading-indicator-position="top"] .smart-loader-container,
.smart-grid[loading-indicator-position="bottom"] .smart-loader-container,
.smart-list-box[loading-indicator-position="top"] .smart-loader-container,
.smart-list-box[loading-indicator-position="bottom"] .smart-loader-container,
.smart-list-menu[loading-indicator-position="top"] .smart-loader-container,
.smart-list-menu[loading-indicator-position="bottom"] .smart-loader-container,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="top"] .smart-loader-container,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="bottom"] .smart-loader-container,
.smart-tree[loading-indicator-position="top"] .smart-loader-container,
.smart-tree[loading-indicator-position="bottom"] .smart-loader-container {
    display: block;
    position: relative;
    width: 100%;
    height: 10%;
    background-color: var(--smart-theme);
    color: var(--smart-on-theme);
    overflow: hidden;
    animation: smart-loader-container-pop-up-down 0.3s linear;
}

.smart-grid[loading-indicator-position="bottom"] .smart-loader-container,
.smart-list-box[loading-indicator-position="bottom"] .smart-loader-container,
.smart-list-menu[loading-indicator-position="bottom"] .smart-loader-container,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="bottom"] .smart-loader-container,
.smart-tree[loading-indicator-position="bottom"] .smart-loader-container {
    top: -10%;
}

.smart-grid[loading-indicator-position="top"] .smart-loader-container,
.smart-list-box[loading-indicator-position="top"] .smart-loader-container,
.smart-list-menu[loading-indicator-position="top"] .smart-loader-container,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="top"] .smart-loader-container,
.smart-tree[loading-indicator-position="top"] .smart-loader-container {
    top: 0;
    position: absolute;
    animation: smart-loader-container-pop-up-top 0.3s linear;
}

.smart-grid[loading-indicator-position="top"] .smart-loader,
.smart-grid[loading-indicator-position="bottom"] .smart-loader,
.smart-list-box[loading-indicator-position="top"] .smart-loader,
.smart-list-box[loading-indicator-position="bottom"] .smart-loader,
.smart-list-menu[loading-indicator-position="top"] .smart-loader,
.smart-list-menu[loading-indicator-position="bottom"] .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="top"] .smart-loader,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="bottom"] .smart-loader,
.smart-tree[loading-indicator-position="top"] .smart-loader,
.smart-tree[loading-indicator-position="bottom"] .smart-loader {
    left: 20%;
}

.smart-list-box[loading-indicator-position="top"] .smart-loader-label,
.smart-list-box[loading-indicator-position="bottom"] .smart-loader-label,
.smart-grid[loading-indicator-position="top"] .smart-loader-label,
.smart-grid[loading-indicator-position="bottom"] .smart-loader-label,
.smart-list-menu[loading-indicator-position="top"] .smart-loader-label,
.smart-list-menu[loading-indicator-position="bottom"] .smart-loader-label,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="top"] .smart-loader-label,
.smart-list-menu-view.smart-drop-down-repositioned[loading-indicator-position="bottom"] .smart-loader-label,
.smart-tree[loading-indicator-position="top"] .smart-loader-label,
.smart-tree[loading-indicator-position="bottom"] .smart-loader-label {
    position: absolute;
    display: block;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 60%;
    font-family: inherit;
    font-size: inherit;
    vertical-align: middle;
    white-space: nowrap;
}

.smart-list-box .smart-loader::after,
.smart-list-box .smart-loader::before,
.smart-grid .smart-loader::after,
.smart-grid .smart-loader::before,
.smart-list-menu .smart-loader::after,
.smart-list-menu .smart-loader::before,
.smart-list-menu-view.smart-drop-down-repositioned .smart-loader::after,
.smart-list-menu-view.smart-drop-down-repositioned .smart-loader::before,
.smart-tree .smart-loader::after,
.smart-tree .smart-loader::before {
    content: "";
    position: absolute;
    margin: -6px;
    box-sizing: inherit;
    width: inherit;
    height: inherit;
    border-radius: inherit;
    opacity: 1;
    border: inherit;
    border-color: transparent;
    border-top-color: transparent;
    border-width: 6px;
    animation-delay: 0.44s;
    animation: smart-loader-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite, smart-loader-spin-fade 1.1s linear infinite;
}

.smart-list-box[disabled] .smart-loader::before,
.smart-list-box[disabled] .smart-loader::after,
.smart-grid[disabled] .smart-loader::before,
.smart-grid[disabled] .smart-loader::after,
.smart-list-menu[disabled] .smart-loader::before,
.smart-list-menu[disabled] .smart-loader::after,
.smart-tree[disabled] .smart-loader::before,
.smart-tree[disabled] .smart-loader::after {
    animation: none;
}

@keyframes smart-loader-container-pop-up-down {
    0% {
        top: 0;
    }

    20% {
        top: -2%;
    }

    35% {
        top: -6%;
    }

    60% {
        top: -8%;
    }

    100% {
        top: -10%;
    }
}

@keyframes smart-loader-container-pop-up-top {
    0% {
        top: -10%;
    }

    20% {
        top: -8%;
    }

    35% {
        top: -6%;
    }

    60% {
        top: -2%;
    }

    100% {
        top: 0;
    }
}

@keyframes smart-loader-spin {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes smart-loader-spin-fade {
    0% {
        border-top-color: var(--smart-theme-border);
    }

    20% {
        border-top-color: var(--smart-theme-border);
    }

    35% {
        border-top-color: transparent;
    }

    60% {
        border-top-color: var(--smart-theme-border);
    }

    100% {
        border-top-color: var(--smart-theme-border);
    }
}