/**
 * Maven Home - Single product page styles
 * Premium, conversion-focused layout.
 */

/* ==========================================================================
   Main content area - break out of parent theme's 645px constraint
   ========================================================================== */

/* Override block theme content-size variable for product pages - COMMENTED OUT to test if causing page constraint */
/* .maven-product-page {
	--wp--style--global--content-size: 1200px;
	--wp--style--global--wide-size: 1400px;
} */

/* Remove block theme's 645px constraint from body (fixes zoomed-out effect + allows header/footer break-out) */
body.maven-product-page {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Force full-width chain so product content can expand (fixes squashed left + white space right) */
.maven-product-page #page-container,
.maven-product-page #et-main-area {
	width: 100% !important;
	max-width: none !important;
	overflow-x: hidden;
}

.maven-product-page #et-main-area,
.maven-product-page #primary,
.maven-product-page .woocommerce,
.maven-product-page main,
.maven-product-page .wp-block-group,
.maven-product-page .is-layout-constrained,
.maven-product-page [class*="layout-constraint"] {
	max-width: none !important;
}

/* Ensure constrained layout children don't get limited */
.maven-product-page .is-layout-constrained > *,
.maven-product-page .wp-block-group-is-layout-constrained > * {
	max-width: none !important;
}

.maven-product-page #primary,
.maven-product-page main {
	padding-top: 2rem;
	width: 100%;
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

/* Breadcrumbs */
.maven-product-page .woocommerce-breadcrumb {
	font-size: 0.875rem;
	color: var(--color-text-muted);
	margin-top: 1rem;
	margin-bottom: 3.5rem;
	padding-left: 5%;
	padding-right: 0;
}

.maven-product-page .woocommerce-breadcrumb a {
	color: var(--color-primary);
	text-decoration: none;
}

.maven-product-page .woocommerce-breadcrumb a:hover {
	text-decoration: underline;
}

/* Hide stock quantity on single product */
.maven-product-page .stock {
	display: none;
}

/* WooCommerce block notices - add to cart success */
.maven-product-page .woocommerce-notices-wrapper {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}

.maven-product-page .wc-block-components-notice-banner {
	max-width: 100%;
	width: 100%;
	box-sizing: border-box;
	overflow: visible;
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

/* Suppress browser focus ring - WC calls .focus() on notice for screen readers */
.wc-block-components-notice-banner:focus {
	outline: none !important;
	box-shadow: none !important;
}

.maven-product-page .wc-block-components-notice-banner.is-success {
	background: rgba(212, 116, 92, 0.08) !important;
	border: 1px solid rgba(212, 116, 92, 0.3) !important;
	border-radius: 12px;
	padding: 1rem 1.5rem;
	margin: 0 0 2rem;
}

.maven-product-page .wc-block-components-notice-banner.is-success > svg {
	fill: var(--color-white);
	background-color: var(--color-accent) !important;
	flex-shrink: 0;
}

/* Content area: text left, View Cart button pushed right */
.maven-product-page .wc-block-components-notice-banner__content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	flex: 1;
	min-width: 0;
}

/* View cart as charcoal button - no underline */
.maven-product-page .wc-block-components-notice-banner__content .wc-forward,
.maven-product-page .wc-block-components-notice-banner__content a.button {
	display: inline-block !important;
	padding: 0.5rem 1.25rem !important;
	font-size: 0.9rem !important;
	font-weight: 600 !important;
	font-family: var(--font-body) !important;
	color: var(--color-white) !important;
	background: var(--color-charcoal) !important;
	border: none !important;
	border-radius: 10px !important;
	text-decoration: none !important;
	text-decoration-line: none !important;
	float: none !important;
	opacity: 1 !important;
	white-space: nowrap;
	transition: background 0.2s ease;
}

.maven-product-page .wc-block-components-notice-banner__content .wc-forward:hover,
.maven-product-page .wc-block-components-notice-banner__content a.button:hover {
	background: #2a2a2a !important;
	text-decoration: none !important;
}

/* ==========================================================================
   Single product layout - two column
   ========================================================================== */

.maven-single-product {
	width: 100%;
	padding: 0 5% 3rem;
	max-width: 1400px;
	margin: 0 auto;
}

.maven-single-product__inner {
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: 3rem;
	align-items: start;
	margin-bottom: 3rem;
}

/* Override WooCommerce float + 48% - let our grid control layout */
.maven-single-product .woocommerce-product-gallery,
.maven-single-product .woocommerce-product-gallery.images {
	float: none !important;
	width: 100% !important;
}

.maven-single-product .maven-single-product__summary,
.maven-single-product .summary.entry-summary {
	float: none !important;
	width: 100% !important;
	max-width: 90%;
}

/* Product images - force visible (WooCommerce starts opacity:0, JS fades in; block themes may not load gallery scripts) */
.maven-single-product .woocommerce-product-gallery {
	opacity: 1 !important;
	position: relative;
	background: var(--color-bg-alt);
	border-radius: 20px;
	overflow: hidden;
	min-width: 0; /* allow grid column to shrink/grow properly */
}

.maven-single-product .woocommerce-product-gallery__wrapper {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.maven-single-product .woocommerce-product-gallery__image {
	margin-bottom: 0;
}

/* Main product image - natural aspect ratio, no forced cropping */
.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:first-child {
	flex: 0 0 100%;
	overflow: hidden;
	max-width: 600px;
}

.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:first-child a {
	display: block;
}

.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:first-child img {
	width: 100%;
	height: auto;
	display: block;
	vertical-align: top;
	object-fit: contain;
}

/* FlexSlider structure - reset our flex layout so FlexSlider can work correctly */
.maven-single-product .flex-viewport .woocommerce-product-gallery__wrapper {
	display: block !important;
	flex-wrap: nowrap !important;
	gap: 0 !important;
}

.maven-single-product .flex-viewport .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image {
	flex: none !important;
	max-width: none !important;
}

.maven-single-product .flex-viewport .woocommerce-product-gallery__image img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
}

/* Space between main image area and thumbnails */
.maven-single-product .flex-viewport {
	margin-bottom: 1rem;
}

.maven-single-product .flex-control-thumbs {
	margin-top: 0;
}

/* Thumbnails only - do NOT apply height:auto to main image (would override first-child) */
.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(:first-child) img {
	width: 100%;
	height: auto;
	display: block;
	vertical-align: top;
}

/* Thumbnails - WooCommerce outputs multiple .woocommerce-product-gallery__image in wrapper */
.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(:first-child) {
	flex: 0 0 calc(25% - 6px);
	max-width: 80px;
}

.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(:first-child) img {
	border-radius: 10px;
	cursor: pointer;
	opacity: 0.85;
	transition: opacity 0.2s ease, box-shadow 0.2s ease;
}

.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(:first-child):hover img,
.maven-single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(:first-child).flex-active img {
	opacity: 1;
	box-shadow: 0 0 0 2px var(--color-accent);
}

/* Sale badge */
.maven-single-product .onsale {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 10;
	background: var(--color-accent);
	color: var(--color-white);
	font-size: 0.75rem;
	font-weight: 600;
	padding: 6px 12px;
	border-radius: 8px;
	letter-spacing: 0.05em;
}

/* ==========================================================================
   Product summary - title, price, add to cart
   ========================================================================== */

.maven-single-product__summary .product_title {
	font-family: var(--font-heading);
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	font-weight: 500;
	color: var(--color-primary);
	margin: 0 0 0.5rem;
	line-height: 1.2;
}

.maven-single-product__summary .maven-product-sku {
	font-size: 0.9rem;
	color: var(--color-text-muted);
	margin: 0 0 1rem;
}

.maven-single-product__summary .price {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--color-primary);
	margin-bottom: 1.75rem !important;
}

