/* =============================================================
   3dartelier — WooCommerce stylesheet
   Verfijnt de WooCommerce default-output naar een minimal look.
   ============================================================= */

.woocommerce-wrap { padding-block: var(--space-7); }

/* ---------- Shop hero --------------------------------------- */
.shop-hero { padding-top: var(--space-7); padding-bottom: var(--space-6); }

/* ---------- Categoriefilter -------------------------------- */
.shop-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-3);
	padding: var(--space-5) var(--space-6);
	border-bottom: 1px solid var(--color-border);
	margin-bottom: var(--space-6);
}
.shop-filter__item {
	font-size: var(--fs-xs);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	color: var(--color-text-light);
	text-decoration: none;
	padding: var(--space-2) var(--space-4);
	border: 1px solid var(--color-border);
	border-radius: 2px;
	transition: all .2s;
}
.shop-filter__item:hover,
.shop-filter__item.is-active {
	background: var(--color-primary);
	color: var(--color-bg);
	border-color: var(--color-primary);
}
.woocommerce-breadcrumb {
	font-size: var(--fs-xs);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: var(--space-3);
}
.woocommerce-breadcrumb a { color: inherit; }
.woocommerce-breadcrumb a:hover { color: var(--color-primary); }

.term-description, .archive-description {
	max-width: 70ch;
	margin-inline: auto;
	color: var(--color-text-light);
	text-align: center;
	font-size: var(--fs-md);
}

/* ---------- Shop toolbar ----------------------------------- */
.shop-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-3);
	margin-bottom: var(--space-7);
	padding-block: var(--space-3);
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
	font-size: var(--fs-sm);
}
.woocommerce-result-count { margin: 0; color: var(--color-text-light); }
.woocommerce-ordering select {
	padding: var(--space-2) var(--space-4);
	background: transparent;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--fs-sm);
}

/* ---------- Product loop ----------------------------------- */
.products {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-5) var(--space-4);
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}
@media (min-width: 768px) {
	.products { grid-template-columns: repeat(3, 1fr); gap: var(--space-7) var(--space-5); }
}
@media (min-width: 1200px) {
	.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
}

.products::before, .products::after { display: none !important; }

.product-card {
	width: auto !important; float: none !important; margin: 0 !important;
	clear: none !important; padding: 0 !important;
}
.product-card__link { display: block; }
.product-card__media {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--color-secondary);
	margin-bottom: var(--space-3);
}
.product-card__media img {
	width: 100% !important; height: 100% !important;
	object-fit: cover;
	transition: transform var(--dur-slow) var(--ease);
}
.product-card__placeholder { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--color-secondary), var(--color-border)); }
.product-card__link:hover .product-card__media img { transform: scale(1.04); }

.product-card__badge {
	position: absolute; top: var(--space-3); left: var(--space-3);
	background: var(--color-primary); color: var(--color-bg);
	font-size: var(--fs-xs);
	letter-spacing: var(--tracking-wide); text-transform: uppercase;
	padding: 4px 10px; border-radius: var(--radius-sm);
}
.product-card__title {
	font-family: var(--font-body);
	font-size: var(--fs-base);
	font-weight: var(--fw-medium);
	margin: 0 0 var(--space-1);
	color: var(--color-primary);
}
.product-card__price {
	font-size: var(--fs-sm);
	color: var(--color-text-light);
	margin: 0;
}
.product-card__price del { color: var(--color-text-muted); margin-right: var(--space-2); }
.product-card__price ins { background: none; color: var(--color-primary); font-weight: var(--fw-medium); text-decoration: none; }

/* Verberg WooCommerce default loop add-to-cart */
.products .button.add_to_cart_button { display: none; }
.products .star-rating { display: none; }
.products .price { font-size: var(--fs-sm); color: var(--color-text-light); }

/* ---------- Single product --------------------------------- */
.product-single { padding-block: var(--space-7); }

.product-single__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-7);
}
@media (min-width: 900px) {
	.product-single__layout {
		grid-template-columns: 1.5fr 1fr;
		gap: var(--space-8);
		align-items: start;
	}
}

/* Override WooCommerce default float/width layout — wij gebruiken CSS grid */
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce div.product .summary {
	float: none !important;
	width: 100% !important;
	clear: none !important;
}

/* WooCommerce gallery — thumbnails links, hoofdfoto rechts */
.woocommerce-product-gallery {
	margin: 0 !important;
	opacity: 1 !important;
	display: flex !important;
	flex-direction: row !important;
	gap: var(--space-3) !important;
	align-items: flex-start;
}
.woocommerce-product-gallery__wrapper {
	margin: 0 !important;
	flex: 1 !important;
	min-width: 0;
}
.woocommerce-product-gallery__image {
	background: var(--color-secondary);
}
.woocommerce-product-gallery__image img {
	width: 100% !important;
	height: auto !important;
	display: block;
	object-fit: contain;
}

