/**
 * WooCommerce styling voor Domein Perdu theme.
 *
 * Standaard WooCommerce CSS kan uitgeschakeld worden in inc/woocommerce.php
 * (filter woocommerce_enqueue_styles). Pas hier de shop aan je Webflow-design aan.
 *
 * Nuttige selectors:
 * - .woocommerce ul.products        → productgrid
 * - .woocommerce .product            → enkel product in grid
 * - .woocommerce div.product         → productdetailpagina
 * - .woocommerce .button            → add-to-cart, checkout knoppen
 * - .woocommerce .price              → prijsweergave
 */

/* Wrapper rond WC-inhoud (zie inc/woocommerce.php) */
.woocommerce-main {
	width: 100%;
}

.woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images, .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
	width: 100%;
}
.product_title {
	font-family: var(--heading--xlarge-font-family);
}

/* Productgrid: pas kolommen aan naar je Webflow-layout */
.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce ul.products li.product {
	margin: 0;
}

/* Knoppen in lijn met theme-buttons — pas classes aan indien nodig */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	font-family: inherit;
}

/* Breadcrumb minder opvallend */
.woocommerce .woocommerce-breadcrumb {
	font-size: 0.875rem;
	margin-bottom: 1.5rem;
	opacity: 0.7;
}

/* Productdetail — layout uit woocommerce/content-single-product.php */
.single-product-detail__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: start;
	margin-bottom: 3rem;
}

.single-product-detail__below {
	width: 100%;
}

.single-product-detail .summary .product_title {
	font-family: inherit;
	text-transform: uppercase;
	margin-bottom: 1rem;
}

.single-product-detail .summary .price {
	margin-bottom: 1.5rem;
}

/*
 * Productgalerij — slideshow (featured + gallery)
 * Markup: template-parts/shop/product-gallery-slideshow.php
 */
.single-product-detail__gallery {
	position: relative;
}

.single-product-detail__gallery .onsale {
	position: absolute;
	z-index: 2;
	top: 1rem;
	left: 1rem;
}

.product-gallery-slideshow {
	width: 100%;
}

.product-gallery-slideshow__viewport {
	position: relative;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.03);
}

.product-gallery-slideshow__track {
	list-style: none;
	margin: 0;
	padding: 0;
}

.product-gallery-slideshow__slide {
	margin: 0;
	line-height: 0;
}

.product-gallery-slideshow__slide[hidden] {
	display: none !important;
}

.product-gallery-slideshow__image,
.product-gallery-slideshow__slide img {
	display: block;
	width: 100%;
	height: auto;
}

.product-gallery-slideshow__nav {
	appearance: none;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 2.5rem;
	height: 2.5rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.9);
	color: inherit;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

.product-gallery-slideshow__nav--prev {
	left: 0.75rem;
}

.product-gallery-slideshow__nav--next {
	right: 0.75rem;
}

.product-gallery-slideshow__nav:hover,
.product-gallery-slideshow__nav:focus {
	background: #fff;
	outline: none;
}

.product-gallery-slideshow__dots {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 1rem;
}

.product-gallery-slideshow__dot {
	appearance: none;
	width: 0.55rem;
	height: 0.55rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: currentColor;
	opacity: 0.25;
	cursor: pointer;
}

.product-gallery-slideshow__dot.is-active,
.product-gallery-slideshow__dot:hover,
.product-gallery-slideshow__dot:focus {
	opacity: 1;
	outline: none;
}

/* Optionele wrappers per veld (content-single-product.php) */
.single-product-detail__title,
.single-product-detail__rating,
.single-product-detail__price,
.single-product-detail__excerpt,
.single-product-detail__cart,
.single-product-detail__meta,
.single-product-detail__share {
	margin-bottom: 1.25rem;
}

.single-product-detail__below > * {
	margin-top: 2.5rem;
}

.single-product-detail__below > *:first-child {
	margin-top: 0;
}

/* Product tabs — beschrijving, specificaties, reviews */
.single-product-detail__tabs {
	width: 100%;
}

.single-product-detail__tabs .woocommerce-tabs {
	margin: 0;
}

.single-product-detail__tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	list-style: none;
	margin: 0 0 -1px;
	padding: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.single-product-detail__tabs ul.tabs::before,
.single-product-detail__tabs ul.tabs::after {
	display: none;
}

.single-product-detail__tabs ul.tabs li {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
}

.single-product-detail__tabs ul.tabs li a {
	display: block;
	padding: 0.75rem 1.25rem;
	font-family: var(--global--body-font-family, Inter, sans-serif);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	color: inherit;
	text-decoration: none;
	opacity: 0.55;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: opacity 0.2s, border-color 0.2s;
}

.single-product-detail__tabs ul.tabs li a:hover {
	opacity: 0.85;
}

.single-product-detail__tabs ul.tabs li.active a {
	opacity: 1;
	border-bottom-color: currentColor;
}

