/**
 * Sparkles Spinner Classes
 * Moved from sparkles-utilities.css to resolve circular dependencies
* These classes use @apply with sparkles-spinner-base;
 */

/* Spinner size variants */
.sparkles-spinner-xs,
.sparkles-spinner-sm,
.sparkles-spinner-md,
.sparkles-spinner-lg,
.sparkles-spinner-xl {
    border-radius: var(--radius-full);
    animation: spin 1s linear infinite;
    border: 4px solid var(--gray-200);
    border-top: 4px solid var(--color-primary);
    width: var(--sparkles-spinner-size);
    height: var(--sparkles-spinner-size);
}

.sparkles-spinner-xs {
    --sparkles-spinner-size: .75rem;
    border-width: 2px;
}

.sparkles-spinner-sm {
    --sparkles-spinner-size: 1rem;
    border-width: 2px;
}

.sparkles-spinner-md {
    --sparkles-spinner-size: 1.5rem;
}

.sparkles-spinner-lg {
    --sparkles-spinner-size: 2rem;
}

.sparkles-spinner-xl {
    --sparkles-spinner-size: 3rem;
}