/*
Theme Name: Metalon Child
Description: Child theme of Metalon
Author: Your Name
Template: metalon
Version: 1.0.0
*/

@import url("../metalon/style.css");

.woocommerce-product-gallery {
    position: relative;
    margin-bottom: 20px;
}

.woocommerce-product-gallery__wrapper {
    position: relative;
    overflow: hidden;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.main-image-container {
    position: relative;
    width: 100%;
}

.woocommerce-product-gallery__image {
    position: relative;
    display: block;
    margin-bottom: 0;
}

.woocommerce-product-gallery__image img {
    width: 100%;
    height: auto;
    display: block;
    transition: opacity 0.3s ease;
}

.woocommerce-product-gallery__image a {
    position: relative;
    display: block;
}

.woocommerce-product-gallery__image .woocommerce-product-gallery__trigger {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
}

.woocommerce-product-gallery__thumbnails {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px;
}

.woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image {
    flex: 0 0 calc(25% - 6px);
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    transition: all 0.3s ease;
    opacity: 0.7;
    position: relative;
    z-index: 10;
    pointer-events: auto;
}

.woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image.thumbnail {
    cursor: pointer !important;
    pointer-events: auto !important;
}

.woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image.thumbnail:hover {
    opacity: 1 !important;
    border-color: #007cba !important;
    transform: scale(1.02) !important;
}

.woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image.thumbnail.active {
    opacity: 1 !important;
    border-color: #007cba !important;
}

.woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image:hover {
    opacity: 1;
    border-color: #007cba;
    transform: scale(1.02);
}

.woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image.active {
    opacity: 1;
    border-color: #007cba;
}

.woocommerce-product-gallery__thumbnails img {
    width: 100%;
    height: 80px;
    object-fit: cover;
    display: block;
}

@media (max-width: 768px) {
    .woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image {
        flex: 0 0 calc(33.333% - 6px);
    }
    
    .woocommerce-product-gallery__thumbnails img {
        height: 70px;
    }
}

@media (max-width: 480px) {
    .woocommerce-product-gallery__thumbnails .woocommerce-product-gallery__image {
        flex: 0 0 calc(50% - 4px);
    }
    
    .woocommerce-product-gallery__thumbnails img {
        height: 60px;
    }
}