/* Modern Loading Spinner */
.spinner {
    width: 18px;
    height: 18px;
    border: 2.5px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

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

/* Alternative elegant dots spinner */
.dots-spinner {
    display: inline-flex;
    gap: 3px;
    align-items: center;
}

.dots-spinner span {
    width: 4px;
    height: 4px;
    background: #fff;
    border-radius: 50%;
    animation: pulse 1.2s ease-in-out infinite;
}

.dots-spinner span:nth-child(2) {
    animation-delay: 0.2s;
}

.dots-spinner span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes pulse {
    0%, 100% {
        opacity: 0.3;
        transform: scale(0.8);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}
