/**
 * Slow Network Optimizations
 * Applied automatically when slow connection detected
 */

/* Disable animations on slow connections */
.slow-connection *,
.slow-connection *::before,
.slow-connection *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0.01ms !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0.01ms !important;
    will-change: auto !important;
}

/* Reduce visual effects */
.slow-connection .bg-orb {
    display: none; /* Hide background animations */
}

.medium-connection .bg-orb {
    opacity: 0.5; /* Reduce opacity */
    animation-duration: 2s !important;
}

/* Optimize images */
img[data-src] {
    opacity: 0;
    transition: opacity 0.3s;
}

img[data-src].loaded,
img:not([data-src]) {
    opacity: 1;
}

/* Loading placeholder */
img[data-src]::before {
    content: '';
    display: block;
    width: 100%;
    height: 200px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Reduce shadows and effects on slow connections */
.slow-connection .glass-card {
    box-shadow: none !important;
    backdrop-filter: none !important;
    background: rgba(255, 255, 255, 0.95) !important;
}

/* Optimize fonts */
.slow-connection {
    font-display: swap;
}

/* Prevent layout shifts */
.glass-card,
.hero-text,
.container {
    min-height: 1px; /* Will be set by JS */
}

/* Loading states */
.loading {
    pointer-events: none;
    opacity: 0.6;
}

.loaded {
    opacity: 1;
    transition: opacity 0.3s;
}