/* 
Theme Name: Green Plastic Wood
Theme URI:  https://www.greenplasticwood.co.za/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: White Paper Studio
Author URI: https://whitepaperstudio.co.za/
Template: hello-elementor
Version: 3.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* Phones (iPhone Safari especially) turn phone numbers and emails into blue links; keep them in the
   surrounding text colour (white on the dark contact sections, grey on About Us) while staying tappable */
a[x-apple-data-detectors],
a[href^="tel:"],
a[href^="mailto:"] {
	color: inherit !important;
	text-decoration: none !important;
	font: inherit !important;
}

/* Product gallery thumbnails: full opacity (WooCommerce fades inactive ones to 50%) */
.woocommerce-product-gallery .flex-control-thumbs img {
	opacity: 1 !important;
}

/* Thumbnails in one row of 4; extra images scroll (arrows added by functions.php, swipe on touch) */
.woocommerce-product-gallery .gpw-thumbs {
	position: relative;
}
.woocommerce-product-gallery .flex-control-thumbs {
	display: flex !important;
	flex-wrap: nowrap;
	position: relative;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
.woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar {
	display: none;
}
.woocommerce-product-gallery .flex-control-thumbs li {
	flex: 0 0 25%;
	width: 25% !important;
	float: none !important;
	scroll-snap-align: start;
}
.woocommerce-product-gallery .gpw-thumbs__nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0 0 3px;
	border: 0;
	border-radius: 50%;
	background: rgba(0, 51, 51, .85);
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	transform: translateY(-50%);
	transition: background-color .2s, opacity .2s;
}
.woocommerce-product-gallery .gpw-thumbs__nav:hover,
.woocommerce-product-gallery .gpw-thumbs__nav:focus-visible {
	background: #006633;
	color: #fff;
}
.woocommerce-product-gallery .gpw-thumbs__prev {
	left: 6px;
}
.woocommerce-product-gallery .gpw-thumbs__next {
	right: 6px;
}
.woocommerce-product-gallery .gpw-thumbs__nav:disabled {
	opacity: 0;
	pointer-events: none;
}

/* Homepage product scroller: pin buttons to the card bottom so they line up when a title wraps */
.gpw-product-scroller .elementor-widget-button {
	margin-top: auto;
}

/* Menu mini cart */
.elementor-widget-woocommerce-menu-cart {
	--cart-background-color: #fff;
	--cart-border-radius: 3px;
	--cart-padding: 24px;
	--cart-close-button-color: #003333;
	--cart-close-button-hover-color: #006633;
	--remove-item-button-color: #9aa5a5;
	--remove-item-button-hover-color: #003333;
	--product-price-color: #003333;
	--product-variations-color: #606060;
	--divider-color: #e3e8e6;
	--subtotal-divider-color: #e3e8e6;
	--menu-cart-subtotal-color: #003333;
	--cart-footer-buttons-border-radius: 3px;
	--view-cart-button-background-color: transparent;
	--view-cart-button-text-color: #003333;
	--view-cart-button-hover-background-color: #003333;
	--view-cart-button-hover-text-color: #fff;
	--checkout-button-background-color: #003333;
	--checkout-button-text-color: #fff;
	--checkout-button-hover-background-color: #006633;
	--checkout-button-hover-text-color: #fff;
}

/* Open from the icon's right edge so the panel stays on screen */
.elementor-widget-woocommerce-menu-cart.elementor-menu-cart--cart-type-mini-cart .elementor-menu-cart__container {
	left: auto !important;
	right: 0 !important;
	transform-origin: top right;
	min-width: 0;
	width: 360px;
	max-width: calc(100vw - 32px);
}
.elementor-widget-woocommerce-menu-cart.elementor-menu-cart--shown.elementor-menu-cart--cart-type-mini-cart .elementor-menu-cart__container {
	transform: none !important;
}

.elementor-menu-cart__main {
	border-top: 4px solid #CCCC33;
	box-shadow: 0 12px 32px rgba(0, 51, 51, .18);
}

.elementor-menu-cart__product-image img {
	border-radius: 3px;
}