.maven-single-product__summary .price del {
	color: var(--color-text-muted);
	font-weight: 400;
	margin-right: 0.5rem;
}

/* Add to cart */
.maven-single-product__summary .cart {
	margin-bottom: 1.5rem;
}

.maven-single-product__summary .single_add_to_cart_button {
	display: inline-block;
	padding: 1rem 2rem;
	font-size: 1rem;
	font-weight: 600;
	font-family: var(--font-body);
	color: var(--color-white);
	background: var(--color-accent);
	border: none;
	border-radius: 12px;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}

.maven-single-product__summary .single_add_to_cart_button:hover {
	background: #c26650;
	transform: translateY(-2px);
}

.maven-single-product__summary .quantity {
	margin-right: 12px;
}

.maven-single-product__summary .quantity input {
	width: 70px;
	padding: 0.75rem 12px;
	font-size: 1rem;
	border: 1px solid rgba(26, 26, 26, 0.15);
	border-radius: 10px;
	background: var(--color-bg-alt);
}

/* Product meta (SKU, categories) - subtle */
.maven-single-product__summary .product_meta {
	font-size: 0.9rem;
	color: var(--color-text-muted);
	padding-top: 1rem;
	border-top: 1px solid rgba(26, 26, 26, 0.08);
}

.maven-single-product__summary .product_meta a {
	color: var(--color-primary);
	text-decoration: none;
}

