/**
 * Winpower Performance Optimizations
 * These overrides improve PageSpeed scores without changing
 * any design, layout, colors, or content.
 *
 * File: /wp-content/themes/phlox-pro/css/winpower-performance.css
 */

/* -----------------------------------------------------------------------
 * FIX: Non-composited animations (GPU acceleration fix)
 * Replace top-based animation with transform-based (GPU-accelerated)
 * These two keyframes were the only ones using non-composited "top" property
 * ----------------------------------------------------------------------- */
@keyframes auxShareFadeInDown {
    from {
        opacity: 0;
        transform: translate3d(-50%, calc(-100% - 10px), 0);
    }
    to {
        opacity: 1;
        transform: translate3d(-50%, -100%, 0);
    }
}

@keyframes auxShareFadeOutUp {
    from {
        opacity: 1;
        transform: translate3d(-50%, -100%, 0);
    }
    to {
        opacity: 0;
        transform: translate3d(-50%, calc(-100% - 10px), 0);
    }
}

/* Fix the wrapper positioning so transform works correctly */
.aux-tooltip-socials-container .aux-tooltip-socials-wrapper {
    top: -15px;
    transform: translate3d(-50%, -100%, 0);
}

/* -----------------------------------------------------------------------
 * FIX: Add will-change for known animated elements (improves compositing)
 * ----------------------------------------------------------------------- */
.aux-tooltip-socials-wrapper {
    will-change: opacity, transform;
}

.site-header-section {
    will-change: transform, background-color;
}

/* -----------------------------------------------------------------------
 * FIX: Ensure images that need it have proper display:block to prevent
 * layout shift (CLS improvement)
 * ----------------------------------------------------------------------- */
.entry-media img,
.aux-attachment,
.wp-post-image,
.elementor-image img,
.elementor-widget-image img {
    display: block;
    max-width: 100%;
    height: auto;
}