/* WooCommerce compatibility fixes for ixlab 1.0 */
.woocommerce .main-products,
.woocommerce-page .main-products {
	clear: both;
}

.woocommerce ul.products,
.woocommerce-page ul.products {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
	content: "";
	display: table;
	clear: both;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	box-sizing: border-box;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 40px;
}

.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 0 1em;
}

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
	margin-bottom: 30px;
}

.woocommerce .woocommerce-ordering select,
.woocommerce-page .woocommerce-ordering select,
.woocommerce div.product form.cart .variations select {
	max-width: 100%;
	min-height: 42px;
	padding: 8px 12px;
}

.woocommerce span.onsale,
.woocommerce-page span.onsale {
	z-index: 2;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
	max-width: 100%;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image img {
	display: block;
	width: 100%;
	height: auto;
}

.woocommerce div.product .woocommerce-tabs ul.tabs,
.woocommerce-page div.product .woocommerce-tabs ul.tabs {
	padding-left: 0;
}

.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
	width: 100%;
	border-collapse: collapse;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td,
.woocommerce-page table.shop_table th,
.woocommerce-page table.shop_table td {
	padding: 12px;
	vertical-align: middle;
}

.woocommerce-cart table.cart img {
	width: 80px;
	height: auto;
}

.woocommerce .quantity .qty {
	min-height: 40px;
	max-width: 80px;
	text-align: center;
}

.woocommerce .button,
.woocommerce-page .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	cursor: pointer;
}

.woocommerce .woocommerce-pagination ul.page-numbers {
	border: 0;
	margin: 30px 0 0;
}

.woocommerce .woocommerce-pagination ul.page-numbers li {
	border: 0;
	margin: 0 4px;
}

@media only screen and (max-width: 768px) {
	.woocommerce ul.products li.product,
	.woocommerce-page ul.products li.product {
		padding-left: 0;
		padding-right: 0;
	}

	.woocommerce .woocommerce-result-count,
	.woocommerce .woocommerce-ordering {
		float: none;
		width: 100%;
	}

	.woocommerce table.shop_table_responsive tr td,
	.woocommerce-page table.shop_table_responsive tr td {
		display: block;
		text-align: right;
	}
}

/* Match the regular page/post content shell on WooCommerce screens. */
.woocommerce .ixlab-woocommerce-content,
.woocommerce-page .ixlab-woocommerce-content {
	background: #ffffff;
	clear: both;
	box-sizing: border-box;
	padding: 40px;
	margin-bottom: 60px;
}

.woocommerce .ixlab-woocommerce-content::after,
.woocommerce-page .ixlab-woocommerce-content::after {
	content: "";
	display: table;
	clear: both;
}

.woocommerce .ixlab-woocommerce-content .woocommerce-breadcrumb,
.woocommerce-page .ixlab-woocommerce-content .woocommerce-breadcrumb {
	margin-top: 0;
}

@media only screen and (max-width: 768px) {
	.woocommerce .ixlab-woocommerce-content,
	.woocommerce-page .ixlab-woocommerce-content {
		padding: 25px 20px;
		margin-bottom: 40px;
	}
}

/* v3: WooCommerce shortcode pages (cart, checkout, account) use page.php, not woocommerce.php.
   Give them the same white content shell used by product/shop pages. */
.woocommerce-cart .main-content > .content[role="main"],
.woocommerce-checkout .main-content > .content[role="main"],
.woocommerce-account .main-content > .content[role="main"],
.woocommerce-page:not(.single-product):not(.archive) .main-content > .content[role="main"] {
	background: #ffffff;
	clear: both;
	box-sizing: border-box;
	padding: 40px;
	margin-bottom: 60px;
}

.woocommerce-cart .main-content > .content[role="main"]::after,
.woocommerce-checkout .main-content > .content[role="main"]::after,
.woocommerce-account .main-content > .content[role="main"]::after,
.woocommerce-page:not(.single-product):not(.archive) .main-content > .content[role="main"]::after {
	content: "";
	display: table;
	clear: both;
}

/* Make WooCommerce buttons inherit the ixlab mask/overlay hover effect. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page .button,
.woocommerce div.product form.cart .button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout #place_order {
	display: inline-block;
	position: relative;
	z-index: 1;
	overflow: hidden;
	border: none;
	line-height: normal;
	text-decoration: none;
	transition: all 0.2s ease-in-out 0s;
}

.woocommerce a.button::before,
.woocommerce button.button::before,
.woocommerce .button::before,
.woocommerce-page a.button::before,
.woocommerce-page button.button::before,
.woocommerce-page .button::before,
.woocommerce div.product form.cart .button::before,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button::before,
.woocommerce-checkout #place_order::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 150%;
	height: 100%;
	z-index: -1;
	transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -4em, 0);
	transform-origin: 0% 100%;
	background-color: #000;
	transition: all 0.35s ease-in-out 0s;
}

.woocommerce a.button:hover::before,
.woocommerce button.button:hover::before,
.woocommerce .button:hover::before,
.woocommerce-page a.button:hover::before,
.woocommerce-page button.button:hover::before,
.woocommerce-page .button:hover::before,
.woocommerce div.product form.cart .button:hover::before,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover::before,
.woocommerce-checkout #place_order:hover::before {
	transform: rotate3d(0, 0, 1, 0deg);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page .button:hover,
.woocommerce div.product form.cart .button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-checkout #place_order:hover {
	color: #ffffff;
}

/* Inputs cannot render ::before reliably, so submit-style Woo inputs receive a safe hover fallback. */
.woocommerce input.button,
.woocommerce-page input.button,
.woocommerce input[type="submit"],
.woocommerce-page input[type="submit"] {
	min-height: 44px;
	line-height: normal;
	transition: all 0.2s ease-in-out 0s;
}

