/* Mobile Performance Optimizations for SyetaHub */

@media (max-width: 768px) {
  /* Hardware acceleration for better performance */
  * {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  
  /* Reduce animation complexity on mobile */
  .ftco-animate {
    animation-duration: 0.3s !important;
    animation-delay: 0s !important;
  }
  
  /* Disable heavy effects on mobile */
  .parallax-element {
    transform: none !important;
  }
  
  /* Optimize carousel for mobile */
  .home-slider .owl-carousel {
    touch-action: pan-y;
  }
  
  /* Reduce complex shadows */
  .product-card {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
  }
  
  /* Optimize text rendering */
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeSpeed;
  }
  
  /* Reduce hover effects on mobile */
  .product-card:hover {
    transform: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
  }
  
  /* Optimize images for mobile */
  img {
    max-width: 100%;
    height: auto;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  
  /* Mobile-optimized animations */
  .mobile-optimized {
    animation: none !important;
    transition: none !important;
  }
  
  /* Reduce complex gradients on mobile */
  .hero-gradient {
    background: linear-gradient(135deg, rgba(0,0,0,0.4), rgba(0,0,0,0.6)) !important;
  }
  
  /* Optimize scroll performance */
  .scroll-optimized {
    will-change: auto;
  }
  
  /* Disable complex backdrop filters on mobile */
  .backdrop-blur {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  
  /* Optimize button interactions */
  .btn {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }
  
  /* Reduce complex transforms on mobile */
  .product-card {
    transform: none !important;
  }
  
  /* Optimize modal performance */
  .modal {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  
  /* Reduce animation frame rate on mobile */
  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  
  @keyframes slideInUp {
    from { 
      opacity: 0;
      transform: translateY(20px);
    }
    to { 
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  /* Simplified animations for mobile */
  .animate-fadeIn {
    animation: fadeIn 0.3s ease-in-out;
  }
  
  .animate-slideInUp {
    animation: slideInUp 0.3s ease-in-out;
  }
}