/* Thumbnails — verticale kolom links */
.flex-control-thumbs {
	order: -1;
	display: flex !important;
	flex-direction: column !important;
	gap: var(--space-2) !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 72px !important;
	flex-shrink: 0;
}
.flex-control-thumbs li {
	width: 72px !important;
	height: 72px !important;
	margin: 0 !important;
	overflow: hidden;
}
.flex-control-thumbs img {
	width: 72px !important;
	height: 72px !important;
	object-fit: cover !important;
	cursor: pointer;
	opacity: 0.6 !important;
	transition: opacity var(--dur-fast) var(--ease);
}
.flex-control-thumbs img.flex-active,
.flex-control-thumbs img:hover { opacity: 1 !important; }

.onsale {
	position: absolute;
	z-index: 2;
	top: var(--space-4); left: var(--space-4);
	background: var(--color-primary) !important;
	color: var(--color-bg) !important;
	border-radius: var(--radius-sm) !important;
	padding: 4px 10px !important;
	font-size: var(--fs-xs) !important;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	min-height: auto !important; min-width: auto !important;
	line-height: 1.4 !important;
	font-weight: var(--fw-medium) !important;
}

/* Summary column */
.product-single__summary { padding-block: var(--space-3); }
.product-single__summary .product_title {
	font-size: clamp(1.2rem, 2vw, 1.6rem);
	line-height: 1.25;
	margin: 0 0 var(--space-4);
}
.product-single__summary .price {
	font-size: var(--fs-xl);
	color: var(--color-primary);
	margin-bottom: var(--space-5);
	font-family: var(--font-display);
}
.product-single__summary .woocommerce-product-details__short-description {
	color: var(--color-text-light);
	font-size: var(--fs-base);
	margin-bottom: var(--space-6);
	padding-bottom: var(--space-6);
	border-bottom: 1px solid var(--color-border);
}

/* Variations form */
.variations { width: 100%; border: 0; margin-bottom: var(--space-5); }
.variations tr { display: block; margin-bottom: var(--space-4); }
.variations td, .variations th { display: block; padding: 0 !important; border: 0 !important; }
.variations .label label {
	display: block;
	font-size: var(--fs-xs);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	color: var(--color-text-light);
	margin-bottom: var(--space-3);
	font-weight: var(--fw-medium);
}
.variations select {
	width: 100%;
	padding: var(--space-3) var(--space-4);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}
.reset_variations {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	display: inline-block; margin-top: var(--space-2);
}

.single_variation_wrap .woocommerce-variation-price { margin-bottom: var(--space-4); }

/* Quantity + Add to cart */
.cart {
	display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: stretch;
	margin-bottom: var(--space-6);
}
.quantity {
	display: inline-flex; align-items: center;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}
.quantity .qty {
	width: 64px; padding: var(--space-3); border: 0;
	background: transparent; text-align: center;
}
.single_add_to_cart_button {
	flex: 1;
	background: var(--color-primary) !important;
	color: var(--color-bg) !important;
	border: 0 !important;
	border-radius: var(--radius-sm) !important;
	padding: var(--space-4) var(--space-6) !important;
	font-size: var(--fs-sm) !important;
	font-weight: var(--fw-medium) !important;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--dur-base) var(--ease);
}
.single_add_to_cart_button:hover { background: var(--color-accent) !important; }

/* Product meta */
.product_meta {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	display: flex; flex-direction: column; gap: var(--space-1);
}
.product_meta > span { display: block; }
.product_meta a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* Verberg artikelnummer en tags — niet nodig in de display */
.product_meta .sku_wrapper,
.product_meta .tagged_as { display: none !important; }

/* ---------- Tabs -------------------------------------------- */
.product-single__details { margin-top: var(--space-8); }
.woocommerce-tabs { padding: 0 !important; margin: 0 !important; }
.wc-tabs {
	display: flex !important;
	border-bottom: 1px solid var(--color-border) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
	gap: var(--space-6);
	overflow-x: auto;
}
.wc-tabs::before, .wc-tabs::after { display: none !important; }
.wc-tabs li {
	background: none !important;
	border: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
}
.wc-tabs li a {
	display: inline-block;
	padding: var(--space-4) 0 !important;
	font-size: var(--fs-sm) !important;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	color: var(--color-text-light) !important;
	font-weight: var(--fw-medium);
	border-bottom: 1px solid transparent !important;
	margin-bottom: -1px;
	transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.wc-tabs li.active a {
	color: var(--color-primary) !important;
	border-bottom-color: var(--color-primary) !important;
}
.woocommerce-Tabs-panel {
	padding: var(--space-7) 0 !important;
	max-width: 70ch;
}
.woocommerce-Tabs-panel h2 { font-size: var(--fs-lg); margin-bottom: var(--space-4); }
.woocommerce-Tabs-panel--description, .woocommerce-Tabs-panel--additional_information { color: var(--color-text-light); }

.shop_attributes { width: 100%; border: 0; }
.shop_attributes th, .shop_attributes td {
	padding: var(--space-3) 0;
	border-bottom: 1px solid var(--color-border);
	font-size: var(--fs-sm);
	text-align: left;
	font-weight: var(--fw-regular);
}
.shop_attributes th { color: var(--color-text-light); width: 30%; }

/* Reviews */
#reviews .commentlist { padding: 0; list-style: none; }
#reviews .comment_container {
	display: flex; gap: var(--space-4);
	padding: var(--space-5) 0;
	border-bottom: 1px solid var(--color-border);
}
#reviews .avatar { border-radius: 50%; width: 48px; height: 48px; }
#reviews .meta { color: var(--color-text-muted); font-size: var(--fs-xs); margin-bottom: var(--space-2); }
#review_form input, #review_form textarea {
	width: 100%; padding: var(--space-3) var(--space-4);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}

