/*
 * MannyLinx — WooCommerce Overrides
 * Ensures the shop inherits the gallery aesthetic
 */

/* ─── General ───────────────────────────────────────────────────────────────── */

.woocommerce-page .woocommerce,
.woocommerce-page .woocommerce-page {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 clamp(1.25rem, 4vw, 3rem);
}

/* Remove default WC notices margin */
.woocommerce-notices-wrapper {
	margin-bottom: 2rem;
}

/* ─── Shop page layout ───────────────────────────────────────────────────────── */

/* Safety net: hide sort bar + result count even if hooks don't fire */
.woocommerce-result-count,
.woocommerce-ordering {
	display: none !important;
}

/* Shop page header */
.woo-shop__header {
	border-bottom: 1px solid var(--wp--preset--color--light-gray);
}

.woo-shop__header h1 {
	margin-top: 0.5rem;
}

/* Full-bleed product grid (edge-to-edge with 1px gap lines) */
.woo-shop .woocommerce,
.woo-shop .woocommerce-page {
	max-width: 100%;
	padding: 0;
}

/* ─── Breadcrumb ─────────────────────────────────────────────────────────────── */

.woocommerce-breadcrumb {
	font-size: 0.6875rem !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--soft-gray) !important;
	padding: 1.5rem var(--wp--preset--spacing--60) !important;
	margin: 0 !important;
	max-width: var(--wp--style--global--content-size);
}

.woocommerce-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
	color: var(--wp--preset--color--near-black);
}

.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
	border-top: 3px solid #1a1816 !important;
	border-radius: 0 !important;
	font-size: 0.875rem;
}

/* ─── Product Loop — Classic WooCommerce ─────────────────────────────────────
 *
 * Structure after our hook changes:
 *   <li.product>
 *     <a.woocommerce-LoopProduct-link>  ← image only, no title inside
 *       <img>
 *     </a>
 *     <div.mannylinx-card-info>         ← our custom output at priority 6
 *       <h3.mannylinx-card-title>
 *       <div.mannylinx-card-price>
 *     </div>
 *   </li>
 */

.woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px !important;
	margin: 0 !important;
	background: #e8e5e0;
}

