.cursor-default {
    cursor: auto;
}

/* The bundled style.css has a pre-existing rule with this exact selector
   (.swal2-popup .swal2-title) forcing margin:0!important, which collapses the
   gap between every SweetAlert popup's title and body text app-wide. A rule
   here with the same class-selector specificity doesn't reliably win (same
   selector text existing in two stylesheets makes source-order the decider,
   and that was not resolving as expected here), so target the popup's stable
   SweetAlert2 IDs instead -- an ID beats any number of classes outright. */
#swal2-title {
    margin: 0 0 0.5rem !important;
}
#swal2-html-container {
    margin: 0.25rem 0 0.5rem !important;
    padding-top: 20px;
}

.loader {
    animation: rotate 1s infinite;
    height: 50px;
    width: 50px;
}

.loader:before,
.loader:after {
    border-radius: 50%;
    content: '';
    display: block;
    height: 20px;
    width: 20px;
}
.loader:before {
    animation: ball1 1s infinite;
    background-color: #2196f3;
    box-shadow: 30px 0 0 #4361ee;
    margin-bottom: 10px;
}
.loader:after {
    animation: ball2 1s infinite;
    background-color: #4361ee;
    box-shadow: 30px 0 0 #2196f3;
}

@keyframes rotate {
    0% {
        transform: rotate(0deg) scale(0.8);
    }
    50% {
        transform: rotate(360deg) scale(1.2);
    }
    100% {
        transform: rotate(720deg) scale(0.8);
    }
}

@keyframes ball1 {
    0% {
        box-shadow: 30px 0 0 #4361ee;
    }
    50% {
        box-shadow: 0 0 0 #4361ee;
        margin-bottom: 0;
        transform: translate(15px, 15px);
    }
    100% {
        box-shadow: 30px 0 0 #4361ee;
        margin-bottom: 10px;
    }
}

@keyframes ball2 {
    0% {
        box-shadow: 30px 0 0 #2196f3;
    }
    50% {
        box-shadow: 0 0 0 #2196f3;
        margin-top: -20px;
        transform: translate(15px, 15px);
    }
    100% {
        box-shadow: 30px 0 0 #2196f3;
        margin-top: 0;
    }
}