.maven-single-product__summary .product_meta a:hover {
	text-decoration: underline;
}

/* Variable product - variations dropdown */
.maven-single-product__summary .variations {
	margin-bottom: 1rem;
}

.maven-single-product__summary .variations tr {
	display: flex;
	flex-direction: column;
	margin-bottom: 1rem;
}

.maven-single-product__summary .variations td {
	padding: 0;
	border: none;
}

.maven-single-product__summary .variations label {
	font-weight: 500;
	font-size: 0.9rem;
	margin-bottom: 0.5rem;
	display: block;
	color: var(--color-primary);
}

.maven-single-product__summary .variations select {
	width: 100%;
	max-width: 100%;
	padding: 0.75rem 2rem 0.75rem 1rem;
	font-size: 1rem;
	border: 1px solid rgba(26, 26, 26, 0.15);
	border-radius: 10px;
	background: var(--color-bg-alt);
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231A1A1A' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
}

/* Star rating */
.maven-single-product__summary .star-rating {
	color: var(--color-accent);
}

/* ==========================================================================
   Product description (in summary column, under add to cart)
   ========================================================================== */

.maven-single-product__summary .maven-product-description {
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(26, 26, 26, 0.08);
}

.maven-single-product__summary .maven-product-description__title {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	font-weight: 500;
	color: var(--color-primary);
	margin: 0 0 1rem;
}

.maven-single-product__summary .maven-product-description__content {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--color-text);
}

.maven-single-product__summary .maven-product-description__content p {
	margin: 0 0 1rem;
}

.maven-single-product__summary .maven-product-description__content p:last-child {
	margin-bottom: 0;
}

.maven-single-product__summary .maven-product-description__content ul,
.maven-single-product__summary .maven-product-description__content ol {
	margin: 0 0 1rem;
	padding-left: 1.25rem;
}

.maven-single-product__summary .maven-product-description__content li {
	margin-bottom: 0.5rem;
}

.maven-single-product__summary .maven-product-description__content h2,
.maven-single-product__summary .maven-product-description__content h3 {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 500;
	color: var(--color-primary);
	margin: 1.5rem 0 0.75rem;
}

/* ==========================================================================
   Reviews - standalone section below product grid
   ========================================================================== */

.maven-single-product .maven-reviews-section {
	margin-top: 3rem;
	padding-top: 2.5rem;
	border-top: 1px solid rgba(26, 26, 26, 0.08);
	width: 100%;
	max-width: 90%;
}

.maven-single-product .maven-reviews-section .woocommerce-Reviews {
	margin-top: 0;
}

.maven-single-product .maven-reviews-section .woocommerce-Reviews-title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--color-primary);
	margin: 0 0 1.5rem;
}

.maven-single-product .woocommerce-Reviews .comment-list {
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}