@media (max-width: 900px) {
	.woocommerce ul.products { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
	.woocommerce ul.products { grid-template-columns: 1fr; }
}

.woocommerce ul.products li.product {
	background: #ffffff;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	width: auto !important;
	position: relative;
	display: flex;
	flex-direction: column;
}

/* The single product link — wraps only the image */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: block;
	overflow: hidden;
	text-decoration: none;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link img {
	margin: 0 !important;
	width: 100%;
	height: auto;
	aspect-ratio: 4/5;
	object-fit: cover;
	display: block;
	transition: transform 0.6s ease;
}

.woocommerce ul.products li.product:hover a.woocommerce-LoopProduct-link img {
	transform: scale(1.04);
}

/* Our custom card info: title + price below the image */
.woocommerce ul.products li.product .mannylinx-card-info {
	padding: 1.25rem 1.5rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
}

.woocommerce ul.products li.product .mannylinx-card-title {
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.9375rem;
	font-weight: 400;
	letter-spacing: -0.01em;
	line-height: 1.3;
	color: #1a1816;
	margin: 0;
}

.woocommerce ul.products li.product .mannylinx-card-price {
	font-size: 0.875rem;
	color: #8a8680;
}

.woocommerce ul.products li.product .mannylinx-card-price del {
	opacity: 0.5;
}

/* Hide the old default WC title and price (safety net in case they leak through) */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product > .price {
	display: none !important;
}

/* Hide add to cart on loop */
.woocommerce ul.products li.product .add_to_cart_button {
	display: none;
}

/* ─── Product Loop — Block Template (wp:woocommerce/product-collection) ───────
 *
 * Structure:
 *   <div.woo-card>
 *     <div.woo-card__image>
 *       <a href="url"><img></a>   ← the only link (isLink:false on title)
 *     </div>
 *     <div.woo-card__info>
 *       <h3.woo-card__title>      ← plain text, not a link
 *       <p.price>
 *     </div>
 *   </div>
 *
 * Stretched-link: the image <a> gets a ::after overlay covering the full card,
 * making the entire card clickable via one single focusable element.
 */

.woo-card {
	position: relative;
	overflow: hidden;
	background: #ffffff;
	display: flex;
	flex-direction: column;
}

/* Stretch the image link to cover the whole card */
.woo-card .wp-block-woocommerce-product-image a,
.woo-card .wc-block-woocommerce-product-image a {
	display: block;
}

.woo-card .wp-block-woocommerce-product-image a::after,
.woo-card .wc-block-woocommerce-product-image a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Info sits above the stretched link overlay */
.woo-card__info {
	position: relative;
	z-index: 2;
	padding: 1.25rem 1.5rem 1.5rem;
	pointer-events: none; /* clicks fall through to the stretched link */
}

.woo-card .wp-block-woocommerce-product-image img {
	margin: 0 !important;
	width: 100%;
	height: auto;
	aspect-ratio: 4/5;
	object-fit: cover;
	display: block;
	transition: transform 0.6s ease;
}

.woo-card:hover .wp-block-woocommerce-product-image img {
	transform: scale(1.04);
}

.woo-card__title {
	font-family: "Space Grotesk", sans-serif !important;
	font-size: 0.9375rem !important;
	font-weight: 400 !important;
	letter-spacing: -0.01em !important;
	color: #1a1816;
	margin: 0 0 0.375rem !important;
	line-height: 1.3;
}

.woo-card__price .woocommerce-Price-amount,
.woo-card__price .price {
	font-size: 0.875rem !important;
	color: #8a8680 !important;
}

/* Block product collection grid layout */
.woo-product-collection .wc-block-product-template {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: #e8e5e0;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 900px) {
	.woo-product-collection .wc-block-product-template { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
	.woo-product-collection .wc-block-product-template { grid-template-columns: 1fr; }
}

/* ─── Single Product (Block Template) ──────────────────────────────────────── */

/* Two-column grid: gallery left, details right */
.woo-product__grid {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	min-height: 70vh;
}

@media (max-width: 900px) {
	.woo-product__grid {
		grid-template-columns: 1fr;
	}
}

/* Gallery column: edge-to-edge, no padding */
.woo-product__gallery-col {
	border-right: 1px solid #e8e5e0;
}

.woo-product__gallery-col .woo-product__gallery {
	position: sticky;
	top: 68px;
}

.woo-product__gallery-col figure img,
.woo-product__gallery figure img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0 !important;
}

/* Thumbnail strip */
.woo-product__gallery .woocommerce-product-gallery__trigger {
	display: none;
}

/* Details column */
.woo-product__details-col {
	overflow-y: auto;
}

/* Price */
.woo-product__price .woocommerce-Price-amount,
.woo-product__price .price {
	font-family: "Space Grotesk", sans-serif !important;
	font-size: 1.25rem !important;
	font-weight: 300 !important;
	color: #1a1816 !important;
}

/* Add to cart form */
.woo-product__atc form.cart {
	display: flex !important;
	gap: 0 !important;
}

.woo-product__atc form.cart .qty {
	width: 72px;
	border: 1px solid #e8e5e0;
	border-right: none;
	border-radius: 0;
	padding: 0.875rem 1rem;
	font-size: 0.875rem;
	text-align: center;
	background: transparent;
	font-family: "Inter", sans-serif;
}

/* Button styles moved to the Single Product section below */

/* Product tabs (block: wp:woocommerce/product-details) */
.woo-product__tabs {
	max-width: 760px !important;
}

/* Tabs — classic WC output inside the block */
.woocommerce-tabs .tabs,
.wc-tabs {
	border-bottom: 1px solid #e8e5e0 !important;
	padding: 0 !important;
	margin: 0 0 2.5rem !important;
	list-style: none;
	display: flex;
	gap: 0;
}

.woocommerce-tabs .tabs li,
.wc-tabs li {
	border: none !important;
	background: none !important;
	border-radius: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.woocommerce-tabs .tabs li a,
.wc-tabs li a {
	font-size: 0.6875rem !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	font-family: "Inter", sans-serif !important;
	color: #8a8680 !important;
	padding: 0.875rem 1.5rem 0.875rem 0 !important;
	text-decoration: none !important;
	display: block;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: color 0.15s ease;
}

.woocommerce-tabs .tabs li.active a,
.woocommerce-tabs .tabs li a:hover,
.wc-tabs li.active a,
.wc-tabs li a:hover {
	color: #1a1816 !important;
	border-bottom-color: #1a1816 !important;
}

.woocommerce-Tabs-panel {
	padding: 0 !important;
}

.woocommerce-Tabs-panel h2 {
	display: none !important;
}

/* ─── Single Product ────────────────────────────────────────────────────────── */
/*
 * .woocommerce wrapper is removed in inc/woocommerce.php, so we target
 * via .single-product body class (added by WC) and .woo-product (our FSE main).
 */

/* Two-column grid: gallery sticky left, details scrollable right */
.single-product div.product,
.woo-product div.product {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	align-items: start;
}

@media (max-width: 900px) {
	.single-product div.product,
	.woo-product div.product {
		grid-template-columns: 1fr;
	}
}

/* Gallery column */
.single-product .woocommerce-product-gallery,
.woo-product .woocommerce-product-gallery {
	position: sticky;
	top: 68px;
	border-right: 1px solid #e8e5e0;
	float: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.single-product .woocommerce-product-gallery__image img,
.woo-product .woocommerce-product-gallery__image img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0;
}

/* Hide the zoom trigger icon */
.woocommerce-product-gallery__trigger {
	display: none !important;
}

/* Thumbnail strip */
.flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	padding: 1rem;
	list-style: none;
	margin: 0;
}

.flex-control-thumbs li { width: 60px; }

.flex-control-thumbs img {
	cursor: pointer;
	opacity: 0.5;
	transition: opacity 0.15s ease;
	width: 100%;
	display: block;
}

.flex-control-thumbs img:hover,
.flex-control-thumbs .flex-active { opacity: 1; }

/* Summary / details column */
.single-product .summary,
.woo-product .summary {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	clear: none !important;
	padding: 3rem var(--ml-gutter);
}

@media (max-width: 900px) {
	.single-product .summary,
	.woo-product .summary { padding: 2rem var(--ml-gutter); }
}

/* Tabs, related products, upsells: span both columns */
.single-product .woocommerce-tabs,
.woo-product .woocommerce-tabs,
.single-product section.related,
.woo-product section.related,
.single-product section.upsells,
.woo-product section.upsells {
	grid-column: 1 / -1;
}

/* Related products section */
.single-product section.related,
.woo-product section.related {
	border-top: 1px solid #e8e5e0;
	padding: 3rem var(--ml-gutter);
}

.single-product section.related > h2,
.woo-product section.related > h2 {
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.6875rem;
	letter-spacing: 0.12em;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 2rem;
}

/* Product title */
h1.product_title.entry-title {
	font-family: "Space Grotesk", sans-serif;
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	font-weight: 300;
	letter-spacing: -0.025em;
	line-height: 1.1;
	margin-bottom: 1rem;
}

/* Price */
.single-product .summary .price,
.woo-product .summary .price {
	font-family: "Space Grotesk", sans-serif;
	font-size: 1.25rem;
	font-weight: 300;
	color: #1a1816;
	margin-bottom: 1.5rem;
	display: block;
}

/* Short description */
.woocommerce-product-details__short-description {
	font-size: 0.9375rem;
	line-height: 1.75;
	color: #4a4744;
	margin-bottom: 2rem;
}

/* Quantity + Add to cart */
.single-product form.cart,
.woo-product form.cart {
	display: flex;
	gap: 0;
	margin-bottom: 2rem;
}

.single-product form.cart .qty,
.woo-product form.cart .qty {
	width: 80px;
	border: 1px solid #e8e5e0;
	border-right: none;
	border-radius: 0;
	padding: 0.875rem 1rem;
	font-size: 0.875rem;
	text-align: center;
	background: transparent;
	font-family: "Inter", sans-serif;
	color: #1a1816;
}

/* All WooCommerce buttons — no .woocommerce wrapper needed */
a.button,
button.button,
input.button,
.single_add_to_cart_button,
#respond input#submit {
	background: #1a1816 !important;
	color: #ffffff !important;
	border: 1px solid #1a1816 !important;
	border-radius: 0 !important;
	padding: 0.875rem 2rem !important;
	font-size: 0.6875rem !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	font-family: "Inter", sans-serif !important;
	font-weight: 500 !important;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

a.button:hover,
button.button:hover,
input.button:hover,
.single_add_to_cart_button:hover,
#respond input#submit:hover {
	background: #4a4744 !important;
	border-color: #4a4744 !important;
	color: #ffffff !important;
}