.woocommerce input.button:hover,
.woocommerce-page input.button:hover,
.woocommerce input[type="submit"]:hover,
.woocommerce-page input[type="submit"]:hover {
	background-color: #000000;
	color: #ffffff;
}

/* Quantity fields were being compressed by old theme/input rules. */
.woocommerce .quantity,
.woocommerce-page .quantity {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	width: auto;
	min-width: 88px;
}

.woocommerce .quantity .qty,
.woocommerce-page .quantity .qty,
.woocommerce div.product form.cart div.quantity .qty,
.woocommerce-cart table.cart td.product-quantity .quantity .qty,
.woocommerce-cart-form table.cart td.product-quantity .quantity .qty {
	box-sizing: border-box;
	width: 88px !important;
	min-width: 88px !important;
	max-width: none !important;
	height: 44px;
	min-height: 44px;
	padding: 0 10px;
	text-align: center;
	line-height: 44px;
}

.woocommerce div.product form.cart div.quantity {
	float: none;
	margin: 0 12px 12px 0;
}

.woocommerce-cart table.cart td.actions .coupon .input-text {
	min-width: 180px;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.woocommerce-page form .form-row select {
	box-sizing: border-box;
	max-width: 100%;
}

@media only screen and (max-width: 768px) {
	.woocommerce-cart .main-content > .content[role="main"],
	.woocommerce-checkout .main-content > .content[role="main"],
	.woocommerce-account .main-content > .content[role="main"],
	.woocommerce-page:not(.single-product):not(.archive) .main-content > .content[role="main"] {
		padding: 25px 20px;
		margin-bottom: 40px;
	}

	.woocommerce-cart table.cart td.actions .coupon .input-text {
		width: 100%;
		min-width: 0;
		margin-bottom: 10px;
	}
}

/* v4: Cart/Checkout/Account are normal WordPress pages, so force the
   same white page shell even when WooCommerce shortcodes render through page.php. */
body.ixlab-woocommerce-shortcode-page #main-content.main-content > .content[role="main"],
body.woocommerce-cart #main-content.main-content > .content[role="main"],
body.woocommerce-checkout #main-content.main-content > .content[role="main"],
body.woocommerce-account #main-content.main-content > .content[role="main"],
#main-content.main-content > .ixlab-woocommerce-page-content {
	display: block;
	width: 100%;
	background: #ffffff !important;
	background-color: #ffffff !important;
	clear: both;
	box-sizing: border-box;
	padding: 40px !important;
	margin-bottom: 60px;
}

body.ixlab-woocommerce-shortcode-page #main-content.main-content,
body.woocommerce-cart #main-content.main-content,
body.woocommerce-checkout #main-content.main-content,
body.woocommerce-account #main-content.main-content {
	background: transparent;
}

body.ixlab-woocommerce-shortcode-page #main-content.main-content > .content[role="main"]::after,
body.woocommerce-cart #main-content.main-content > .content[role="main"]::after,
body.woocommerce-checkout #main-content.main-content > .content[role="main"]::after,
body.woocommerce-account #main-content.main-content > .content[role="main"]::after,
#main-content.main-content > .ixlab-woocommerce-page-content::after {
	content: "";
	display: table;
	clear: both;
}

/* Keep inner WooCommerce blocks transparent so the white shell is visible behind the cart/checkout tables. */
body.ixlab-woocommerce-shortcode-page .woocommerce,
body.ixlab-woocommerce-shortcode-page .woocommerce-cart-form,
body.ixlab-woocommerce-shortcode-page .cart-collaterals,
body.ixlab-woocommerce-shortcode-page form.checkout,
body.woocommerce-cart .woocommerce,
body.woocommerce-checkout .woocommerce,
body.woocommerce-account .woocommerce {
	background: transparent;
}

@media only screen and (max-width: 768px) {
	body.ixlab-woocommerce-shortcode-page #main-content.main-content > .content[role="main"],
	body.woocommerce-cart #main-content.main-content > .content[role="main"],
	body.woocommerce-checkout #main-content.main-content > .content[role="main"],
	body.woocommerce-account #main-content.main-content > .content[role="main"],
	#main-content.main-content > .ixlab-woocommerce-page-content {
		padding: 25px 20px !important;
		margin-bottom: 40px;
	}
}