.maven-single-product .woocommerce-Reviews .comment {
	padding: 1.25rem 0;
	border-bottom: 1px solid rgba(26, 26, 26, 0.08);
}

.maven-single-product .woocommerce-Reviews .comment-body .star-rating {
	color: var(--color-primary);
}

.maven-single-product .comment-form-rating label,
.maven-single-product .comment-form-comment label,
.maven-single-product .comment-form-author label,
.maven-single-product .comment-form-email label {
	display: block;
	font-weight: 500;
	font-size: 0.9rem;
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}

.maven-single-product .comment-form-rating p.stars a::before {
	color: var(--color-charcoal);
}

.maven-single-product .comment-form input[type="text"],
.maven-single-product .comment-form input[type="email"],
.maven-single-product .comment-form textarea {
	width: 100%;
	max-width: 100%;
	padding: 0.75rem 1rem;
	font-size: 1rem;
	font-family: var(--font-body);
	border: 1px solid rgba(26, 26, 26, 0.15);
	border-radius: 10px;
	background: var(--color-bg-alt);
	color: var(--color-text);
}

.maven-single-product .comment-form textarea {
	min-height: 120px;
	resize: vertical;
}

.maven-single-product .comment-form .form-submit {
	margin-top: 1rem;
}

.maven-single-product .comment-form input[type="submit"],
.maven-single-product #respond .form-submit input {
	padding: 0.75rem 1.5rem;
	font-size: 1rem;
	font-weight: 600;
	font-family: var(--font-body);
	color: var(--color-white);
	background: var(--color-charcoal);
	border: none;
	border-radius: 10px;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}

.maven-single-product .comment-form input[type="submit"]:hover,
.maven-single-product #respond .form-submit input:hover {
	background: #2a2a2a;
	transform: translateY(-1px);
}

.maven-single-product .woocommerce-noreviews {
	color: var(--color-text-muted);
	font-size: 0.95rem;
}

/* ==========================================================================
   Related products - same card style as category grid
   ========================================================================== */

.maven-product-page .related.products {
	max-width: 1400px;
	margin: 3rem auto 0;
	padding: 0 5%;
}

.maven-product-page .related.products h2 {
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 2.5vw, 1.75rem);
	font-weight: 500;
	color: var(--color-primary);
	margin: 0 0 1.5rem;
	text-align: center;
}

.maven-product-page .related.products ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 24px;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.maven-product-page .related.products ul.products::before,
.maven-product-page .related.products ul.products::after {
	display: none !important;
}

.maven-product-page .related.products li.product {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}

.maven-product-page .related.products .maven-prod-card {
	display: block;
	border-radius: 20px;
	overflow: hidden;
	text-decoration: none !important;
	background: var(--color-bg-alt);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.maven-product-page .related.products .maven-prod-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 40px rgba(26, 26, 26, 0.12);
}

.maven-product-page .related.products .maven-prod-card__img {
	position: relative;
	width: 100%;
	padding-bottom: 100%;
	background-color: var(--color-bg-alt);
	overflow: hidden;
}

.maven-product-page .related.products .maven-prod-card__img img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}

.maven-product-page .related.products .maven-prod-card__content {
	padding: 18px;
}

.maven-product-page .related.products .maven-prod-card__title {
	font-size: 1rem;
	font-weight: 500;
	margin: 0 0 0.35rem;
	color: var(--color-primary);
	line-height: 1.3;
}

.maven-product-page .related.products .maven-prod-card__price {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-accent);
}

.maven-product-page .related.products .maven-prod-card__price del {
	color: var(--color-text-muted);
	font-weight: 400;
}

/* Upsells - same treatment */
.maven-product-page .upsells.products {
	max-width: 1400px;
	margin: 2rem auto 0;
	padding: 0 5%;
}

.maven-product-page .upsells.products h2 {
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 2.5vw, 1.75rem);
	font-weight: 500;
	color: var(--color-primary);
	margin: 0 0 1.5rem;
}

