/** Note: this stylesheet loads only on WooCommerce pages via functions.php **/


/****************************************************************************
 *************************** PRODUCT PAGES **********************************
 ****************************************************************************/


.woocommerce.single-product .container {
    width: 100%;
    max-width: 100%;
}
.woocommerce.single-product #main-header .container, .woocommerce.single-product #main-footer .container {
	max-width: 1200px;
}
.woocommerce.single-product .product > .clearfix, .woocommerce.single-product .pre-product {
    max-width: 1280px;
    margin: auto;
}
.woocommerce.single-product #content-area .product .woocommerce-tabs .woocommerce-Tabs-panel.panel {
    padding: 0;
}

 .woocommerce.single-product .woocommerce-product-gallery {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
}

.woocommerce.single-product div.product div.images .flex-control-thumbs li {
    width: 100%;
    margin-top: 6.6666%;
    padding: 10% 0;
}

.woocommerce.single-product div.product div.images .flex-control-thumbs {
    margin-right: 6.6666%;
}

.woocommerce.single-product div.product div.images img {
	margin: auto;
}

.woocommerce.single-product .woocommerce-Tabs-panel > h2:first-child {
    display: none;
}

.woocommerce.single-product p.price {
    max-width: 100px;
    float: left;
    margin: 24px 0 39px;
    line-height: 54px;
    vertical-align: middle;
    padding: 0 10px;
}

.woocommerce.single-product form.cart {
    float: left;
}

.woocommerce.single-product form.cart .quantity {
    display: none;
}
.woocommerce.single-product form.cart button.button::after {
    opacity: 1;
    position: absolute;
    top: 27px;
    right: 5px;
}
.woocommerce.single-product .order-by-phone {
	padding: 25px;
	font-size: 1.5em;
	border: 1px solid #c1c1c1;
	/*margin: 25px;*/
	clear: both;
}
.woocommerce.single-product .part-number {
	/*padding: 15px;*/
    display: none;
}

/* Hide Description Tabs */
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs, body.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: none;
}

.et-db #et-boc .et-l .et_pb_tabs, .et-db #et-boc .et-l .et_pb_wc_tabs {
    display: none;
}

/*.et_pb_wc_tabs {
    display: none;
}*/

/* Product Slider Background */
.et-db #et-boc #divi-slider-product.dgpc_product_carousel_0.dgpc_product_carousel .swiper-container .products .product {
	background-color: transparent!important;
}

/********* Accessories Page ****************/
.et-db #et-boc #accessories-hero.et_pb_section {
	background-position: calc(50% + 600px) 0;
    background-size: auto 100%;
    padding-top: 0;
}
@media (min-width: 1200px) {
    .et-db #et-boc #accessories-hero.et_pb_section {
        height:520px
    }
}

@media (min-width: 1550px) {
    .et-db #et-boc #accessories-hero.et_pb_section {
        height:690px
    }
}

.et-db #et-boc #accessories-hero.et_pb_section {
    background-position: left 100%;
    background-size: 150% auto;
    padding: 40px 0 60%
}

@media (min-width: 768px) {
    .et-db #et-boc #accessories-hero.et_pb_section {
        background-position:calc(50% + 250px) 0;
        background-size: contain;
        padding: 50px 0
    }
}

@media (min-width: 992px) {
    .et-db #et-boc #accessories-hero.et_pb_section {
        background-position:calc(50% + 390px) 0;
        background-size: contain
    }
}

@media (min-width: 1200px) {
    .et-db #et-boc #accessories-hero.et_pb_section {
        background-position:calc(50% + 600px) 0;
        background-size: auto 100%;
        padding-top: 0;
    }
}



/****************** Slider rules ******************************
***************************************************************
******* Please note: these rules are specific to **************
******* Caire's implementation of the slider and **************
******* will need to be adjusted if container div *************
******* widths or spacing between elements change**************
**************************************************************/
.woocommerce.single-product ul.products li.product a img {
	width: auto;
}
.woocommerce.single-product .dgpc-container ul.products li.product a img {
	display: inline-block;
}

.woocommerce.single-product .dgpc-container ul.products li.product a {
	text-align: center;
}
.woocommerce.single-product .dgpc-container ul.products li.product .price {
	display: inline-block;
}
.woocommerce.single-product #divi-slider-product .dgpc-container ul.products li.product .price {
	display: none;
}
@media (max-width: 1400px) {
	.woocommerce.single-product .dgpc_product_carousel .swiper-button-next {
		right: 0;
	}
	.woocommerce.single-product .dgpc_product_carousel .swiper-button-prev {
		left: 0;
	}
}
@media (max-width: 980px) {
	.woocommerce.single-product .dgpc-container[data-tablet="2"] ul.products li.product:nth-child(n) {
		width: calc((100vw / 2) - 15px)!important; /*half the view width minus half the margin for 2 cols*/
		margin-right: 30px!important;
	}
	.woocommerce.single-product #divi-slider-accessories .dgpc-container[data-tablet="2"] ul.products li.product:nth-child(n) {
		width: calc((80vw / 2) - 15px)!important; /*half the view width minus half the margin for 2 cols*/
		margin-right: 30px!important;
	}
	.woocommerce.single-product .dgpc-container[data-tablet="3"] ul.products li.product:nth-child(n) {
		width: calc((100vw / 3) - 15px)!important; /*third the view width minus half the margin for 3 cols*/
		margin-right: 30px!important;
	}
	.woocommerce.single-product #divi-slider-accessories .dgpc-container[data-tablet="3"] ul.products li.product:nth-child(n) {
		width: calc((80vw / 3) - 15px)!important; /*third the view width minus half the margin for 3 cols*/
		margin-right: 30px!important;
	}
	.woocommerce.single-product .dgpc_product_carousel .swiper-container .products {
		height: 175px;
	}
}
@media (max-width: 767px) {
	.woocommerce.single-product .dgpc-container[data-mobile="1"] ul.products li.product:nth-child(n) {
		width: 100vw!important;
		margin-right: 30px!important;
	}
	.woocommerce.single-product #divi-slider-accessories .dgpc-container[data-mobile="1"] ul.products li.product:nth-child(n) {
		width: 80vw!important;
		margin-right: 30px!important;
	}
	.woocommerce.single-product .et_shop_image {
		padding: 0;
	}
}

/* ==========================================================================
   WooCommerce Single Product Gallery (Divi + FlexSlider)
   --------------------------------------------------------------------------
   FIX for intermittent missing main product image / broken thumbnail swapping.
   - Prevent vertical centering from interfering with height calculations.
   - Force the wrapper/viewport to behave as a real flex item and not collapse.
   - Ensure height is allowed to auto-size and never gets stuck at 0.

   NOTE: Do not remove unless you also remove the flex layout from the gallery.
   ========================================================================== */

/* --- Fix: prevent Woo gallery collapsing to 0 height under flex layout --- */
.woocommerce.single-product .woocommerce-product-gallery {
  align-items: flex-start; /* don't vertically center (can trigger 0-height viewport) */
}

/* Make sure the main-image side of the gallery is allowed to size itself */
.woocommerce.single-product .woocommerce-product-gallery__wrapper,
.woocommerce.single-product .woocommerce-product-gallery .flex-viewport {
  flex: 1 1 auto;
  min-width: 0;
  height: auto !important;
  max-height: none !important;
}

/* Optional safety net: if something still tries to collapse it */
.woocommerce.single-product .woocommerce-product-gallery__wrapper {
  min-height: 1px;
}