/* FASCo product page redesign */

/* ---------- Header search button icon ---------- */
.wp-block-search__button.has-icon svg,
.wp-block-search__button.has-icon svg path {
	fill: var(--base-3);
}

/* ---------- WooCommerce buttons: force accent color ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.single_add_to_cart_button,
.add_to_cart_button {
	background-color: var(--accent) !important;
	color: var(--base-3) !important;
	border-color: var(--accent) !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.single_add_to_cart_button:hover,
.add_to_cart_button:hover {
	background-color: var(--dark-blue) !important;
	color: var(--base-3) !important;
}

/* ---------- Homepage "Our Products" grid (bespoke, conflict-free) ---------- */
.fasco-home-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 28px 20px;
	align-items: stretch;
}
.fasco-home-card {
	display: flex;
	flex-direction: column;
}
.fasco-home-card-link {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	text-decoration: none;
	color: inherit;
}
.fasco-home-card-img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 6px;
}
.fasco-home-card-title {
	font-size: 17px;
	font-weight: 600;
	color: var(--link, #1e73be);
	margin: 14px 0 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.4em;
}
.fasco-home-card-price {
	font-weight: 700;
	color: var(--accent);
	margin-bottom: 14px;
	margin-top: auto;
}
.fasco-home-card-button {
	display: inline-block;
	text-align: center;
	padding: 12px 18px;
	border-radius: 4px;
	background-color: #c89b3c;
	color: var(--base-3);
	text-decoration: none;
	font-weight: 600;
	border: none;
}
.fasco-home-card-button:hover {
	background-color: var(--dark-blue);
	color: var(--base-3);
}
@media (max-width: 900px) {
	.fasco-home-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 700px) {
	.fasco-home-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px) {
	.fasco-home-grid { grid-template-columns: 1fr; }
}

/* ---------- Homepage "Our Products" grid: gold buttons ---------- */
body.page-id-123 ul.products .button,
body.page-id-123 ul.products .add_to_cart_button {
	background-color: #c89b3c !important;
	border-color: #c89b3c !important;
	color: var(--base-3) !important;
}
body.page-id-123 ul.products .button:hover,
body.page-id-123 ul.products .add_to_cart_button:hover {
	background-color: var(--dark-blue) !important;
	border-color: var(--dark-blue) !important;
	color: var(--base-3) !important;
}

/* ---------- Product grids: even card alignment ---------- */
/* Control the grid itself so every card gets an equal, predictable
   column width (prevents a lone card in a half-empty row from
   sizing itself by its own content) and stretches to match the
   tallest card in its row. */
.woocommerce ul.products.products.products[class*="columns-"],
ul.products.products.products[class*="columns-"] {
	display: grid !important;
	gap: 28px 20px !important;
	align-items: stretch !important;
}
.woocommerce ul.products.products.products.columns-2,
ul.products.products.products.columns-2 { grid-template-columns: repeat(2, 1fr) !important; }
.woocommerce ul.products.products.products.columns-3,
ul.products.products.products.columns-3 { grid-template-columns: repeat(3, 1fr) !important; }
.woocommerce ul.products.products.products.columns-4,
ul.products.products.products.columns-4 { grid-template-columns: repeat(4, 1fr) !important; }
.woocommerce ul.products.products.products.columns-5,
ul.products.products.products.columns-5 { grid-template-columns: repeat(5, 1fr) !important; }
.woocommerce ul.products.products.products.columns-6,
ul.products.products.products.columns-6 { grid-template-columns: repeat(6, 1fr) !important; }

.woocommerce ul.products.products.products[class*="columns-"] li.product.product.product,
ul.products.products.products[class*="columns-"] li.product.product.product {
	width: auto !important;
	max-width: none !important;
	float: none !important;
	margin: 0 !important;
}

@media (max-width: 900px) {
	.woocommerce ul.products.products.products.columns-4,
	.woocommerce ul.products.products.products.columns-5,
	.woocommerce ul.products.products.products.columns-6,
	ul.products.products.products.columns-4,
	ul.products.products.products.columns-5,
	ul.products.products.products.columns-6 {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}
@media (max-width: 700px) {
	.woocommerce ul.products.products.products[class*="columns-"],
	ul.products.products.products[class*="columns-"] {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}
ul.products[class*="columns-"] li.product {
	display: flex !important;
	flex-direction: column;
	width: auto !important;
	float: none !important;
	margin: 0 !important;
}
ul.products li.product > a.woocommerce-loop-product__link,
ul.products li.product > a.woocommerce-LoopProduct-link {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}
ul.products li.product .wc-product-image,
ul.products li.product .inside-wc-product-image {
	width: 100%;
}
ul.products li.product img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100% !important;
	height: auto !important;
}
ul.products li.product .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.5em;
}
ul.products li.product .price {
	margin-top: auto !important;
	padding-top: 8px;
}
ul.products li.product .button,
ul.products li.product .add_to_cart_button {
	margin-top: 10px;
}

/* ---------- Product grids: single column on mobile ---------- */
@media (max-width: 600px) {
	.woocommerce ul.products.products.products[class*="columns-"],
	ul.products.products.products[class*="columns-"] {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 32px !important;
	}
	ul.products[class*="columns-"] li.product {
		width: 100% !important;
		float: none !important;
		margin: 0 !important;
	}
}

/* ---------- Gallery thumbnails: small column on the left, main image fills the rest ---------- */
.fasco-gallery-thumbs {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
	margin: 10px 0 0;
	padding: 0;
}
.fasco-gallery-thumb-img {
	width: 30px;
	height: 30px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 4px;
	border: 2px solid var(--base);
	cursor: pointer;
	display: block;
}
.fasco-gallery-thumb-img.is-active {
	border-color: var(--accent);
}
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
	display: none !important;
}
@media (min-width: 480px) {
	.woocommerce-product-gallery {
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		gap: 10px;
	}
	.woocommerce-product-gallery > *:not(.fasco-gallery-thumbs) {
		flex: 1 1 auto;
		min-width: 0;
		margin: 0;
	}
	.fasco-gallery-thumbs {
		flex-direction: column;
		gap: 8px;
		width: 30px;
		flex: 0 0 30px;
		margin: 0;
		order: -1;
	}
}