/* Star rating */
.star-rating, .stars {
	font-size: var(--fs-sm);
	color: var(--color-accent);
}

/* ---------- Related / upsells ------------------------------ */
.related, .upsells {
	margin-top: var(--space-9) !important;
	padding-top: var(--space-7);
	border-top: 1px solid var(--color-border);
}
.related > h2, .upsells > h2 {
	font-size: var(--fs-xl);
	margin-bottom: var(--space-6);
	text-align: center;
}

/* ---------- Cart -------------------------------------------- */
.woocommerce-cart .woocommerce {
	max-width: 1100px; margin-inline: auto;
}
.shop_table {
	width: 100%; border-collapse: collapse;
	margin-bottom: var(--space-6);
}
.shop_table th, .shop_table td {
	padding: var(--space-4) var(--space-3);
	border-bottom: 1px solid var(--color-border);
	text-align: left;
	font-size: var(--fs-sm);
}
.shop_table th {
	font-size: var(--fs-xs);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	font-weight: var(--fw-medium);
	color: var(--color-text-light);
}
.cart_item .product-thumbnail img { width: 80px; }

.cart_totals h2 { font-size: var(--fs-lg); }
.wc-proceed-to-checkout .checkout-button {
	display: block !important;
	width: 100% !important;
	background: var(--color-primary) !important;
	color: var(--color-bg) !important;
	border: 0 !important;
	padding: var(--space-4) !important;
	border-radius: var(--radius-sm) !important;
	font-size: var(--fs-sm) !important;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	font-weight: var(--fw-medium);
}

/* Coupon / update buttons */
.woocommerce button.button, .woocommerce a.button {
	background: transparent !important;
	color: var(--color-primary) !important;
	border: 1px solid var(--color-primary) !important;
	border-radius: var(--radius-sm) !important;
	padding: var(--space-3) var(--space-5) !important;
	font-size: var(--fs-sm) !important;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	font-weight: var(--fw-medium);
	transition: background var(--dur-base) var(--ease), color var(--dur-base) var(--ease);
}
.woocommerce button.button:hover, .woocommerce a.button:hover {
	background: var(--color-primary) !important;
	color: var(--color-bg) !important;
}

/* ---------- Checkout ---------------------------------------- */
.woocommerce-checkout #customer_details {
	display: grid; gap: var(--space-7);
}
@media (min-width: 900px) {
	.woocommerce-checkout #customer_details { grid-template-columns: 1fr 1fr; }
}
.woocommerce-checkout .form-row {
	display: flex; flex-direction: column; gap: var(--space-2);
	margin-bottom: var(--space-4);
}
.woocommerce-checkout label {
	font-size: var(--fs-xs);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	color: var(--color-text-light);
}
.woocommerce-checkout input,
.woocommerce-checkout textarea,
.woocommerce-checkout select {
	width: 100%;
	padding: var(--space-3) var(--space-4);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3 { font-size: var(--fs-lg); margin-top: var(--space-7); }

/* ---------- My account -------------------------------------- */
.woocommerce-account .woocommerce {
	display: grid; gap: var(--space-7);
	max-width: 1100px; margin-inline: auto;
}
@media (min-width: 768px) {
	.woocommerce-account .woocommerce { grid-template-columns: 220px 1fr; }
}
.woocommerce-MyAccount-navigation ul {
	display: flex; flex-direction: column; gap: var(--space-2);
}
.woocommerce-MyAccount-navigation a {
	display: block; padding: var(--space-2) 0;
	font-size: var(--fs-sm); color: var(--color-text-light);
}
.woocommerce-MyAccount-navigation .is-active a { color: var(--color-primary); font-weight: var(--fw-medium); }

/* ---------- Notices ----------------------------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	background: var(--color-surface) !important;
	border-left: 3px solid var(--color-primary) !important;
	padding: var(--space-4) var(--space-5) !important;
	margin-bottom: var(--space-5) !important;
	font-size: var(--fs-sm);
	border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.woocommerce-error { border-left-color: #b00020 !important; }

/* Forms */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
	padding: var(--space-3) var(--space-4) !important;
	border: 1px solid var(--color-border) !important;
	background: var(--color-surface) !important;
	border-radius: var(--radius-sm) !important;
}
