/*woocommerce*/

section.wc-my-account {
	margin-bottom: 80px;
	.section-inner {
		max-width: var(--content-width);
	}
	.woocommerce-MyAccount-navigation {
		position: relative;
		height: auto;
		box-shadow: none;

		ul {
			list-style: none;
			padding: 0;
			margin: 0 0 30px 0;
			display: flex;
			flex-direction: column;
			gap: 6px;
			max-width: 220px;
		}

		li {
			margin: 0;
		}

		li a {
			display: block;
			padding: 10px 18px;
			font-family: var(--tstar-med);
			font-size: var(--font-sm);
			text-transform: uppercase;
			letter-spacing: 0.5px;
			color: var(--black);
			text-decoration: none;
			border: 1px solid var(--grey);
			border-radius: 3px;
			transition: all 0.2s ease;
		}

		li a:hover {
			border-color: var(--aqua);
			color: var(--aqua);
		}

		li.is-active a {
			background-color: var(--aqua);
			border-color: var(--aqua);
			color: white;
		}
	}
}

nav.woocommerce-breadcrumb {
	display: none;
}
.nav-tab-wrapper {
	position: relative;
	height: auto;
}
.product-single {
	.section-inner {
		padding: 0;
		/* clearfix */
		&::after {
			content: "";
			display: table;
			clear: both;
		}
	}
}

/* Free delivery section styling */
.free-delivery-section {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 15px 0 40px 0;
	padding: 10px 0;

	i {
		color: var(--aqua);
		font-size: var(--font-xl);
	}

	span {
		font-family: var(--tstar-med);
		font-size: var(--font-sm);
		color: var(--black);
		text-transform: uppercase;
		letter-spacing: 0.5px;
	}
}

/* Discount code section styling */
.discount-code-section {
	margin-bottom: 20px;

	label {
		display: block;
		font-family: var(--tstar-med);
		font-size: var(--font-sm);
		color: var(--black);
		margin-bottom: 8px;
		text-transform: uppercase;
		letter-spacing: 0.5px;
	}

	.discount-code-input-wrapper {
		display: flex;
		gap: 10px;
		align-items: center;

		input[type="text"] {
			flex: 1;
			padding: 6px 10px;
			border: 1px solid var(--grey);
			border-radius: 3px;
			font-family: var(--tstar-reg);
			font-size: var(--font-xs);
			background-color: white;
			height: 30px;
			box-sizing: border-box;
			max-width: 150px;

			&:focus {
				outline: none;
				border-color: var(--aqua);
			}

			&::placeholder {
				color: #999;
			}
		}

		.apply-discount-btn {
			height: 30px;
			padding: 0 15px;
			background-color: var(--aqua);
			color: white;
			border: none;
			border-radius: 3px;
			font-family: var(--tstar-med);
			font-size: var(--font-xs);
			text-transform: uppercase;
			letter-spacing: 0.3px;
			cursor: pointer;
			transition: background-color 0.3s ease;
			box-sizing: border-box;

			&:hover {
				background-color: var(--dark-blue);
			}

			&:active {
				transform: translateY(1px);
			}
		}
	}

	.discount-message {
		margin-top: 10px;
		font-size: var(--font-sm);

		.success {
			color: #28a745;
			font-family: var(--tstar-med);
		}

		.error {
			color: #dc3545;
			font-family: var(--tstar-med);
		}
	}
}

.woocommerce div.product form.cart::after,
.woocommerce div.product form.cart::before {
	content: " ";
	display: none;
}

.woocommerce #content div.product div.images,
.woocommerce div.product div.images,
.woocommerce-page #content div.product div.images,
.woocommerce-page div.product div.images {
	float: left;
	width: 60%;
}

.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
	float: right;
	width: 36%;
	clear: none;
}

.woocommerce div.product .product_title {
	font-size: var(--font-4xl);
	font-family: var(--tstar-med);
}

/* WooCommerce cart form with Picnic classes */
.single-product .cart.picnic-form {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	padding-left: 0;
	margin-left: 0;
	gap: 15px;
	margin-bottom: 20px;

	.quantity {
		display: flex;
		align-items: center;

		input.input {
			width: 80px;
			height: 40px;
			text-align: center;
			border: 1px solid var(--grey);
			border-radius: 5px;
			font-family: var(--tstar-reg);
			font-size: var(--font-sm);

			&:focus {
				outline: none;
				border-color: var(--aqua);
			}
		}
	}

	.single_add_to_cart_button.shyButton {
		height: 40px;
		padding: 0 30px;
		background-color: black;
		color: white;
		border: none;
		border-radius: 5px;
		font-family: var(--tstar-med);
		font-size: var(--font-sm);
		text-transform: uppercase;
		letter-spacing: 0.5px;
		cursor: pointer;
		transition: background-color 0.3s ease;

		&:hover {
			background-color: var(--dark-blue);
		}

		&:active {
			transform: translateY(1px);
		}
	}
}

