/* Clubshop: wat theme.json niet kan voor de WooCommerce-blocks. Laadt alleen waar die blocks staan. */

/* Productfoto op een zachte kaart */
.jcw-product__galerij .wc-block-product-gallery-large-image {
	padding: 1.25rem;
	border-radius: 14px;
	background: var(--wp--custom--product--image-background);
}

/* Maatkeuze: label, chips */
.wp-block-woocommerce-add-to-cart-with-options-variation-selector-attribute-name {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--navy);
}

.wp-block-woocommerce-add-to-cart-with-options .wc-block-product-filter-chips__items {
	gap: 0.55rem;
}

.wp-block-woocommerce-add-to-cart-with-options .wc-block-product-filter-chips__item {
	justify-content: center;
	min-width: 3rem;
	height: 3rem;
	padding: 0 0.85rem;
	border: 1px solid var(--wp--custom--product--control-border);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--navy);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.wp-block-woocommerce-add-to-cart-with-options .wc-block-product-filter-chips__item:hover:not(:disabled) {
	border-color: var(--wp--preset--color--navy);
	transform: translateY(-1px);
}

.wp-block-woocommerce-add-to-cart-with-options .wc-block-product-filter-chips__item[aria-checked="true"] {
	border-color: var(--wp--preset--color--navy);
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
}

.wp-block-woocommerce-add-to-cart-with-options .wc-block-product-filter-chips__item:disabled {
	opacity: 0.35;
	cursor: not-allowed;
}

/* Aantal (stepper) en knop */
.wc-block-add-to-cart-with-options__quantity-selector .wc-block-components-quantity-selector {
	height: 3.1rem;
	border: 1px solid var(--wp--custom--product--control-border);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--white);
	overflow: hidden;
}

.wc-block-add-to-cart-with-options__quantity-selector .wc-block-components-quantity-selector::after {
	display: none;
}

.wc-block-add-to-cart-with-options__quantity-selector .wc-block-components-quantity-selector__button {
	width: 2.6rem;
	color: var(--wp--preset--color--navy);
	font-size: 1.2rem;
	font-weight: 600;
}

.wc-block-add-to-cart-with-options__quantity-selector .wc-block-components-quantity-selector__button:hover {
	background: var(--wp--preset--color--bg-soft);
	color: var(--wp--preset--color--primary);
}

.wc-block-add-to-cart-with-options__quantity-selector .wc-block-components-quantity-selector__input {
	width: 3rem;
	border-inline: 1px solid var(--wp--custom--product--control-border);
	color: var(--wp--preset--color--navy);
	font-weight: 600;
}

.jcw-product__info .wc-block-add-to-cart-with-options .wp-block-button.wc-block-components-product-button {
	flex: 1 1 10rem;
	align-items: stretch;
}

