/**
 * Package Page Performance Optimizations
 * CSS for lazy loading, performance enhancements, and mobile optimizations
 */

/* Lazy loading styles */
img[loading="lazy"] {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

img[loading="lazy"].loaded {
    opacity: 1;
}

/* Performance optimizations for images */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Optimize carousel performance */
.carousel {
    will-change: transform;
}

.carousel-item {
    will-change: transform;
}

/* Optimize gallery performance */
.banner-gallery,
.photogallery {
    contain: layout style paint;
}

/* Mobile performance optimizations */
@media (max-width: 768px) {
    /* Reduce repaints on mobile */
    .tripbox,
    .section-heading,
    .package-review {
        will-change: auto;
    }
    
    /* Optimize scroll performance */
    .package-page {
        contain: layout style;
    }
    
    /* Reduce animation complexity on mobile */
    .carousel-item {
        transform: translateZ(0);
    }
}

/* Performance optimizations for external widgets */
#tripadvisor-widget {
    min-height: 200px;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    font-size: 14px;
}

#tripadvisor-widget:before {
    content: "Loading reviews...";
}

#tripadvisor-widget.loaded {
    background: transparent;
}

#tripadvisor-widget.loaded:before {
    display: none;
}

/* Optimize table performance */
#groupjointable {
    contain: layout style;
}

#groupjointable tr {
    will-change: auto;
}

/* Reduce layout thrashing */
.trip-cta-buttons,
.book-now-section {
    contain: layout style;
}

/* Optimize review sections */
.review-items {
    contain: layout style;
}

/* Performance hints for critical sections */
.trip-detail__title,
.package-review {
    contain: layout style paint;
}

/* Optimize mobile gallery */
@media (max-width: 768px) {
    .banner-gallery img,
    .photogallery .carousel-item img {
        transform: translateZ(0);
        backface-visibility: hidden;
    }
}

/* Reduce paint complexity */
.section-heading,
.packagehead {
    contain: layout style;
}

/* Optimize departure table */
.departure-table {
    contain: layout style;
}

/* Performance optimizations for long content */
.overview,
.highlights,
.itinerary {
    contain: layout style;
}

/* Optimize external script loading */
.performance-optimized {
    content-visibility: auto;
    contain-intrinsic-size: 0 500px;
}