/**
 * SVG rendering optimizations for iOS devices
 * These styles help prevent distortion during animations
 */

/* Base SVG optimizations */
svg {
  shape-rendering: geometricPrecision;
  text-rendering: geometricPrecision;
  image-rendering: optimizeQuality;
}

/* iOS-specific fixes for SVG */
@supports (-webkit-touch-callout: none) {
  /* Apply only on iOS devices */
  svg {
    /* Ensure pixel-perfect rendering */
    shape-rendering: crispEdges;
  }

  /* Force hardware acceleration for SVG elements */
  svg path,
  svg rect,
  svg circle,
  svg g {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }

  /* Fix for SVG in image tags */
  img[src$=".svg"] {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    /* Prevent subpixel rendering */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  /* When SVG is in animation */
  .animating-element img[src$=".svg"] {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}