/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* Fix: Enable transitions and animations in Elementor */
/* This overrides Elementor's CSS that disables transitions when prefers-reduced-motion is set */
@media (prefers-reduced-motion: reduce) {
	/* Override Elementor's global transition disable - restore default transition values */
	.elementor *,
	.elementor-element *,
	.elementor-widget * {
		transition-duration: 0.3s !important;
		transition-delay: 0s !important;
	}
	
	/* Restore animations for Elementor animated elements */
	.elementor .animated {
		animation: initial !important;
		animation-duration: 1.25s !important;
		animation-delay: 0s !important;
	}
	
	.elementor .animated.animated-slow {
		animation-duration: 2s !important;
	}
	
	.elementor .animated.animated-fast {
		animation-duration: 0.75s !important;
	}
	
	/* Restore transitions for motion effects */
	.elementor-motion-effects-element,
	.elementor-motion-effects-layer {
		transition-duration: 1s !important;
		transition-delay: 0s !important;
	}
}

/* Performance optimization: Enable GPU acceleration for smooth animations */
/* Only apply to elements that actually animate/hover */
.elementor-button,
.elementor-menu-toggle,
.elementor-widget-button .elementor-button,
.elementor-image,
.elementor-widget-image img {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

/* Optimize hover transitions - ensure smooth performance */
.elementor-button:hover,
.elementor-menu-toggle:hover,
.elementor-widget-button .elementor-button:hover,
.elementor-element:hover,
a:hover {
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

/* Fix slow/stuck animations - optimize transition properties */
/* Only transition properties that are GPU-accelerated for better performance */
.elementor-button,
.elementor-menu-toggle,
.elementor-widget-button .elementor-button {
	transition-property: transform, opacity, background-color, color, border-color !important;
	transition-duration: 0.3s !important;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Ensure images and elements with transforms are optimized */
.elementor-image,
.elementor-image img,
.elementor-element[class*="animation"] {
	will-change: transform, opacity;
}

/* Optimize transitions - avoid heavy properties that cause lag */
.elementor-element:not(.elementor-button):not(.elementor-menu-toggle),
.elementor-widget:not(.elementor-widget-button) {
	transition-property: opacity, transform !important;
}

/* Performance optimization: Reduce Presentation Delay (INP) */
/* Optimize ShopBuilder elements to reduce rendering time */
.rtsb-row,
.rtsb-content-loader,
.rtsb-category-layout4,
.rtsb-mobile-flex-row {
	/* Use CSS containment to isolate rendering */
	contain: layout style paint;
	
	/* Enable GPU acceleration */
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	
	/* Optimize rendering */
	will-change: contents;
	
	/* Prevent layout shifts */
	content-visibility: auto;
	
	/* Reduce paint complexity */
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

/* Optimize category layout items */
.rtsb-category-layout4 .rtsb-grid-item,
.rtsb-category-layout4 .category-wrapper {
	/* Use containment for child elements */
	contain: layout style paint;
	
	/* Enable hardware acceleration */
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	
	/* Optimize transitions */
	transition-property: transform, opacity !important;
	transition-duration: 0.2s !important;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Reduce paint work for images in category layout */
.rtsb-category-layout4 img,
.rtsb-content-loader img {
	/* Optimize image rendering */
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
	
	/* Prevent layout shifts */
	width: 100%;
	height: auto;
	
	/* Enable GPU for image transforms */
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
}

/* Optimize hover states to reduce presentation delay */
.rtsb-row:hover,
.rtsb-content-loader:hover,
.rtsb-category-layout4:hover {
	/* Only change opacity/transform on hover for better performance */
	will-change: transform, opacity;
}

/* Remove expensive CSS properties that cause reflow */
.rtsb-row *,
.rtsb-content-loader * {
	/* Avoid expensive properties */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Optimize flex layouts */
.rtsb-mobile-flex-row {
	/* Use flex with optimized rendering */
	display: flex;
	flex-wrap: wrap;
	
	/* Prevent unnecessary repaints */
	contain: layout;
}