.elementor-menu-cart__product-name,
.elementor-menu-cart__product-name a {
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 18px;
	line-height: 1.2;
	color: #003333;
}
.elementor-menu-cart__product-name a:hover {
	color: #006633;
}

.elementor-menu-cart__product-name .variation {
	margin-top: 6px;
	font-family: "Source Sans Pro", sans-serif;
	font-size: 14px;
}
.elementor-menu-cart__product-name .variation p {
	margin: 0;
}

.elementor-menu-cart__product-price {
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 17px;
}
.elementor-menu-cart__product-price .product-quantity {
	color: #606060;
}

.elementor-menu-cart__subtotal {
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 22px;
	font-weight: 600;
}
.elementor-menu-cart__subtotal strong {
	font-weight: 600;
	text-transform: uppercase;
}

.elementor-menu-cart__footer-buttons .elementor-button {
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	border: 2px solid #003333;
	transition: background-color .2s, color .2s, border-color .2s;
}
.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
	border-color: #006633;
}

/* Variation option labels (Size, Backrest, Colour...): the product template hides them, but with
   several options per product shoppers need to see what each row is */
.elementor-widget-woocommerce-product-add-to-cart table.variations tr {
	display: block;
	margin-bottom: 12px;
}
.elementor-widget-woocommerce-product-add-to-cart table.variations th.label {
	display: block !important;
	padding: 0 0 8px;
	text-align: left;
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2 !important; /* WooCommerce sets 2em on variation cells with a more specific selector */
	text-transform: uppercase;
	color: #003333;
}
.elementor-widget-woocommerce-product-add-to-cart table.variations th.label label,
.elementor-widget-woocommerce-product-add-to-cart table.variations th.label .woo-selected-variation-item-name {
	margin: 0;
	font: inherit;
	line-height: inherit;
	vertical-align: baseline;
	color: inherit;
}
.elementor-widget-woocommerce-product-add-to-cart table.variations td.value {
	display: block;
	padding: 0;
}
/* Button-type options (Size, Backrest, Legs, Roof, Armrests): same soft green panel as the
   Optional Extras, one option per row with a radio marker. !important beats the swatch plugin's own item styles */
