/* WooCommerce Shop Slider Styles - Enhanced for Block Themes */

/* Base Slider Container */
.wcss-product-image-wrap {
    position: relative;
    margin-bottom: 30px;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.shop-product-slider {
    position: relative;
    margin-bottom: 35px;
    width: 100%;
}

/* Slide Content */
.wcss-slide {
    width: 100%;
    position: relative;
    display: block;
}

.wcss-slide img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* Fallback and Single Images */
.wcss-single-image,
.wcss-fallback-image {
    width: 100%;
    height: auto;
    display: block;
}

/* Slick Slider Base Styles */
.shop-product-slider.slick-initialized {
    display: block;
}

.shop-product-slider .slick-track {
    display: flex;
    align-items: center;
}

.shop-product-slider .slick-slide {
    width: 100%;
    float: none;
    display: block;
}

.shop-product-slider .slick-slide img {
    width: 100%;
    height: auto;
    display: block;
}

/* Navigation Arrows */
.shop-product-slider .slick-prev,
.shop-product-slider .slick-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    z-index: 10;
    font-size: 0;
    line-height: 0;
    outline: none;
}

.shop-product-slider .slick-prev {
    left: 5px;
}

.shop-product-slider .slick-next {
    right: 5px;
}

.shop-product-slider .slick-prev:before,
.shop-product-slider .slick-next:before {
    font-family: "dashicons";
    font-size: 25px;
    line-height: 1;
    opacity: 1;
    color: #000;
    text-shadow: 0 1px 2px rgba(255,255,255,0.8);
}

.shop-product-slider .slick-prev:before {
    content: "\f341";
}

.shop-product-slider .slick-next:before {
    content: "\f345";
}

.shop-product-slider .slick-prev:hover:before,
.shop-product-slider .slick-next:hover:before {
    opacity: 0.8;
}

/* Dots Navigation */
.shop-product-slider .slick-dots {
    position: absolute;
    bottom: -32px !important;
    left: 0;
    right: 0;
    display: flex !important;
    justify-content: center;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 0;
    gap: 0;
}

.shop-product-slider .slick-dots li {
    margin: 0;
    padding: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
	width: auto !important;
}

.shop-product-slider .slick-dots li button {
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 0;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
}

.shop-product-slider .slick-dots li button:before {
    font-family: "slick";
    font-size: 40px;
    line-height: 20px;
    width: 20px;
    height: 20px;
    content: "•";
    text-align: center;
    opacity: 1;
    color: #ddd;
    position: static;
    display: block;
}

.shop-product-slider .slick-dots li.slick-active button:before {
    opacity: 1;
    font-size: 45px;
	color: #000;
}

/* Block Theme Specific Styles */
.wp-site-blocks .wcss-product-image-wrap,
.wp-block-group .wcss-product-image-wrap,
.wp-block-woocommerce-product-template .wcss-product-image-wrap,
.wp-block-post-template .wcss-product-image-wrap {
    width: 100%;
    max-width: 100%;
    margin-bottom: 30px;
}

.wp-site-blocks .shop-product-slider,
.wp-block-group .shop-product-slider,
.wp-block-woocommerce-product-template .shop-product-slider,
.wp-block-post-template .shop-product-slider {
    width: 100%;
    max-width: 100%;
}

/* Twenty Twenty-Five Specific Styles */
.wp-site-blocks .wcss-product-image-wrap .shop-product-slider img,
.wp-block-woocommerce-product-template .wcss-product-image-wrap img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 0;
}

/* WooCommerce Block Product Template */
.wc-block-grid__product .wcss-product-image-wrap {
    width: 100%;
    margin-bottom: 1rem;
}

.wc-block-grid__product .shop-product-slider {
    margin-bottom: 1rem;
}

/* Product Loop Items */
.products .product .wcss-product-image-wrap,
.woocommerce ul.products li.product .wcss-product-image-wrap {
    margin-bottom: 1em;
}

/* Responsive Design */
@media (max-width: 768px) {
    .shop-product-slider .slick-prev,
    .shop-product-slider .slick-next {
        width: 20px;
        height: 20px;
    }
    
    .shop-product-slider .slick-prev:before,
    .shop-product-slider .slick-next:before {
        font-size: 20px;
    }
    
    .shop-product-slider .slick-dots li {
        width: 15px;
        height: 15px;
    }
    
    .shop-product-slider .slick-dots li button {
        width: 15px;
        height: 15px;
    }
    
    .shop-product-slider .slick-dots li button:before {
        font-size: 30px;
        line-height: 15px;
        width: 15px;
        height: 15px;
    }
    
    .shop-product-slider .slick-dots li.slick-active button:before {
        font-size: 35px;
    }
}

@media (max-width: 480px) {
    .shop-product-slider .slick-prev,
    .shop-product-slider .slick-next {
        width: 18px;
        height: 18px;
    }
    
    .shop-product-slider .slick-prev:before,
    .shop-product-slider .slick-next:before {
        font-size: 18px;
    }
    
    .wcss-product-image-wrap {
        margin-bottom: 20px;
    }
    
    .shop-product-slider {
        margin-bottom: 25px;
    }
}

/* Accessibility Improvements */
.shop-product-slider .slick-prev:focus,
.shop-product-slider .slick-next:focus,
.shop-product-slider .slick-dots li button:focus {
    outline: 2px solid #005cee;
    outline-offset: 2px;
}

/* Loading State */
.shop-product-slider:not(.slick-initialized) {
    opacity: 0.7;
}

.shop-product-slider.slick-initialized {
    opacity: 1;
    transition: opacity 0.3s ease;
}

/* Prevent Layout Shift */
.wcss-product-image-wrap {
    min-height: 200px; /* Adjust based on your needs */
}

.shop-product-slider {
    min-height: inherit;
}

/* Classic Theme Compatibility */
.woocommerce .wcss-product-image-wrap,
.woocommerce-page .wcss-product-image-wrap {
    margin-bottom: 1em;
}

/* Additional Block Theme Support */
.is-layout-grid .wcss-product-image-wrap,
.is-layout-flex .wcss-product-image-wrap {
    width: 100%;
}

/* Theme-specific adjustments for popular themes */
.theme-twentytwentyfive .wcss-product-image-wrap,
.theme-twentytwentyfour .wcss-product-image-wrap,
.theme-storefront .wcss-product-image-wrap,
.theme-astra .wcss-product-image-wrap {
    width: 100%;
    max-width: 100%;
}

/* Fix for themes that might override image styles */
.wcss-product-image-wrap img {
    max-width: 100% !important;
    height: auto !important;
}

/* Performance optimization - prevent reflow */
.shop-product-slider .slick-track,
.shop-product-slider .slick-list {
    will-change: transform;
}

/* Smooth transitions */
.shop-product-slider .slick-slide {
    transition: opacity 0.3s ease;
}

/* Print styles */
@media print {
    .shop-product-slider .slick-dots,
    .shop-product-slider .slick-prev,
    .shop-product-slider .slick-next {
        display: none !important;
    }
    
    .shop-product-slider .slick-slide {
        display: block !important;
        width: 100% !important;
    }
}