.single-product-detail__tabs .woocommerce-Tabs-panel {
	padding: 1.5rem 0 0;
}

.single-product-detail__tabs .woocommerce-Tabs-panel > h2:first-child {
	display: none;
}

.single-product-detail__tabs .woocommerce-Tabs-panel:not(.active) {
	display: none;
}

@media screen and (max-width: 767px) {
	.single-product-detail__tabs ul.tabs {
		flex-direction: column;
		border-bottom: none;
	}

	.single-product-detail__tabs ul.tabs li a {
		padding: 0.875rem 0;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	}

	.single-product-detail__tabs ul.tabs li.active a {
		border-bottom-color: currentColor;
	}
}

@media screen and (max-width: 991px) {
	.single-product-detail__grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
}

/* Winkelwagen-icoon in navigatie */
.navbar-menu-cart-link,
.navbar-menu-cart-link.w-inline-block {
	display: inline-flex !important;
	flex-direction: row;
	align-items: center;
	gap: 0.35rem;
}

.navbar-menu-cart-icon {
	display: flex;
	align-items: center;
	line-height: 0;
	flex-shrink: 0;
}

.navbar-menu-cart-icon svg {
	display: block;
}

.navbar-menu-cart-quantity-wrapper {
	display: inline-flex;
	align-items: center;
}

.navbar-menu-cart-link .navbar-menu-cart-quantity {
	font-family: var(--global--body-font-family, Inter, sans-serif);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1;
	color: inherit;
	min-width: auto;
	text-align: left;
	    background: var(--global-colors--text-muted-inverse);
    padding: 5px 5px;
}

.navbar-menu-cart-link--mobile {
	justify-content: flex-start;
	gap: 0.75rem;
}

.navbar-menu-cart-link--mobile .navbar-menu-cart-icon svg {
	width: 2rem;
	height: 2rem;
}

/* Productdetail — add-to-cart met block-stijl quantity selector */
.single-product-detail__cart form.cart,
.winkel-product-card__form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
}

.single-product-detail__cart .wc-block-components-quantity-selector,
.winkel-product-card .wc-block-components-quantity-selector,
.related-product-card .wc-block-components-quantity-selector {
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 4px;
	box-sizing: border-box;
	display: flex;
	position: relative;
	width: 107px;
	flex-shrink: 0;
}

.single-product-detail__cart .wc-block-components-quantity-selector__input,
.winkel-product-card .wc-block-components-quantity-selector__input,
.related-product-card .wc-block-components-quantity-selector__input {
	appearance: textfield;
	background: transparent;
	border: 0;
	box-shadow: none;
	color: currentColor;
	flex: 1 1 auto;
	font-family: var(--global--body-font-family, Inter, sans-serif);
	font-size: 0.875rem;
	line-height: 1;
	margin: 0;
	min-width: 40px;
	order: 2;
	padding: 0.4em 0;
	text-align: center;
	vertical-align: middle;
	width: auto;
}

.single-product-detail__cart .wc-block-components-quantity-selector__input:focus,
.winkel-product-card .wc-block-components-quantity-selector__input:focus,
.related-product-card .wc-block-components-quantity-selector__input:focus {
	box-shadow: inset 0 0 1px 1px currentColor;
	outline: none;
}

.single-product-detail__cart .wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.single-product-detail__cart .wc-block-components-quantity-selector__input::-webkit-inner-spin-button,
.winkel-product-card .wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.winkel-product-card .wc-block-components-quantity-selector__input::-webkit-inner-spin-button,
.related-product-card .wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.related-product-card .wc-block-components-quantity-selector__input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.single-product-detail__cart .wc-block-components-quantity-selector__button,
.winkel-product-card .wc-block-components-quantity-selector__button,
.related-product-card .wc-block-components-quantity-selector__button {
	background: none transparent;
	border: 0;
	box-shadow: none;
	color: currentColor;
	cursor: pointer;
	font-family: inherit;
	font-size: 0.9em;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	margin: 0;
	min-width: 30px;
	opacity: 0.6;
	padding: 0;
	text-align: center;
	text-decoration: none;
}

.single-product-detail__cart .wc-block-components-quantity-selector__button:hover,
.single-product-detail__cart .wc-block-components-quantity-selector__button:focus,
.winkel-product-card .wc-block-components-quantity-selector__button:hover,
.winkel-product-card .wc-block-components-quantity-selector__button:focus,
.related-product-card .wc-block-components-quantity-selector__button:hover,
.related-product-card .wc-block-components-quantity-selector__button:focus {
	opacity: 1;
}

.single-product-detail__cart .wc-block-components-quantity-selector__button:focus,
.winkel-product-card .wc-block-components-quantity-selector__button:focus,
.related-product-card .wc-block-components-quantity-selector__button:focus {
	box-shadow: inset 0 0 1px 1px currentColor;
	outline: none;
}

