/*  ----------------------------------------------------------------------------
    This file will load automatically when the YourStore theme is active. You can use it
    for custom CSS.
*/
#list_1 li {
    padding: 5px;
}

.list_attribute li {
    font-size: 15px;
}

.list_attribute li:hover {
    border: 2px solid #1FC0A0;
}

.list_attribute .attr_selected {
    color: #1FC0A0;
    border: 2px solid #1FC0A0;
}
.list_attribute .attribImg img{
    width: 50px;
    height: 50px;
}
ul.options-swatch{
    display:none;
}
.zoomContainer{
    display:none;
}
.gallery-container {
    display: flex;
    align-items: flex-start; /* 保持主图和附图对齐 */
    flex-wrap: wrap; /* 允许在屏幕变小时元素换行 */
    gap: 10px; /* 主图和附图之间的间距 */
}
#productAdditionalImages{
	width: 15%; /* 附图容器的宽度 */
    display: flex;
    flex-direction: column; /* 垂直排列附图 */
    gap: 10px;
}
#productAdditionalImages a img{
margin: 0 auto;
}
.product-main-image{
	flex-grow: 1; /* 主图容器会占据剩余空间 */
    max-width: 80%; /* 最大宽度为 75%，避免过大 */
}
.product-main-image img{
	max-width: 100%; /* 让主图自适应缩放 */
    height: auto;
}
@media screen and (max-width: 768px) {
    .gallery-container {
        flex-direction: column; /* 小屏幕时让主图和附图上下排列 */
    }

    #productAdditionalImages, .product-main-image {
        width: 100%; /* 在小屏幕时两者宽度为100% */
    }
}
.product-images-carousel ul li {
    margin: 0;
}
@media screen and (min-width: 768px) {
.slick-prev:before, .slick-next:before {
transform: rotate(90deg);}
.slick-prev {
    left: 40%;
    top: 0;
}
.slick-next {
    right: 25%;
    top: 100%;
}
.product-images-carousel ul{
	overflow:revert;
}
}