/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
 */

/* Keep the single product featured image at a sensible size so the whole image is visible */
@media (min-width: 1025px) {
	.single-product .product-images {
		width: 100%;
		max-width: 520px;
		margin-inline: auto;
		justify-self: center;
	}

	.single-product .woocommerce-product-gallery.thumbs-position-left {
		max-width: 520px;
		width: 100%;
	}

	.single-product .woocommerce-product-gallery.thumbs-position-left .wd-gallery-images {
		flex: 0 0 auto !important;
		max-width: min(calc(100% - var(--wd-thumbs-width, 120px)), 400px) !important;
	}

	.single-product .woocommerce-product-gallery.thumbs-position-left .wd-gallery-thumb {
		flex: 0 0 var(--wd-thumbs-width, 120px) !important;
		max-width: var(--wd-thumbs-width, 120px) !important;
	}

	.single-product .woocommerce-product-gallery__image img.wp-post-image {
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: 550px !important;
		object-fit: contain !important;
	}
}

@media (min-width: 769px) and (max-width: 1024px) {
	.single-product .product-images {
		width: 100%;
		max-width: 460px;
		margin-inline: auto;
		justify-self: center;
	}

	.single-product .woocommerce-product-gallery.thumbs-position-left {
		max-width: 460px;
		width: 100%;
	}

	.single-product .woocommerce-product-gallery.thumbs-position-left .wd-gallery-images {
		flex: 0 0 auto !important;
		max-width: min(calc(100% - var(--wd-thumbs-width, 110px)), 350px) !important;
	}

	.single-product .woocommerce-product-gallery__image img.wp-post-image {
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: 480px !important;
		object-fit: contain !important;
	}
}

@media (max-width: 768px) {
	.single-product .woocommerce-product-gallery__image img.wp-post-image {
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: 420px !important;
		object-fit: contain !important;
	}
}