.single-product-detail__cart .wc-block-components-quantity-selector__button:disabled,
.winkel-product-card .wc-block-components-quantity-selector__button:disabled,
.related-product-card .wc-block-components-quantity-selector__button:disabled {
	box-shadow: none;
	cursor: default;
	opacity: 0.6;
}

.single-product-detail__cart .wc-block-components-quantity-selector__button--minus,
.winkel-product-card .wc-block-components-quantity-selector__button--minus,
.related-product-card .wc-block-components-quantity-selector__button--minus {
	border-radius: 4px 0 0 4px;
	order: 1;
}

.single-product-detail__cart .wc-block-components-quantity-selector__button--plus,
.winkel-product-card .wc-block-components-quantity-selector__button--plus,
.related-product-card .wc-block-components-quantity-selector__button--plus {
	border-radius: 0 4px 4px 0;
	order: 3;
}

/*
 * Winkelpagina — productlijst
 * - .winkel-product-grid = 1 product per rij
 * - .winkel-product-card = intern 3 kolommen: media | info | cart
 */
.winkel-product-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.winkel-product-card {
	display: grid;
    grid-template-columns: minmax(120px, 200px) 1fr auto;
    gap: 1.5rem 2rem;
    align-items: start;
    margin: 20px 0 0px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    padding: 0 0 50px 0;
}

.winkel-product-card__media {
	min-width: 0;
}

.winkel-product-card__info {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	min-width: 0;
}

.winkel-product-card__cart {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 0.75rem;
}

.winkel-product-card__form {
	flex-direction: column;
	align-items: stretch;
}

.winkel-product-card__title {
	margin: 0;
}

.winkel-product-card__title a {
	color: inherit;
	text-decoration: none;
}

.winkel-product-card__thumb {
	display: block;
	line-height: 0;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

.winkel-product-card__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.winkel-product-card.outofstock .winkel-product-card__thumb {
	opacity: 0.8;
}

.winkel-product-card__excerpt { 
	opacity: 0.85;
}

.winkel-product-card__price {
	margin-top: 15px;
	font-size: 26px;
}

.winkel-product-card__price del {
	opacity: 0.55;
	text-decoration: line-through;
}

.winkel-product-card__price ins {
	text-decoration: none;
}

.winkel-product-card__sold-out {
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background: #de3f3f;
    color: wheat;
    padding: 7px 15px;
}

@media screen and (max-width: 767px) {
	.winkel-product-card {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.winkel-product-card__cart {
		align-items: stretch;
	}
}

/*
 * Gerelateerde producten (single product) — 3 kolommen, verticale kaart
 */
.related-product-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.related-product-card {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin: 0;
}

.related-product-card__title {
	margin: 0;
}

.related-product-card__title a {
	color: inherit;
	text-decoration: none;
}

.related-product-card__thumb {
	display: block;
	line-height: 0;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

.related-product-card__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.related-product-card.outofstock .related-product-card__thumb {
	opacity: 0.8;
}

.related-product-card__price {
	margin: 0;
}

.related-product-card__price del {
	opacity: 0.55;
	text-decoration: line-through;
}

.related-product-card__price ins {
	text-decoration: none;
}

.related-product-card__form {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
}

.related-product-card__sold-out {
	letter-spacing: 0.05em;
	text-transform: uppercase;
	background: #de3f3f;
	color: wheat;
	padding: 7px 15px;
}

@media screen and (max-width: 767px) {
	.related-product-grid {
		grid-template-columns: 1fr;
	}
}

/*
 * Checkout — theme override (woocommerce/checkout/form-checkout.php)
 * 2 kolommen: klantgegevens | besteloverzicht
 */
.domeinperdu-checkout__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
	gap: 2.5rem 3rem;
	align-items: start;
}

.domeinperdu-checkout__details.col2-set {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	width: 100%;
}

.domeinperdu-checkout__details .col-1,
.domeinperdu-checkout__details .col-2 {
	float: none;
	width: 100%;
}

.domeinperdu-checkout__sidebar {
	position: sticky;
	top: 1.5rem;
	padding: 1.5rem;
	background: rgba(0, 0, 0, 0.03);
}

.domeinperdu-checkout__heading {
	margin: 0 0 1.25rem;
}

.woocommerce-checkout .form-row {
	margin-bottom: 1rem;
}

.woocommerce-checkout .form-row label {
	display: block;
	margin-bottom: 0.35rem;
}

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .select2-container .select2-selection--single {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.woocommerce-checkout #payment {
	background: transparent;
}

.woocommerce-checkout #payment div.payment_box {
	background: rgba(255, 255, 255, 0.7);
}

.woocommerce-checkout #place_order {
	width: 100%;
	margin-top: 1rem;
}

@media screen and (max-width: 991px) {
	.domeinperdu-checkout__grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.domeinperdu-checkout__sidebar {
		position: static;
	}
}