/* Pearl Lemon Scroll Effects CSS */

.pl-scroll-content {
    transition: all 0.4s ease-in-out;
}

/* Ensure smooth transition for common elements */
.pl-scroll-content .elementor-widget-container,
.pl-scroll-content .elementor-heading-title,
.pl-scroll-content .elementor-button,
.pl-scroll-content .elementor-button *,
.pl-scroll-content img,
.pl-scroll-content i,
.pl-scroll-content svg,
.pl-scroll-content a {
    transition: all 0.4s ease-in-out;
}

/* Helper classes for better control if needed */
body.pl-scrolled .pl-scrolled-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

body.pl-scrolled .pl-scrolled-visible {
    opacity: 1;
    visibility: visible;
}

/* Smooth scroll global if not already present */
html {
    scroll-behavior: smooth;
}

/* Smooth transition for images when src changes */
.pl-scroll-content img {
    transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out, filter 0.4s ease-in-out !important;
    backface-visibility: hidden;
}

.pl-scroll-content.pl-swapping img {
    opacity: 0;
}

/* Allow Scrolled styles to show in Editor when Preview is ON */
body.pl-scrolled .pl-scroll-content,
.pl-scroll-content.pl-preview-scrolled-yes {
    /* Scrolled styles will be applied via the generated CSS having body.pl-scrolled {{WRAPPER}} */
}

/* We need to ensure the selectors in class-scroll-controls.php account for the preview class */
/* I'll update the PHP selectors to include the preview class as well */

/* Smooth scroll global */
html {
    scroll-behavior: smooth;
}