/* WooCommerce archive product page ( /shop ) */

.woocommerce .products ul::after,
.woocommerce .products ul::before,
.woocommerce ul.products::after,
.woocommerce ul.products::before {
    content: none;
    display: none;
}

.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 280px));
	justify-content: center;
	gap: 20px;
	margin-bottom: 60px;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	float: none !important;
	margin: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: stretch;
	width: 100% !important;
}

.woocommerce .shop ul.products li.product a.woocommerce-loop-product__link {
	flex-direction: column;
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	width: 100%;
	height: 100%;
	flex: 1 1 auto;
	align-self: stretch;
}

.woocommerce .shop ul.products li.product h2.woocommerce-loop-product__title {
	font-family: var(--tstar-bold);
	text-align: center;
	margin-bottom: 20px;
	padding: 0;
}

.woocommerce
	.shop
	ul.products
	li.product
	h2.woocommerce-loop-product__title:has(+ .product-subheading) {
	margin-bottom: 5px;
}

.woocommerce .shop ul.products li.product .product-subheading {
	margin: 0 0 10px 0;
	text-align: center;
	font-size: var(--font-sm);
	color: #666;
	line-height: 1.4;
}

.woocommerce .shop ul.products li.product .product-short-description {
	font-size: var(--font-sm);
	color: var(--black);
	line-height: 1.2;
	margin-bottom: 20px;
	margin-top: auto;
}

.woocommerce .shop .woocommerce-loop-product__link img {
	padding: 10px;
	border: 1px solid var(--grey);
	border-radius: 5px;
	margin-bottom: 10px;
}

.woocommerce .shop ul.products li.product .woocommerce-Price-amount {
	font-family: var(--tstar-med);
	font-size: var(--font-xl);
	color: var(--dark-red);
	line-height: 1.2;
	margin-bottom: 20px;
}

.woocommerce .shop ul.products li.product .price {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	/* align-self: stretch; */
	width: 100%;
	/* flex: 1 1 auto; */
	justify-content: flex-start;
}

.woocommerce .shop ul.products li.product strong {
	display: inline;
}

/* Inline tax note for price displays */
.woocommerce-Price-amount .price-tax-note {
	display: inline-block;
	font-size: 66.667%;
	font-family: var(--tstar-light);
	color: inherit;
	white-space: nowrap;
	vertical-align: baseline;
}

.partner-price-incentive .price-tax-note {
	display: inline-block;
	font-family: var(--tstar-light);
	font-size: 65%;
	color: var(--aqua);
	/* white-space: nowrap; */
	vertical-align: baseline;
}

