/**
 * iOS Image Rotation Fix for Home Featured Product
 * Fixes the issue where .home-featured-product images appear rotated 90 degrees on iOS
 */

/* Fix for iOS image rotation issue */
.home-featured-product {
    /* Reset any potential iOS automatic rotation */
    image-orientation: from-image;

    /* Fallback for older browsers */
    -webkit-image-orientation: from-image;
    -moz-image-orientation: from-image;
    -ms-image-orientation: from-image;
    -o-image-orientation: from-image;
}

/* iOS-specific fixes */
@supports (-webkit-overflow-scrolling: touch) {
    .home-featured-product {
        /* Force image to respect original orientation on iOS */
        image-orientation: none;
        -webkit-image-orientation: none;

        /* Ensure proper rendering */
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);

        /* Force hardware acceleration for better rendering */
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);

        /* Prevent iOS from applying automatic rotations */
        -webkit-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: transparent;
    }
}

/* Additional iOS Safari specific fix */
@media screen and (-webkit-min-device-pixel-ratio: 1) {
    .home-featured-product {
        /* Override any system-applied rotations */
        -webkit-transform-origin: center center;
        transform-origin: center center;

        /* Ensure proper image rendering on high-DPI displays */
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}

/* Mobile iOS specific adjustments */
@media screen and (max-width: 991px) and (-webkit-min-device-pixel-ratio: 1) {
    .home-featured-product {
        /* Additional mobile iOS fixes */
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;

        /* Prevent any unwanted transformations on mobile */
        will-change: transform;
    }
}

/* iPad specific fixes */
@media screen and (min-width: 768px) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    .home-featured-product {
        /* iPad-specific orientation fixes */
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }
}

/* iPhone specific fixes */
@media screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 2) {
    .home-featured-product {
        /* iPhone-specific high-DPI fixes */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;

        /* Ensure proper image scaling */
        max-width: 100%;
        height: auto;
    }
}