.elementor-widget-woocommerce-product-add-to-cart table.variations tr:has(.button-variable-items-wrapper) {
	padding: 16px 20px 6px;
	background: #F2F7EE;
	border: 1px solid #DCE9D5;
	border-radius: 3px;
}
.woo-variation-swatches .button-variable-items-wrapper {
	display: block !important;
	margin: 0 !important;
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item {
	display: flex !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	padding: 10px 0 !important;
	background: transparent !important;
	border: 0 !important;
	border-top: 1px solid #DCE9D5 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	justify-content: flex-start !important;
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item-contents {
	flex-direction: row !important;
	justify-content: flex-start !important;
	align-items: center !important;
	gap: 10px;
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item-contents::before {
	content: "";
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	border: 2px solid #9AA5A5;
	border-radius: 50%;
	background: #fff;
	box-sizing: border-box;
	transition: border-color .2s, background .2s;
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item:hover .variable-item-contents::before {
	border-color: #006633;
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item.selected .variable-item-contents::before {
	border-color: #006633;
	background: radial-gradient(circle, #006633 0 4px, #fff 5px);
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item-span {
	padding: 0 !important;
	font-family: "Source Sans Pro", sans-serif;
	font-size: 16px;
	line-height: 1.4;
	color: #333;
}
.woo-variation-swatches .button-variable-items-wrapper .variable-item.selected .variable-item-span {
	color: #003333;
	font-weight: 600;
}

/* Colour image swatches: large enough to read the plank texture and label */
.woo-variation-swatches .image-variable-items-wrapper {
	gap: 10px;
}
.woo-variation-swatches .image-variable-items-wrapper .variable-item {
	width: 96px !important;
	height: 96px !important;
	margin: 0 !important;
	padding: 3px !important;
	border-radius: 3px !important;
	box-shadow: 0 0 0 1px #C9D3CD !important;
}
.woo-variation-swatches .image-variable-items-wrapper .variable-item.selected {
	box-shadow: 0 0 0 3px #006633 !important;
}
/* The plugin's tick covers the colour name on the swatch; the green border marks the selection */
.woo-variation-swatches .image-variable-items-wrapper .variable-item .variable-item-contents::before {
	display: none !important;
}
.woo-variation-swatches .image-variable-items-wrapper .variable-item-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 2px;
}

/* The main price already follows the selected variation, so drop WooCommerce's repeat of it */
.elementor-widget-woocommerce-product-add-to-cart .woocommerce-variation-price {
	display: none;
}

/* Add to cart: add-ons panel on its own row, quantity + button underneath */
.elementor-widget-woocommerce-product-add-to-cart .woocommerce-variation-add-to-cart,
.elementor-widget-woocommerce-product-add-to-cart form.cart:not(.variations_form):not(.grouped_form) {
	flex-wrap: wrap !important; /* Elementor's add-to-cart layout forces nowrap with a higher-specificity selector */
	align-items: center;
	gap: 12px;
}
/* WooCommerce clearfix pseudo-elements become empty flex items and pick up the gap */
.elementor-widget-woocommerce-product-add-to-cart form.cart:not(.variations_form):not(.grouped_form)::before,
.elementor-widget-woocommerce-product-add-to-cart form.cart:not(.variations_form):not(.grouped_form)::after {
	display: none;
}

.gpw-addons {
	flex: 0 0 100%;
	margin: 4px 0;
	padding: 16px 20px;
	background: #F2F7EE;
	border: 1px solid #DCE9D5;
	border-radius: 3px;
}
.gpw-addons__title {
	margin: 0 0 8px;
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2;
	color: #003333;
	text-transform: uppercase;
}
.gpw-addons__option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 0;
	border-top: 1px solid #DCE9D5;
	cursor: pointer;
	color: #333;
}
.gpw-addons__option input {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: #006633;
	cursor: pointer;
}
.gpw-addons__label {
	flex: 1;
}
.gpw-addons__price {
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 17px;
	color: #003333;
}

/* Enquiry-only products (Grandstands, Jungle Gyms): quote form in the same soft green panel */
.gpw-enquiry {
	padding: 16px 20px 20px;
	background: #F2F7EE;
	border: 1px solid #DCE9D5;
	border-radius: 3px;
}
.gpw-enquiry__title {
	margin: 0 0 6px;
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: uppercase;
	color: #003333;
}
.gpw-enquiry__intro {
	margin: 0 0 14px;
	font-size: 15px;
	color: #606060;
}

/* Newsletter tick box on the Elementor forms: same size and green tick as the Optional Extras */
.elementor-field-type-acceptance .elementor-field-subgroup {
	display: flex;
	align-items: center;
}
.elementor-field-type-acceptance input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 0 8px 0 0;
	accent-color: #006633;
	cursor: pointer;
}

/* Quantity stepper */
.quantity:has(.gpw-qty-btn):not(:has(input[type="hidden"])) {
	display: inline-flex;
	align-items: stretch;
	height: 48px;
	border: 1px solid #C9D3CD;
	border-radius: 3px;
	background: #fff;
	overflow: hidden;
}
/* !important: the Elementor add-to-cart widget styles every button inside .cart */
.quantity .gpw-qty-btn {
	width: 40px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: #003333 !important;
	font-size: 20px !important;
	line-height: 1;
	cursor: pointer;
	transition: background-color .2s;
}
.quantity .gpw-qty-btn:hover,
.quantity .gpw-qty-btn:focus-visible {
	background: #F2F7EE !important;
}
.quantity:has(.gpw-qty-btn) .qty {
	width: 44px;
	height: 100%;
	margin: 0 !important;
	padding: 0;
	border: 0;
	border-inline: 1px solid #C9D3CD;
	border-radius: 0;
	text-align: center;
	font-family: "DIN Condensed Bold", sans-serif;
	font-size: 18px;
	color: #003333;
	-moz-appearance: textfield;
}
.quantity .qty::-webkit-outer-spin-button,
.quantity .qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
/* Fixed-quantity products render a hidden input, so drop the buttons */
.quantity:has(input[type="hidden"]) .gpw-qty-btn {
	display: none;
}
.elementor-widget-woocommerce-product-add-to-cart .single_add_to_cart_button {
	height: 48px;
	padding-block: 0;
	margin-inline-start: 0 !important;
}
