/* Toykar product gallery — studio well, left thumbs, contain */
#product .product-cover,
#product .product-cover img,
#product .js-product-zoom-viewport {
    box-shadow: none;
    border: none;
    background: #fff;
}
#product .product-cover {
    margin: 0;
}
#product .js-product-zoom-viewport .js-product-zoom-img {
    width: 100%;
    height: auto;
    max-height: 72vh;
    object-fit: contain;
    object-position: center;
    background: #fff;
}
#product .images-container.has-thumbs .thumb-btn {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    line-height: 0;
}
#product .product-images > li.thumb-container > .thumb,
#product .product-images > li.thumb-container .thumb {
    box-shadow: none;
    border: 1px solid transparent;
    background: #fff;
    object-fit: contain;
    width: 64px;
    height: auto;
}
#product .product-images > li.thumb-container .thumb.selected,
#product .product-images > li.thumb-container .thumb:hover {
    border-color: #333;
}
#product-modal .product-cover-modal {
    max-width: 100%;
    max-height: 80vh;
    width: auto;
    object-fit: contain;
    background: #fff;
}
@media (min-width: 768px) {
    #product .images-container.has-thumbs {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 12px;
    }
    #product .images-container.has-thumbs .js-qv-mask,
    #product .images-container.has-thumbs .js-qv-mask.scroll {
        order: 0;
        width: 72px !important;
        flex: 0 0 72px;
        max-height: 72vh;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }
    #product .images-container.has-thumbs .product-images {
        display: flex !important;
        flex-direction: column;
        float: none;
        width: 100% !important;
        margin: 0 !important;
        padding: 0;
        left: auto !important;
        transform: none !important;
    }
    #product .images-container.has-thumbs .product-cover {
        order: 1;
        flex: 1 1 auto;
        min-width: 0;
    }
    #product .scroll-box-arrows,
    #product .scroll-box-arrows.scroll {
        display: none !important;
    }
}
@media (max-width: 767px) {
    #product .js-product-zoom-viewport .js-product-zoom-img {
        max-height: 70vw;
    }
}