/* Partner tiered pricing on archive pages */
.partner-tiered-pricing {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.partner-tiered-pricing .tier-price {
	display: block;
	line-height: 1.3;
}

.partner-tiered-pricing .tier-price .price-tax-note {
	font-size: 75%;
	font-family: var(--tstar-light);
	color: var(--dark-red);
}

/* order rcvd */
.order-rcvd {
	margin-bottom: 80px;
}

/* WooCommerce price styling */
.single-product .price {
	font-size: 1.5rem !important;
	font-weight: bold !important;
	color: black !important;
	font-family: var(--tstar-med) !important;
	margin: 10px 0 !important;
}

.single-product .price .amount {
	font-size: 1.5rem !important;
	font-weight: bold !important;
	color: var(--dark-red) !important;
}

.single-product .price del {
	font-size: 1.2rem !important;
	color: #999 !important;
	font-weight: normal !important;
}

.single-product .price ins {
	font-size: 1.5rem !important;
	font-weight: bold !important;
	color: black !important;
	text-decoration: none !important;
}

/* WooCommerce product gallery - thumbnails to the left */
.woocommerce div.product div.images {
	display: flex;
	flex-direction: row-reverse;
	gap: 20px;
	padding-left: 10px;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
	order: 2;
	flex: 1;
	min-width: 0;
}

.woocommerce div.product div.images .thumbnails-scroll-wrapper {
	order: 1;
	width: 108px;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
	/*height: 500px;*/
	height: 500px;
	position: relative;
}

/* Thumbnails scroll buttons positioning */

.scroll-btn {
	position: absolute;
	left: 63px;
	transform: translateX(-50%);
	pointer-events: auto;
	width: 0;
	height: 0;
	border: none;
	background: transparent;
	cursor: pointer;
	transition: all 0.3s ease;
	z-index: 1000;
	opacity: 1;
	display: block;
}

.scroll-up {
	top: -30px;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-bottom: 16px solid var(--aqua);
}

.scroll-down {
	top: 520px;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-top: 16px solid var(--aqua);
}

.scroll-btn:hover {
	/* transform: translateX(-50%) scale(1.2); */
}

.scroll-up:hover {
	/* border-bottom-color: #00cccc !important; */
}

.scroll-down:hover {
	/* border-top-color: #00cccc !important; */
}

.scroll-btn:disabled {
	opacity: 0.3;
	cursor: not-allowed;
	transform: translateX(-50%);
}

.scroll-up:disabled {
	border-bottom-color: white !important;
}

.scroll-down:disabled {
	border-top-color: white !important;
}

/* Target both old and new WooCommerce gallery structures */
.woocommerce div.product div.images .flex-control-thumbs,
.woocommerce div.product div.images .woocommerce-product-gallery__thumbs {
	order: 1;
	display: flex !important;
	flex-direction: column;
	gap: 12px;
	width: 108px;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce div.product div.images .flex-control-thumbs li,
.woocommerce div.product div.images .woocommerce-product-gallery__thumbs li {
	width: 108px;
	height: 108px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--grey);
	overflow: hidden;
	cursor: pointer;
	transition: border-color 0.3s ease;
	display: block;
}

.woocommerce div.product div.images .flex-control-thumbs li:hover,
.woocommerce div.product div.images .flex-control-thumbs li.flex-active-slide,
.woocommerce
	div.product
	div.images
	.woocommerce-product-gallery__thumbs
	li:hover,
.woocommerce
	div.product
	div.images
	.woocommerce-product-gallery__thumbs
	li
	.active {
	border-color: var(--aqua);
}

.woocommerce div.product div.images .flex-control-thumbs li img,
.woocommerce
	div.product
	div.images
	.woocommerce-product-gallery__thumbs
	li
	img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

/* Hide the default thumbnail navigation */
.woocommerce div.product div.images .flex-control-nav {
	display: none;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image a {
	outline-offset: -2px;
	aspect-ratio: 1/1;
	display: block;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image a img {
	aspect-ratio: 1/1;
	display: block;
	object-fit: contain;
	border: 1px solid var(--grey);
}

/*Basket page*/
.wp-block-woocommerce-cart {
	margin: 0 auto 80px auto;
	max-width: var(--content-width);
	padding: 0 20px;
}

/*Checkout page*/
.wp-block-woocommerce-checkout {
	margin: 0 auto 80px auto !important;
	max-width: var(--content-width);
	padding: 0 20px;
}

/* Partner price incentive styling */
.partner-price-incentive {
	display: block;
	padding: 10px 5px 10px 10px;
	background-color: #eaf8ff;
	border-left: 3px solid var(--aqua);
	color: var(--black);
	text-decoration: none;
	margin-top: auto;
	line-height: 1.1;

	.partner-price-label {
		display: block !important;
		margin-bottom: 5px;
	}

	strong,
	small {
		color: var(--black);
	}

	&:hover {
		text-decoration: none;
		color: var(--black);
	}

	.partner-price-amount bdi {
		color: var(--aqua);
		font-weight: bold;
	}
}

/*Affiliate section*/
.afwc-affiliate-details-card-wrapper .afwc-affiliate-details-card {
	background: var(--aqua) !important;
	border-radius: 0px !important;
}

.afwc-affiliate-details-card-wrapper h3,
.afwc-affiliate-details-card-wrapper .afwc-signup-date-wrapper,
.afwc-affiliate-details-card-wrapper .afwc-detail-title {
	color: white !important;
}

.nav-tab-active,
.nav-tab-active:hover,
.nav-tab-active:focus,
.nav-tab-active:focus:active {
	border-bottom: 2px solid var(--aqua) !important;
	color: var(--aqua) !important;
}

@media (max-width: 768px) {
	.woocommerce div.product div.summary {
		padding: 20px;
	}
	.woocommerce div.product div.images.woocommerce-product-gallery {
		padding: 20px;
	}

	/* WooCommerce product gallery - thumbnails to the left */
	.woocommerce div.product div.images {
		flex-direction: column;
	}

	.woocommerce div.product div.images .thumbnails-scroll-wrapper {
		order: 1;
		width: 100%;
		flex-shrink: 0;
		margin: 0;
		padding: 0;
		overflow: hidden;
		height: auto;
		position: relative;
	}

	.scroll-btn {
		display: none;
	}

	.woocommerce div.product div.images .flex-control-thumbs,
	.woocommerce div.product div.images .woocommerce-product-gallery__thumbs {
		flex-direction: row;
		flex-wrap: wrap;
		width: auto;
		padding: 0;
	}

	.woocommerce #content div.product div.images,
	.woocommerce #content div.product div.summary,
	.woocommerce div.product div.images,
	.woocommerce div.product div.summary,
	.woocommerce-page #content div.product div.images,
	.woocommerce-page #content div.product div.summary,
	.woocommerce-page div.product div.images,
	.woocommerce-page div.product div.summary {
		float: none;
		width: 100%;
	}
}