.maven-product-page .upsells.products ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 24px;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.maven-product-page .upsells.products ul.products::before,
.maven-product-page .upsells.products ul.products::after {
	display: none !important;
}

.maven-product-page .upsells.products li.product {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}

.maven-product-page .upsells.products .maven-prod-card {
	display: block;
	border-radius: 20px;
	overflow: hidden;
	text-decoration: none !important;
	background: var(--color-bg-alt);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.maven-product-page .upsells.products .maven-prod-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 40px rgba(26, 26, 26, 0.12);
}

.maven-product-page .upsells.products .maven-prod-card__img {
	position: relative;
	width: 100%;
	padding-bottom: 100%;
	background-color: var(--color-bg-alt);
	overflow: hidden;
}

.maven-product-page .upsells.products .maven-prod-card__img img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}

.maven-product-page .upsells.products .maven-prod-card__content {
	padding: 18px;
}

.maven-product-page .upsells.products .maven-prod-card__title {
	font-size: 1rem;
	font-weight: 500;
	margin: 0 0 0.35rem;
	color: var(--color-primary);
	line-height: 1.3;
}

.maven-product-page .upsells.products .maven-prod-card__price {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-accent);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1024px) {
	.maven-product-page #primary,
	.maven-product-page main {
		padding-left: 1.5rem !important;
		padding-right: 1.5rem !important;
	}

	.maven-single-product {
		padding-left: 0;
		padding-right: 0;
	}

	.maven-single-product__inner {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.maven-single-product .woocommerce-product-gallery {
		order: 1;
	}

	.maven-single-product__summary {
		order: 2;
	}

	.maven-product-page .related.products,
	.maven-product-page .upsells.products {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.maven-product-page .related.products ul.products,
	.maven-product-page .upsells.products ul.products {
		grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
		gap: 20px;
	}
}

/* Tablet: force full width + break out page container + header/footer */
@media (min-width: 769px) and (max-width: 1024px) {
	body.maven-product-page {
		overflow-x: hidden;
	}

	body.maven-product-page,
	.maven-product-page #page-container {
		width: 100% !important;
		max-width: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.maven-product-page #page-container,
	.maven-product-page .maven-notification-bar,
	.maven-product-page .maven-header-main,
	.maven-product-page .maven-footer {
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw);
		box-sizing: border-box;
	}

	html {
		overflow-x: hidden;
	}

	.maven-single-product .woocommerce-product-gallery,
	.maven-single-product .woocommerce-product-gallery.images {
		width: 90% !important;
	}
}

/* Mobile: force full width + break out page container + header/footer */
@media (max-width: 768px) {
	body.maven-product-page {
		overflow-x: hidden;
	}

	body.maven-product-page,
	.maven-product-page #page-container {
		width: 100% !important;
		max-width: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.maven-product-page #page-container,
	.maven-product-page .maven-notification-bar,
	.maven-product-page .maven-header-main,
	.maven-product-page .maven-footer {
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw);
		box-sizing: border-box;
	}

	html {
		overflow-x: hidden;
	}

	.maven-single-product .woocommerce-product-gallery,
	.maven-single-product .woocommerce-product-gallery.images {
		width: 90% !important;
	}
}

@media (max-width: 480px) {
	.maven-product-page #primary,
	.maven-product-page main {
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}

	.maven-single-product {
		padding-left: 0;
		padding-right: 0;
	}

	.maven-product-page .related.products,
	.maven-product-page .upsells.products {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}

	.maven-product-page .related.products ul.products,
	.maven-product-page .upsells.products ul.products {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.maven-product-page .related.products .maven-prod-card__content,
	.maven-product-page .upsells.products .maven-prod-card__content {
		padding: 12px;
	}

	.maven-product-page .related.products .maven-prod-card__title,
	.maven-product-page .upsells.products .maven-prod-card__title {
		font-size: 0.9rem;
	}

	.maven-product-page .related.products .maven-prod-card__price,
	.maven-product-page .upsells.products .maven-prod-card__price {
		font-size: 0.85rem;
	}
}
