/* Variation Tweaks (Legacy Styling) */
/* - Right align variation labels */
.woocommerce div.product form.cart .variations th.label { text-align: right; }

/* - Revert back to theme font colour */
.woocommerce div.product form.cart .variations td.value select { color: inherit; }

/* - Add extra left padding to value cells */
.woocommerce div.product form.cart .variations td, .woocommerce-page div.product form.cart .variations td,
.woocommerce div.product form.cart .variations select { padding-left: 10px; }

/* Tiered Pricing Plugin Tweaks */
	/* - Fix padding for table cells. For some reason WooCommerce removes left padding. */
	.woocommerce div.product form.cart table.price-rules-table td {
		padding: 18px 10px;
	}

/* WPC Frequently Bought Together Tweaks */
	/* - Make prices inline to match styling of prices outside of table */
	.woobt-products .woobt-product .woobt-price .amount {
		display: inline;
	}

	/* - Use flex-shrink to reduce size of quantity column to the same as
		     the quantity input contained within it. By default, it is far too
		     large and squishes the product title on mobile. */
	.woobt-quantity {
		flex: 0 1 !important;
	}

	/* - Increase width of price section inside product accessory list.
				 Was previously at 100px, but accessory prices often broke
				 onto several lines at this size. */
	.woobt-products .woobt-product .woobt-price {
		width: 120px;
		flex: 0 0 120px;
		max-width: 120px;
	}

	/* - Remove unwanted extra accessory sections on front end product pages,
	plugin settings won't hide these even though they should,
	so have to override with CSS instead */
	.woobt-product-this {
		display: none !important;
	}
	.woobt-actions {
		display: none !important;
	}
	.woobt-alert {
		display: none !important;
	}

/* Recolour, resize and make bold stock status text for "out of stock" and "available on back order" products */
.woocommerce div.product .stock.available-on-backorder {
	color: #eaa600 !important;
	font-weight: bold !important;
	font-size: 18px !important;
}

.woocommerce div.product .stock.out-of-stock {
	color: #a44 !important;
	font-weight: bold !important;
	font-size: 18px !important;
}

.woocommerce div.product .stock.in-stock {
	display: none
}

/* - Mobile tweaks */
@media (max-width: 767px) {

	/* - Hide accessory thumbnail on mobile */
	.woobt-thumb {
		display: none;
	}

	/* - Decrease width for accessory quantity inputs only */
	.woobt_products .qty {
		width: 3.5em !important;
	}
}

/* Extra product Tab Tweaks
   - Product Specifications
   -- Remove bottom margin of final paragraph for HTML enabled fields */
table.product-specifications td p:last-of-type { margin-bottom: 0px; }

/* - Manuals and Guides Tab */
.eg-manual-link { margin-top: 15px; }

/* - FAQ Tab
   -- Style "Q" and "A" labels */
.question .label, .answer .label {

	font-weight: 700;
	font-style: italic;
	font-size: 20px;

}

/* -- Add margin to "A" label to bring it in line w/ first line of
      answer text. */
.answer .label { margin-top: 3px; }

/* -- Reduce font size of h3 tag */
.question h3 { font-size: 20px; }

/* -- Add top margin to answer text above mobile to bring it roughly in
      line with "A" label */
@media (min-width: 577px) {

	.answer .text { margin-top: 10px; }

}

/* -- Fix Q & A columns collapsing on to two rows between SM and LG
      breakpoints. May need to apply this to all boostrap rows
      instead of just our FAQ rows */
@media (max-width: 992px) {

	body.woocommerce-page.fl-framework-base-4 .row.faq,
	body.woocommerce-page.fl-framework-bootstrap-4 .row.faq {

		flex-direction: row !important;

	}

}


/* - "Product Gallery Slider for WooCommerce" plugin tweaks
   -- Restore missing styles from slick.css

      Both this plugin and "WPC Frequently Bought Together for WooCommerce
      (Premium)" load a their owv version of a slider gallery called slick.
      The former however adds extra styles to their slick.css file, so if
      the latter is loaded after it, vital styles are missing and as a result
      the left / right arrows on the product gallery carousel are missing.

      As a temporary bodge I did a diff of both versions of slick.css and
      dropped the gallery slider plugin's unique styles in here to restore
      the left / right arrows. The files compared and plugin versions are below:

      - woo-product-gallery-slider/assets/css/slick.css ( v2.3.14 )
      - woo-bought-together-premium/assets/slick/slick.css ( v7.5.2 )

    - Joe 12th Dec 2024 (Merry Crumble!)
*/
.wpgs-nav .slick-prev:before,
.wpgs-nav .slick-next:before {
	font-size: 18px;
}
.wpgs-nav .slick-next {
}
.wpgs-nav .slick-prev {
	margin-left: 4px;
}
.wpgs-nav .slick-slide {
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 10px;
}
.wpgs-nav .slick-active img {
	opacity: 0.7;
	transition: all ease-in 0.3s;
}
.wpgs-nav .slick-current img {
	opacity: 1;
}
.wpgs-for .slick-arrow {
	position: absolute;
	z-index: 1;
	cursor: pointer;
	top: 50%;
	margin-top: -15px;
}
.wpgs .slick-disabled {
	display: none;
}
.flaticon-right-arrow {
	right: 0;
}
.slick-slide {
	float: left;

	height: 100%;
	min-height: 1px;

	cursor: pointer;
}

.wpgs-for,
.wpgs-nav {
	display: none;
}
.wpgs-for.slick-initialized,
.wpgs-nav.slick-initialized {
	display: block !important;
}
.wpgs-nav .slick-slide {
	border: 1px solid;
}
.wpgs-lightbox-icon{
	position: relative;
}
.wpgs-lightbox-icon::before {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: 1;
	z-index:9;
	font-weight: 900;
	line-height: inherit;
	content: url("https://s.w.org/images/core/emoji/14.0.0/svg/1f50d.svg");
	display: block;
	line-height: 2;
	text-indent: 0;
	width: 25px;
	height: 35px;
	text-align: center;

	border-radius: 3px;
	top: 10px;
	right: 15px;
	position: absolute;
}
.pswp {
	display: none;
}
@media only screen and (min-width: 991px) {
	.wpgs-lightbox-icon::before{
		display: none;
	}
}

/* -- Add 10px of faux margin to outside edges of arrows */
.woo-product-gallery-slider i.slick-arrow.flaticon-right-arrow { right: 10px }
.woo-product-gallery-slider i.slick-arrow.flaticon-back { left: 10px }

/* -- Change arrow icons
   --- Override font */
.woo-product-gallery-slider i.slick-arrow.flaticon-right-arrow:before,
.woo-product-gallery-slider i.slick-arrow.flaticon-back:before { font-family: 'slick'; }

/* --- Override Character */
.woo-product-gallery-slider i.slick-arrow.flaticon-right-arrow:before { content: '→'; }
.woo-product-gallery-slider i.slick-arrow.flaticon-back:before        { content: '←'; }