.element-loading-status {
    .element-loading-status-color-set();

    position: relative;
    width: 100%;
    height: 100%;

    .loader-wrapper {
        height: 100%;
        width: 100%;
        position: relative;

        .loader-text {
            color: @loading-text-color;
        }
    }

    .loading-error {
        text-align: center;
        line-height: 15px;
        width: 100%;
        height: 100%;
        position: relative;

        .sad-icon {
            position: absolute;
            left: 32px;
        }

        .loading-error-title, .loading-error-message {
            font-size: 13px;
            font-weight: 700;
            padding: 0 15px;
        }

        .loading-error-title {
            color: @loading-error-title-color;
            padding-top: 15px;
        }

        .refresh-page {
            color: @loading-error-refresh-page-color;
            text-decoration: underline;
            cursor: pointer;
        }
    }

    // Small size status

    &.loading-status-small {
        .loader-fading-circle {
            width: 20px;
            height: 20px;
        }

        .loading-error {

            .loading-error-title, .loading-error-message {
                text-overflow: ellipsis;
                overflow: hidden;
                padding: 0;
            }

            .loading-error-title {
                padding-top: 8px;
            }

            .refresh-page {
                overflow: hidden;
                text-overflow: ellipsis;
                padding: 0;
            }
        }
    }
}