/* Product meta */
.single-product .product_meta,
.woo-product .product_meta {
	font-size: 0.75rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #8a8680;
	border-top: 1px solid #e8e5e0;
	padding-top: 1.5rem;
	margin-top: 1.5rem;
}

.single-product .product_meta span,
.woo-product .product_meta span { display: block; margin-bottom: 0.5rem; }

.single-product .product_meta a,
.woo-product .product_meta a { color: #1a1816; text-decoration: none; }

/* Sale badge — no .woocommerce parent needed */
span.onsale {
	background: #1a1816 !important;
	border-radius: 0 !important;
	font-size: 0.625rem;
	letter-spacing: 0.08em;
	font-family: "Inter", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	min-height: auto;
	line-height: 1;
	padding: 0.375rem 0.5rem;
	min-width: auto;
}

/* Hide breadcrumb on the main shop archive page */
.woocommerce-shop .woocommerce-breadcrumb { display: none; }

/* ─── Cart ──────────────────────────────────────────────────────────────────── */

.woocommerce-cart table.shop_table {
	border-radius: 0 !important;
	border: none !important;
}

.woocommerce-cart table.shop_table th {
	font-size: 0.6875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 500;
	color: #8a8680;
	border-bottom: 1px solid #e8e5e0 !important;
	padding: 0.75rem 0 !important;
}

.woocommerce-cart table.shop_table td {
	border-bottom: 1px solid #e8e5e0 !important;
	padding: 1.5rem 0 !important;
}

.woocommerce-cart table.shop_table .product-name a {
	font-family: "Space Grotesk", sans-serif;
	font-size: 1rem;
	color: #1a1816;
	text-decoration: none;
}

/* ─── Checkout ──────────────────────────────────────────────────────────────── */

.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3 {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 300;
	letter-spacing: -0.02em;
	margin-bottom: 1.5rem;
}

.woocommerce-checkout .woocommerce-input-wrapper input,
.woocommerce-checkout .woocommerce-input-wrapper select,
.woocommerce-checkout .woocommerce-input-wrapper textarea {
	border: none !important;
	border-bottom: 1px solid #e8e5e0 !important;
	border-radius: 0 !important;
	padding: 0.75rem 0 !important;
	background: transparent !important;
	font-size: 0.9375rem;
	width: 100%;
}

.woocommerce-checkout #place_order {
	background: #1a1816;
	color: #ffffff;
	border: none;
	border-radius: 0;
	padding: 1rem 2rem;
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-family: "Inter", sans-serif;
	font-weight: 500;
	cursor: pointer;
	width: 100%;
	transition: background 0.15s ease;
}

.woocommerce-checkout #place_order:hover {
	background: #4a4744;
}

/* ─── Account ───────────────────────────────────────────────────────────────── */

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid #e8e5e0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 0.875rem 0;
	font-size: 0.875rem;
	color: #8a8680;
	text-decoration: none;
	letter-spacing: 0.04em;
	transition: color 0.15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	color: #1a1816;
}

/* ─── Stars / Rating ────────────────────────────────────────────────────────── */

.woocommerce .star-rating {
	color: #1a1816;
}

/* Sale badge styling moved to Single Product section */