.jcw-product__info .wc-block-components-product-button .wp-block-button__link {
	flex: 1 1 auto;
	height: 100%;
	justify-content: center;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

/* Maattabel (core/details onder de maatkeuze) */
.jcw-maattabel {
	margin-block: -0.25rem 1rem;
	font-size: var(--wp--preset--font-size--small);
}

.jcw-maattabel > summary {
	display: inline-block;
	color: var(--wp--preset--color--text-muted);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	list-style: none;
	cursor: pointer;
}

.jcw-maattabel > summary::-webkit-details-marker {
	display: none;
}

.jcw-maattabel > summary:hover {
	color: var(--wp--preset--color--primary);
}

.jcw-maattabel[open] > summary {
	margin-bottom: 0.75rem;
}

.jcw-maattabel .wp-block-table table {
	border-collapse: collapse;
}

.jcw-maattabel .wp-block-table :is(th, td) {
	padding: 0.45rem 0.65rem;
	border: 1px solid var(--wp--preset--color--rand);
	text-align: left;
}

.jcw-maattabel .wp-block-table th {
	background: var(--wp--preset--color--bg-soft);
	color: var(--wp--preset--color--navy);
}

/* Afhaalinfo (pattern jcw/shop-afhaalinfo, blokstijl Melding) */
.jcw-afhaalinfo p {
	margin: 0;
}

.jcw-afhaalinfo__label {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
}

.jcw-afhaalinfo__adres {
	font-weight: 600;
}

/* Winkelwagen en afrekenen: afhaalinfo niet breder dan een leesbare regel */
.jcw-afrekenen__afhaalinfo > .jcw-afhaalinfo {
	max-width: 36rem;
}

/* Afrekenen: België is het enige land, dus geen landkeuze (adresvelden: inc/checkout-fields.php). */
.wc-block-checkout__billing-fields .wc-block-components-address-form__country {
	display: none;
}

/* Tabbladen (Product Details, stijl Minimal): horizontaal, rode lijn onder het actieve tabblad.
   WooCommerce stijlt dit met "html body …"-selectors (en onder 768 px verticaal); daarom hier één klasse meer. */
html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs {
	display: flex;
	gap: 0;
	margin: 0 0 1.5rem;
	padding: 0;
	border-bottom: 1px solid var(--wp--preset--color--rand);
}

html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li {
	display: block;
	margin: 0 0 -1px;
	padding: 0;
	border: 0;
	border-bottom: 2px solid transparent;
	background: none;
}

html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li.active,
html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li:hover {
	border-bottom-color: var(--wp--preset--color--primary);
}

html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li a {
	display: block;
	padding: 0.85rem 1.15rem;
	color: var(--wp--preset--color--text-muted);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
}

html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li.active a,
html body .jcw-product .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs li a:hover {
	color: var(--wp--preset--color--navy);
}

/* Winkel en categorie: kop, mededeling */
.jcw-shop__intro {
	max-width: 40rem;
}

.jcw-shop__mededeling {
	margin-bottom: 2rem;
	padding-block: 1.35rem;
	border-bottom: 1px solid var(--wp--preset--color--rand);
}

.jcw-shop__mededeling p {
	max-width: 42rem;
	margin: 0;
}

/* Productraster: 1 kolom op smalle schermen, 2 vanaf 720 px, 3 vanaf 1000 px (zoals de vroegere winkel). */
:is(.jcw-shop-raster, .jcw-andere-kledij) .wc-block-product-template.wc-block-product-template__responsive {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 720px) {
	:is(.jcw-shop-raster, .jcw-andere-kledij) .wc-block-product-template.wc-block-product-template__responsive {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1000px) {
	:is(.jcw-shop-raster, .jcw-andere-kledij) .wc-block-product-template.wc-block-product-template__responsive {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Productkaart (pattern jcw/shop-productkaart) */
.jcw-andere-kledij__titel {
	margin-bottom: 1.5rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid var(--wp--preset--color--rand);
}

.jcw-productkaart {
	height: 100%;
	padding-bottom: 1.85rem;
	border-bottom: 1px solid var(--wp--preset--color--rand);
}

.jcw-productkaart__beeld img {
	box-sizing: border-box;
	padding: 1.25rem;
	border-radius: 14px;
	background: var(--wp--custom--product--image-background);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.jcw-productkaart:hover .jcw-productkaart__beeld img {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(28, 36, 75, 0.08);
}

.jcw-productkaart__prijs {
	width: fit-content;
	padding-bottom: 0.55rem;
	border-bottom: 2px solid var(--wp--preset--color--primary);
	letter-spacing: 0.06em;
}

.jcw-productkaart__titel {
	margin: 0;
	line-height: 1.12;
}

.jcw-productkaart__titel a {
	color: var(--wp--preset--color--navy);
	text-decoration: none;
}

.jcw-productkaart:hover .jcw-productkaart__titel a {
	color: var(--wp--preset--color--primary);
}

.jcw-productkaart__knop {
	margin-top: auto;
}

.jcw-productkaart__knop .wp-block-button__link {
	padding: 0.35rem 0;
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--navy);
	font-family: var(--wp--preset--font-family--display);
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.jcw-productkaart__knop .wp-block-button__link::after {
	content: " →";
}

.wp-block-button.jcw-productkaart__knop > .wp-block-button__link:hover,
.jcw-productkaart__knop .wp-block-button__link:hover {
	background: transparent;
	color: var(--wp--preset--color--primary);
	box-shadow: none;
	transform: none;
}