/* ---------- Summary intro (subheading + paragraph) ---------- */
.fasco-summary-intro {
	margin: 10px 0 18px;
}
.fasco-subheading {
	font-size: 20px !important;
	font-weight: 700 !important;
	color: var(--dark-blue);
	margin: 0 0 8px !important;
	line-height: 1.3 !important;
}
.fasco-intro {
	color: var(--contrast-2);
	line-height: 1.6;
	margin: 0 !important;
}

/* ---------- Ideal For icon boxes ---------- */
.fasco-ideal-for {
	margin: 18px 0;
}
.fasco-ideal-for-label {
	font-weight: 700;
	color: var(--dark-blue);
	margin: 0 0 10px;
}
.fasco-ideal-for-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.fasco-ideal-for-box {
	flex: 1 1 110px;
	max-width: 150px;
	border: 1px solid var(--accent);
	border-radius: 8px;
	padding: 16px 10px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
.fasco-ideal-for-icon {
	width: 34px;
	height: 34px;
	color: var(--accent);
	display: inline-flex;
}
.fasco-ideal-for-icon svg {
	width: 100%;
	height: 100%;
}
.fasco-ideal-for-text {
	font-size: 14px;
	font-weight: 600;
	color: var(--dark-blue);
}

/* ---------- Product tabs ---------- */
.woocommerce-tabs ul.tabs {
	border-bottom: 1px solid var(--base);
}
.woocommerce-tabs ul.tabs li {
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
}
.woocommerce-tabs ul.tabs li a {
	font-weight: 700;
	padding-bottom: 14px !important;
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover {
	color: var(--accent) !important;
	box-shadow: inset 0 -3px 0 0 var(--accent);
}

/* ---------- Description tab: content + At a Glance sidebar ---------- */
.fasco-description-tab {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	align-items: flex-start;
}
.fasco-description-main {
	flex: 2 1 320px;
}
.fasco-description-main h3 {
	color: var(--dark-blue);
	margin-top: 0;
}
.fasco-at-a-glance {
	flex: 1 1 240px;
	background: var(--base-2);
	border-radius: 8px;
	padding: 20px 22px;
}
.fasco-at-a-glance h4 {
	margin: 0 0 10px;
	color: var(--dark-blue);
}
.fasco-at-a-glance ul {
	margin: 0;
	padding-left: 18px;
}
.fasco-at-a-glance li {
	margin-bottom: 6px;
	color: var(--contrast-2);
}

/* ---------- Package Details table ---------- */
.fasco-package-details-table {
	width: 100%;
	border-collapse: collapse;
}
.fasco-package-details-table th,
.fasco-package-details-table td {
	text-align: left;
	padding: 10px 14px;
	border-bottom: 1px solid var(--base);
}
.fasco-package-details-table th {
	width: 220px;
	color: var(--dark-blue);
}

/* ---------- Homepage: remove the red background box behind the intro paragraph ---------- */
body.page-id-123 .gb-text-07cb4594 {
	background-color: transparent;
	color: inherit;
	border-radius: 0;
	padding: 0;
}

/* ---------- About Us page: left-justified copy (was centered) ---------- */
body.page-id-389690 .entry-content,
body.page-id-389690 .entry-content h2,
body.page-id-389690 .entry-content p,
body.page-id-389690 .entry-content div {
	text-align: left;
}

/* ---------- Related products heading ---------- */
.related.products > h2 {
	text-align: center;
}

/* ---------- Color swatches ---------- */
.fasco-color-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 4px;
}
.fasco-color-swatches + select {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.fasco-swatch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border: 1px solid var(--base);
	border-radius: 6px;
	background: var(--base-3);
	cursor: pointer;
	font: inherit;
}
.fasco-swatch:hover {
	border-color: var(--accent);
}
.fasco-swatch.is-selected {
	border-color: var(--accent);
	box-shadow: 0 0 0 1px var(--accent);
}
.fasco-swatch-chip {
	width: 18px;
	height: 18px;
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	display: inline-block;
}
.fasco-swatch-label {
	font-size: 14px;
	color: var(--dark-blue);
}
