/* Retina Display Optimization CSS */
/* This file ensures proper image display on high-DPI displays like Retina screens */

/* Base image optimization with higher specificity - exclude Swiper images */
body img:not(.swiper-slide img),
html img:not(.swiper-slide img) {
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
}

/* Logo specific sizing with high specificity */
#header-main .header-logo .site-logo img#logo_header,
#header-main .header-logo .site-logo img,
#logo_header {
  max-width: 200px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain !important;
}

#footer .footer-logo img#logo_footer,
#footer .footer-logo img,
#logo_footer {
  max-width: 180px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain !important;
}

/* Mobile logo sizing */
@media (max-width: 768px) {
  #header-main .header-logo .site-logo img#logo_header,
  #header-main .header-logo .site-logo img,
  #logo_header {
    max-width: 150px !important;
  }
  
  #footer .footer-logo img#logo_footer,
  #footer .footer-logo img,
  #logo_footer {
    max-width: 140px !important;
  }
}

/* Image wrap containers - exclude Swiper images */
.image-wrap img:not(.swiper-slide img) {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* Prevent image stretching in specific containers */
.header-logo img,
.footer-logo img,
.site-logo img {
  object-fit: contain !important;
}

/* High-DPI image handling */
img[src*="@2x"],
img[src*="@3x"] {
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
}

/* Background image optimization */
* {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Ensure proper scaling for all images - exclude Swiper images */
body img:not(.swiper-slide img),
html img:not(.swiper-slide img) {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  width: auto !important;
}

/* Force override any conflicting styles for logos - exclude Swiper images */
img[src*="logo"]:not(.swiper-slide img) {
  max-width: 100px !important;
  height: auto !important;
  width: auto !important;
}

/* Swiper-specific image optimization - maintain full width and height */
.swiper-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
}

/* Additional Retina optimizations */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body img:not(.swiper-slide img),
  html img:not(.swiper-slide img) {
    image-rendering: -webkit-optimize-contrast !important;
    image-rendering: crisp-edges !important;
  }
  
  .swiper-slide img {
    image-rendering: -webkit-optimize-contrast !important;
    image-rendering: crisp-edges !important;
  }
}

@media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 288dpi) {
  body img:not(.swiper-slide img),
  html img:not(.swiper-slide img) {
    image-rendering: -webkit-optimize-contrast !important;
    image-rendering: crisp-edges !important;
  }
  
  .swiper-slide img {
    image-rendering: -webkit-optimize-contrast !important;
    image-rendering: crisp-edges !important;
  }
}

/* Ensure Swiper container images maintain their intended dimensions */
.page-title-homepage-4 .swiper-slide img,
.slider-page-title-home .swiper-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  max-width: none !important;
}

/* Testimonial slider images */
.slider-testimonial-center .swiper-slide img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  max-width: none !important;
}
