/* ============================================================================
   MOBILE GPU PERFORMANCE v1.1
   
   Silky smooth mobile experience — CONSERVATIVE approach
   Only targets known-safe selectors to avoid breaking layout/icons
   ============================================================================ */

/* ──────────────── TOUCH OPTIMIZATION ──────────────── */

/* Eliminate 300ms touch delay on interactive elements only */
button,
a,
input,
textarea,
select,
[role="button"],
[tabindex] {
    touch-action: manipulation;
}

/* ──────────────── SCROLL PERFORMANCE ──────────────── */

/* Native momentum scrolling */
.overflow-auto,
.overflow-y-auto,
.overflow-x-auto,
.overflow-scroll {
    -webkit-overflow-scrolling: touch;
}

/* Prevent scroll chaining (rubber-banding) leaking to parent */
.modal-content,
.sidebar {
    overscroll-behavior: contain;
}

@media (max-width: 768px) {

    /* On mobile, prefer instant scroll for performance */
    .scroll-smooth {
        scroll-behavior: auto;
    }
}

/* ──────────────── MOBILE: REDUCE EXPENSIVE EFFECTS ──────────────── */

@media (max-width: 768px) {

    /* CRITICAL: Reduce backdrop-filter on mobile (VERY expensive on Android WebView) */
    .glass,
    .glass-light {
        backdrop-filter: blur(4px) !important;
        -webkit-backdrop-filter: blur(4px) !important;
    }

    /* Reduce box-shadow complexity on mobile */
    .glow-primary,
    .glow-accent {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    }

    /* Simplify noise texture on low-end devices */
    .noise-overlay::before {
        display: none !important;
    }

    /* Reduce animation complexity */
    .animate-float,
    .animate-bounce-subtle,
    .animate-spin-slow {
        animation-duration: 6s !important;
    }

    .animate-pulse-glow {
        animation: none !important;
        box-shadow: 0 0 20px rgba(37, 99, 235, 0.3);
    }

    /* Optimize modal backdrop overlays — skip blur */
    .modal-backdrop {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* ──────────────── APK / CAPACITOR SPECIFIC ──────────────── */

/* When running inside Capacitor WebView (detected via body class) */
body.capacitor-app .glass,
body.capacitor-app .glass-light {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(20, 24, 40, 0.95) !important;
}

body.capacitor-app .glow-primary,
body.capacitor-app .glow-accent {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

body.capacitor-app .animate-pulse-glow {
    animation: none !important;
}

body[data-platform="apk"] .glass,
body[data-platform="apk"] .glass-light {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(20, 24, 40, 0.95) !important;
}

body[data-platform="apk"] .glow-primary,
body[data-platform="apk"] .glow-accent {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

body[data-platform="apk"] .animate-pulse-glow {
    animation: none !important;
}

/* ──────────────── REDUCED MOTION (accessibility + perf) ──────────────── */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ──────────────── INPUT PERFORMANCE ──────────────── */

/* Prevent zoom on input focus (iOS) */
@media (max-width: 768px) {

    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="url"],
    input[type="number"],
    textarea,
    select {
        font-size: 16px !important;
    }
}

/* ──────────────── IMAGE OPTIMIZATION ──────────────── */

img[src*="avatar"],
img[src*="photo"] {
    image-rendering: -webkit-optimize-contrast;
}