div#loader {
    top: 0;
    transition: var(--transition-duration) var(--transition-function) all;
    opacity: 0;
    width: 0;
    padding: 0;
}

div#loader.is-active {
    opacity: 1;
    cursor: progress;
    pointer-events: all;
    width: 32px;
    padding: var(--padding);
}

    div#loader span {
            width: 14px;
            height: 14px;
            border: 2px solid currentColor;
            border-top-color: transparent;
            border-radius: 50%;
            animation: loader-spin 0.7s linear infinite;
            display: block;
    }

    @keyframes loader-spin {
        to { transform: rotate(360deg); }
    }