/* Copies src/theme.css's palette, whose variables only exist once Scalar mounts. */
.api-explorer-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 100vh;
    font: 15px system-ui, sans-serif;
    color: #52606d;
}

.api-explorer-loading::before {
    content: '';
    width: 32px;
    height: 32px;
    border: 3px solid #d9e4ec;
    border-top-color: #1a2733;
    border-radius: 50%;
    animation: api-explorer-spin 0.8s linear infinite;
}

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

@media (prefers-color-scheme: dark) {
    body:has(.api-explorer-loading) {
        background: #0e171f;
    }

    .api-explorer-loading {
        color: #9fb0bf;
    }

    .api-explorer-loading::before {
        border-color: #243442;
        border-top-color: #e4ecf2;
    }
}