/* =========================================================================
   WooCommerce – standaard-opmaak in TapToReview-stijl (basis).
   De WooCommerce-standaard-CSS staat uit (zie functions.php); alles hier.
   Uitgewerkte opmaak voor winkelwagen, afrekenen, bedankt en Mijn kaarten
   volgt bij die sjablonen.
   ========================================================================= */

/* Knoppen */
.woocommerce .button, .woocommerce button.button, .woocommerce a.button, .woocommerce input.button,
.wc-block-components-button:not(.is-link) {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 16px 28px; border: 2px solid transparent; border-radius: var(--radius-pill);
	background: var(--forest); color: var(--white); font-size: var(--fs-button); font-weight: 700; line-height: 1.2;
	text-decoration: none; cursor: pointer; transition: background-color .15s;
}
.woocommerce .button:hover, .wc-block-components-button:not(.is-link):hover { background: var(--plum); color: var(--white); }
.woocommerce .button.alt, .woocommerce #place_order, .woocommerce .checkout-button,
.wc-block-components-checkout-place-order-button, .wc-block-cart__submit-button { background: var(--coral); }
.woocommerce .button.alt:hover, .woocommerce #place_order:hover, .woocommerce .checkout-button:hover,
.wc-block-components-checkout-place-order-button:hover, .wc-block-cart__submit-button:hover { background: var(--coral-hover); }

/* Velden */
.woocommerce form .form-row label, .wc-block-components-text-input label { font-size: var(--fs-small); font-weight: 600; }
.woocommerce form .input-text, .woocommerce form select, .woocommerce form textarea,
.woocommerce-page form .input-text, .select2-container .select2-selection--single {
	width: 100%; min-height: 52px; padding: 14px 16px; border: 1.5px solid var(--line-strong); border-radius: var(--radius-sm);
	background: var(--white); color: var(--forest); font-size: var(--fs-body);
}
.woocommerce form .input-text:focus, .woocommerce form select:focus { outline: 3px solid var(--forest); outline-offset: 2px; border-color: var(--forest); }
.woocommerce form .form-row { margin: 0 0 20px; }
.woocommerce form .form-row .required { color: var(--coral); text-decoration: none; }

/* Meldingen */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner {
	list-style: none; margin: 0 0 24px; padding: 16px 20px; border: 0; border-radius: 16px; background: var(--sand); color: var(--forest);
}
.woocommerce-message { background: #E3EFE7; }
.woocommerce-error { background: #F6E1DF; color: var(--error); }
/* WooCommerce zet de focus op meldingen voor schermlezers; geen focusrand nodig op een niet-klikbaar blok. */
.woocommerce-message:focus, .woocommerce-info:focus, .woocommerce-error:focus, .woocommerce-NoticeGroup:focus { outline: none; }
.woocommerce-message:has(.button), .woocommerce-info:has(.button) { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: 16px; }
.woocommerce-message .button, .woocommerce-info .button { flex: none; padding: 10px 18px; font-size: 1rem; }
/* Op de winkelwagen zelf is "Bekijk winkelwagen" overbodig. */
.woocommerce-cart .woocommerce-message .wc-forward { display: none; }
.woocommerce-cart .woocommerce-message:has(.wc-forward) { display: block; }

/* Tabellen (winkelwagen, bestellingen, overzicht) */
.woocommerce table.shop_table { width: 100%; border-collapse: collapse; background: var(--white); border-radius: var(--radius-lg); overflow: hidden; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: 16px 20px; border-bottom: 1px solid var(--line); text-align: left; }
.woocommerce table.shop_table th { font-weight: 600; }
.woocommerce .quantity .qty { width: 72px; min-height: 48px; text-align: center; border: 1.5px solid var(--line-strong); border-radius: var(--radius-pill); }

/* Prijzen */
.woocommerce .amount { font-weight: 600; }
.woocommerce .order-total .amount { font-size: 1.5rem; font-weight: 700; }

/* =========================================================================
   Checkout-header (logo · voortgang · veilig afrekenen)
   ========================================================================= */
.site-header--checkout .site-header__inner { justify-content: space-between; }
.progress { list-style: none; display: flex; align-items: center; gap: 12px; margin: 0; padding: 0; font-size: 1rem; }
.progress__step { display: flex; align-items: center; gap: 8px; color: var(--ink-muted); }
.progress__step + .progress__step::before { content: ""; width: 40px; height: 2px; margin-right: 4px; background: var(--line); }
.progress__step a { color: inherit; text-decoration: none; }
.progress__dot { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sand); font-size: 13px; font-weight: 700; color: var(--ink-muted); }
.progress__step.is-done { color: var(--forest); }
.progress__step.is-done .progress__dot { background: var(--success); color: var(--white); }
.progress__step.is-active { color: var(--forest); font-weight: 700; }
.progress__step.is-active .progress__dot { background: var(--forest); color: var(--white); }
.site-header__secure { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-small); font-weight: 600; }
@media (max-width: 820px) { .progress { display: none; } }

/* =========================================================================
   Winkelwagen (klassiek [woocommerce_cart])
   ========================================================================= */
.woocommerce-cart .shop-page > .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: var(--gutter); align-items: start; }
.woocommerce-cart .woocommerce-notices-wrapper, .woocommerce-cart .cart-empty, .woocommerce-cart .return-to-shop { grid-column: 1 / -1; }
.woocommerce-cart .woocommerce-cart-form { padding: 24px; border-radius: var(--radius-lg); background: var(--white); }
.woocommerce-cart table.shop_table { border-radius: 0; }
.woocommerce-cart table.shop_table thead { display: none; }
.woocommerce-cart td.product-thumbnail img { width: 72px; border-radius: 14px; }
.woocommerce-cart td.product-name a { font-weight: 600; text-decoration: none; }
.woocommerce-cart td.product-remove a { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--sand); color: var(--forest) !important; font-size: 20px; text-decoration: none; }
.woocommerce-cart td.actions { border-bottom: 0; }
.woocommerce-cart td.actions .coupon { display: inline-flex; gap: 8px; }
.woocommerce-cart td.actions .coupon .input-text { width: 180px; min-height: 48px; padding: 10px 14px; border: 1.5px solid var(--line-strong); border-radius: var(--radius-pill); }
.woocommerce-cart td.actions .button { padding: 12px 20px; font-size: 1rem; background: transparent; color: var(--forest); border-color: var(--line-strong); }
.woocommerce-cart td.actions .button:hover { border-color: var(--forest); background: transparent; color: var(--forest); }
.woocommerce-cart .cart_totals { padding: 36px; border-radius: var(--radius-lg); background: var(--white); }
.woocommerce-cart .cart_totals h2 { margin-bottom: 16px; font-size: var(--fs-h3); }
.woocommerce-cart .cart_totals table.shop_table { border-radius: 0; }
.woocommerce-cart .cart_totals table.shop_table th, .woocommerce-cart .cart_totals table.shop_table td { padding: 14px 0; vertical-align: top; }
.woocommerce-cart .cart_totals table.shop_table th { font-weight: 400; color: var(--ink-muted); }
.woocommerce-cart .cart_totals table.shop_table td { text-align: right; }
.woocommerce-cart .cart_totals .amount { font-weight: 400; }
.woocommerce-cart .cart_totals table.shop_table .order-total th { color: var(--forest); font-weight: 700; }
.woocommerce-cart .cart_totals table.shop_table .order-total > * { vertical-align: middle; }
.woocommerce-cart .cart_totals .order-total .amount { font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem); font-weight: 700; letter-spacing: -.03em; }
.woocommerce-cart .woocommerce-shipping-destination { display: none; }
.woocommerce-cart .wc-proceed-to-checkout .checkout-button { width: 100%; margin-top: 20px; padding-block: 20px; }
.cart-empty.woocommerce-info { padding: 32px; font-size: var(--fs-lead); }
@media (max-width: 1080px) { .woocommerce-cart .shop-page > .woocommerce { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 820px) {
	.woocommerce-cart table.shop_table tr.cart_item { display: grid; grid-template-columns: 72px 1fr auto; gap: 8px 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
	.woocommerce-cart table.shop_table td { padding: 0; border: 0; }
	.woocommerce-cart td.product-price { display: none; }
	.woocommerce-cart td.product-thumbnail { grid-row: span 2; }
	.woocommerce-cart td.actions .coupon { display: flex; margin-bottom: 12px; }
}

/* =========================================================================
   Afrekenen (klassiek [woocommerce_checkout]) – frame "Afrekenen – Desktop 1440"
   Links: info · 1 Contactgegevens · 2 Factuur- en verzendadres · 3 Betaalmethode · accountnotitie
   Rechts: Je bestelling + bestelknop (ttr_checkout_place_order)
   ========================================================================= */
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 760px) minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 24px; align-items: start; }
.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup { grid-column: 1 / -1; grid-row: 1; }
.ttr-checkout-main { grid-column: 1; grid-row: 2 / span 2; display: flex; flex-direction: column; gap: 16px; }
.woocommerce-checkout #order_review_heading { grid-column: 2; grid-row: 2; margin: 0; padding: 36px 36px 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; background: var(--white); font-size: var(--fs-h3); }
.woocommerce-checkout #order_review { grid-column: 2; grid-row: 3; padding: 20px 36px 36px; border-radius: 0 0 var(--radius-lg) var(--radius-lg); background: var(--white); }

.ttr-info { display: flex; align-items: center; gap: 20px; padding: 28px 32px; border-radius: var(--radius-lg); background: var(--forest); color: var(--white); }
.ttr-info .icon-circle { width: 48px; height: 48px; }
.icon-circle--light { background: var(--paper); color: var(--forest); }
.ttr-info p:not(.h4) { color: rgba(255,255,255,.85); }
.ttr-account-note { display: flex; align-items: center; gap: 14px; margin: 0; padding: 20px 32px; border-radius: var(--radius-md); background: var(--white); }
.ttr-account-note .icon { flex: none; }

/* Genummerde tegels */
.checkout-step, .woocommerce-checkout #customer_details .col-2 { padding: 36px 40px 16px; border-radius: var(--radius-lg); background: var(--white); }
.checkout-step__title { display: flex; align-items: center; gap: 14px; margin: 0 0 24px; font-size: var(--fs-h3); letter-spacing: -.015em; }
.checkout-step__num { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--forest); color: var(--white); font-size: 15px; font-weight: 700; letter-spacing: 0; }
.woocommerce-checkout #customer_details .col-1 { display: flex; flex-direction: column; }
.checkout-step--1 { margin-bottom: 16px; }
/* Tegel 2 loopt door in WooCommerce' verzend-/notitieblok (.col-2) */
.checkout-step--2 { padding-bottom: 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.woocommerce-checkout #customer_details .col-2 { display: flow-root; padding-top: 0; padding-bottom: 36px; border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
/* Raster van 4 kolommen: half = 2, kwart = 1 (Nr./Toev. van WC Postcode Checker), rest volle breedte. */
.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 16px; }
.woocommerce-billing-fields__field-wrapper .form-row, .woocommerce-shipping-fields__field-wrapper .form-row { grid-column: 1 / -1; }
/* Breedtes/floats van WC Postcode Checker (nl-checkout.css) uit: het raster bepaalt de breedte. */
.woocommerce form .woocommerce-billing-fields__field-wrapper .form-row, .woocommerce form .woocommerce-shipping-fields__field-wrapper .form-row { width: auto; float: none; margin-right: 0 !important; }
.woocommerce form #billing_postcode_field, .woocommerce form #shipping_postcode_field { width: auto; margin-right: 0; }
.woocommerce-billing-fields__field-wrapper .form-row-first, .woocommerce-shipping-fields__field-wrapper .form-row-first { grid-column: 1 / span 2; }
.woocommerce-billing-fields__field-wrapper .form-row-last, .woocommerce-shipping-fields__field-wrapper .form-row-last { grid-column: span 2; }
.woocommerce-billing-fields__field-wrapper .form-row-quart-first, .woocommerce-shipping-fields__field-wrapper .form-row-quart-first,
.woocommerce-billing-fields__field-wrapper .form-row-quart, .woocommerce-shipping-fields__field-wrapper .form-row-quart { grid-column: span 1; }
/* Met postcode + Nr. + Toev. op één rij krijgt Plaats de volle breedte. */
.form-row-quart ~ .form-row[id$="_city_field"] { grid-column: 1 / -1; }
.woocommerce form .form-row label { display: block; margin-bottom: 8px; }
.woocommerce-checkout #ship-to-different-address { margin: 0 0 16px; font-size: var(--fs-body); }
/* Foutmeldingen per veld */
.woocommerce form .woocommerce-invalid .input-text, .woocommerce form .woocommerce-invalid select { border-color: var(--error); }
.checkout-inline-error-message { margin: 6px 0 0; font-size: var(--fs-small); color: var(--error); }
#ship-to-different-address label { display: inline-flex; align-items: center; gap: 10px; margin: 0; font-size: var(--fs-body); font-weight: 400; cursor: pointer; }
#ship-to-different-address input { width: 22px; height: 22px; margin: 0; accent-color: var(--forest); }
.checkout-notes summary { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-small); font-weight: 600; cursor: pointer; list-style: none; }
.checkout-notes summary::-webkit-details-marker { display: none; }
.checkout-notes summary .icon { transition: transform .15s; }
.checkout-notes[open] summary { margin-bottom: 12px; }
.checkout-notes[open] summary .icon { transform: rotate(45deg); }
.checkout-notes .form-row { margin-bottom: 0; }

/* Betaalmethoden als keuzekaarten */
#payment ul.payment_methods { list-style: none; display: flex; flex-direction: column; gap: 16px; margin: 0 0 20px; padding: 0; }
#payment li.wc_payment_method { position: relative; padding: 20px 24px; border: 1.5px solid var(--line-strong); border-radius: 16px; background: var(--white); }
#payment li.wc_payment_method:has(input:checked) { border: 2px solid var(--forest); background: var(--paper); }
#payment li.wc_payment_method > input { width: 20px; height: 20px; margin: 0 10px 0 0; vertical-align: middle; accent-color: var(--forest); }
#payment li.wc_payment_method > label { font-weight: 600; cursor: pointer; }
#payment li.wc_payment_method > label img { display: inline-block; max-height: 24px; margin-left: 8px; vertical-align: middle; }
#payment .payment_box { margin: 8px 0 0 30px; font-size: var(--fs-small); color: var(--ink-muted); }
#payment .payment_box p { margin: 0; }

/* Je bestelling */
.woocommerce-checkout-review-order-table { border-radius: 0 !important; }
.woocommerce-checkout-review-order-table thead { display: none; }
.woocommerce-checkout-review-order-table th, .woocommerce-checkout-review-order-table td { padding: 10px 0 !important; border: 0 !important; vertical-align: middle; }
.woocommerce-checkout-review-order-table td:last-child { text-align: right !important; }
.woocommerce-checkout-review-order-table tbody td { padding-bottom: 20px !important; border-bottom: 1px solid var(--line-strong) !important; }
.woocommerce-checkout-review-order-table td.product-name { position: relative; padding-left: 96px !important; font-weight: 600; }
.checkout-item__thumb.summary-items__thumb { position: absolute; left: 0; top: calc(50% - 42px); width: 80px; height: 80px; border-radius: 16px; }
.checkout-item__thumb .review-card { left: 6px; top: 22px; width: 100px; }
/* WooCommerce zet " " achter de naam; font-size 0 voorkomt dat de aantalknoppen daardoor inspringen. */
.woocommerce-checkout-review-order-table td.product-name { font-size: 0; }
.checkout-item__name, .woocommerce-checkout-review-order-table td.product-name .variation { display: block; font-size: var(--fs-body); }
.checkout-item__name { margin-bottom: 8px; }
/* Aantalknoppen (klein) */
.stepper--sm { padding: 4px; vertical-align: middle; }
.stepper--sm .stepper__btn { width: 36px; height: 36px; }
.stepper--sm .stepper__btn:disabled { opacity: .4; cursor: default; }
.stepper--sm .stepper__input { width: 40px; height: 36px; font-size: var(--fs-body); }
.stepper.is-busy { opacity: .6; pointer-events: none; }
.woocommerce-checkout-review-order-table .product-quantity { font-weight: 600; white-space: nowrap; }
.woocommerce-checkout-review-order-table tfoot tr:first-child > * { padding-top: 20px !important; }
.woocommerce-checkout-review-order-table tfoot th { font-weight: 400; color: var(--ink-muted); }
.woocommerce-checkout-review-order-table tfoot .amount { font-weight: 400; }
.woocommerce-checkout-review-order-table .order-total > * { padding-top: 18px !important; border-top: 1px solid var(--line-strong) !important; }
.woocommerce-checkout-review-order-table .order-total th { color: var(--forest); font-weight: 700; }
.woocommerce-checkout-review-order-table .order-total .amount { font-size: clamp(2rem, 1.6rem + 1vw, 2.5rem); font-weight: 700; letter-spacing: -.03em; }
#shipping_method { list-style: none; margin: 0; padding: 0; }
/* Kortingscode boven de bestelknop */
.checkout-coupon { margin-top: 4px; padding-top: 20px; border-top: 1px solid var(--line-strong); }
.checkout-coupon__toggle { display: inline-flex; align-items: center; gap: 6px; padding: 0; border: 0; background: none; color: var(--forest); font: inherit; font-size: 1rem; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; width: 100%; justify-content: space-between;}
.checkout-coupon__toggle .icon { transition: transform .2s; }
.checkout-coupon__toggle[aria-expanded="true"] .icon { transform: rotate(45deg); }
.checkout-coupon__form { display: flex; gap: 10px; margin-top: 14px; }
.checkout-coupon__form[hidden] { display: none; }
.checkout-coupon__input { flex: 1; min-width: 0; min-height: 48px; padding: 10px 20px; border: 1.5px solid var(--line); border-radius: var(--radius-pill); background: var(--white); color: var(--forest); font: inherit; font-size: var(--fs-body); }
.checkout-coupon__input:focus { outline: 3px solid var(--forest); outline-offset: 2px; border-color: var(--forest); }
.checkout-coupon__form .btn { flex: none; min-height: 48px; }
.checkout-coupon__form.is-busy { opacity: .6; pointer-events: none; }
.checkout-coupon__notice:empty { display: none; }
.checkout-coupon__notice { margin-top: 12px; }
.checkout-coupon__notice .woocommerce-message, .checkout-coupon__notice .woocommerce-error, .checkout-coupon__notice .woocommerce-info { margin: 0; padding: 12px 16px; font-size: var(--fs-small); }
.woocommerce-checkout-review-order-table .cart-discount td { color: var(--success); }
.woocommerce-remove-coupon { margin-left: 6px; font-size: var(--fs-small); color: var(--ink-muted); }
.place-order { margin: 4px 0 0; }
#place_order { width: 100%; margin-top: 16px; padding-block: 20px; }
#place_order::after { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--icon-arrow) center / contain no-repeat; mask: var(--icon-arrow) center / contain no-repeat; }
:root { --icon-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
.woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--ink-muted); }
.checkout-legal { margin: 16px 0 0; padding-bottom: 24px; border-bottom: 1px solid var(--line-strong); font-size: 13px; line-height: 1.5; color: var(--ink-muted); }
.checkout-legal a { color: inherit; }
.checks.checkout-checks { margin-top: 24px; font-size: var(--fs-small); }
.woocommerce-form-coupon-toggle .woocommerce-info { background: transparent; padding-left: 0; }
@media (max-width: 1080px) {
	.woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
	.woocommerce-checkout form.checkout > *, .ttr-checkout-main, .woocommerce-checkout #order_review_heading, .woocommerce-checkout #order_review { grid-column: 1; grid-row: auto; }
	.woocommerce-checkout #order_review_heading { margin-top: 16px; }
}
@media (max-width: 820px) {
	.checkout-step, .woocommerce-checkout #customer_details .col-2 { padding-inline: 24px; }
	.checkout-step { padding-top: 28px; }
	.woocommerce-checkout #customer_details .col-2 { padding-bottom: 24px; }
	.woocommerce-billing-fields__field-wrapper .form-row, .woocommerce-shipping-fields__field-wrapper .form-row,
	.woocommerce-billing-fields__field-wrapper .form-row-first, .woocommerce-shipping-fields__field-wrapper .form-row-first,
	.woocommerce-billing-fields__field-wrapper .form-row-last, .woocommerce-shipping-fields__field-wrapper .form-row-last { grid-column: 1 / -1; }
	/* Mobiel: postcode volle breedte, Nr. en Toev. naast elkaar. */
	.woocommerce-billing-fields__field-wrapper .form-row-quart-first, .woocommerce-shipping-fields__field-wrapper .form-row-quart-first { grid-column: 1 / span 2; }
	.woocommerce-billing-fields__field-wrapper .form-row-quart, .woocommerce-shipping-fields__field-wrapper .form-row-quart { grid-column: span 2; }
	.woocommerce-checkout #order_review_heading { padding: 28px 24px 0; }
	.woocommerce-checkout #order_review { padding: 16px 24px 28px; }
	.ttr-info, .ttr-account-note { padding: 20px; }
	.ttr-info { align-items: flex-start; }
}
@media (max-width: 560px) {
	.woocommerce-checkout-review-order-table td.product-name { padding-left: 68px !important; }
	.checkout-item__thumb.summary-items__thumb { top: calc(50% - 34px); width: 56px; height: 56px; border-radius: 12px; }
	.checkout-item__thumb .review-card { left: 3px; top: 15px; width: 72px; }
	.woocommerce-checkout-review-order-table td.product-total { white-space: nowrap; padding-left: 8px !important; }
}

/* =========================================================================
   Bedankpagina
   ========================================================================= */
.thanks { display: flex; flex-direction: column; gap: var(--gutter); padding-top: 8px; }
.thanks__hero { grid-template-columns: minmax(0, 856px) minmax(0, 1fr); }
.thanks__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 56px; }
.thanks__check { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 12px; border-radius: 50%; background: var(--success); color: var(--white); }
.thanks__check .icon { stroke-width: 3; }
.thanks__art { min-height: 360px; padding: 0; }
.thanks__card { position: absolute; left: 50%; top: 50%; width: min(340px, 80%); transform: translate(-50%, -50%) rotate(8deg); }
.link-step { display: flex; flex-direction: column; gap: 20px; padding: 40px 48px; border: 2px solid var(--coral); }
.link-step.is-done { border-color: transparent; }
.link-step__head { display: flex; align-items: center; gap: 20px; }
.link-step__title { font-size: clamp(1.625rem, 1.2rem + 1.2vw, 2.25rem); margin-bottom: 4px; }
.link-step .alert { margin: 0; }
.link-form { display: flex; align-items: flex-end; gap: 12px; }
.link-form__field { flex: 1; }
.link-form--stack { flex-direction: column; align-items: stretch; flex: 1; gap: 10px; }
.link-form__buttons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.link-form__buttons .btn { max-width: 100%; white-space: normal; text-align: center; }
.link-step__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
.link-step__foot .icon { display: inline-block; vertical-align: -4px; margin-right: 4px; }
/* Meerdere kaarten: per kaart een rij (nummer · naam · link · test) */
.link-form--cards { flex-direction: column; align-items: stretch; gap: 16px; }
.link-rows { display: flex; flex-direction: column; }
.link-row { display: grid; grid-template-columns: 80px minmax(0, 1fr) minmax(0, 2fr) auto; align-items: end; gap: 12px 16px; padding: 16px 0; border-top: 1px solid var(--line); }
.link-row:first-child { border-top: 0; padding-top: 0; }
.link-row__num { align-self: center; padding-top: 26px; font-weight: 700; }
.link-row--todo .link-row__num { color: var(--coral); }
.link-row__test { min-height: 52px; }
.field input[aria-invalid="true"] { border-color: var(--error); }
.thanks__payment { padding: 32px 40px; }
.thanks__payment h2 { font-size: var(--fs-h4); margin-bottom: 12px; }
.thanks__payment ul { padding-left: 1.2em; }
.thanks__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.timeline-tile, .summary-tile { padding: 44px 48px; }
.timeline { list-style: none; margin: 28px 0 0; padding: 0; }
.timeline li { position: relative; display: flex; gap: 20px; padding-bottom: 24px; }
.timeline li:not(:last-child)::before { content: ""; position: absolute; left: 17px; top: 40px; bottom: 4px; width: 2px; background: var(--line); }
.timeline__dot { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--sand); font-size: var(--fs-small); font-weight: 700; }
.timeline li.is-done .timeline__dot { background: var(--success); color: var(--white); }
.timeline li > div { padding-top: 4px; }
.summary-items { list-style: none; margin: 24px 0 0; padding: 0 0 20px; border-bottom: 1px solid var(--line); }
.summary-items li { display: flex; align-items: center; gap: 16px; }
.summary-items__thumb { position: relative; flex: none; width: 64px; height: 64px; overflow: hidden; border-radius: 14px; background: var(--forest); }
.summary-items__thumb .review-card { position: absolute; left: 4px; top: 18px; width: 82px; transform: rotate(-8deg); box-shadow: none; }
.summary-items__name { display: flex; flex-direction: column; flex: 1; }
.summary-totals { margin: 0; padding-top: 12px; }
.summary-totals__row { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; font-size: var(--fs-small); }
.summary-totals__row dt { color: var(--ink-muted); }
.summary-totals__row dd { margin: 0; text-align: right; }
.summary-totals__row--order_total { margin-top: 8px; padding-top: 14px; border-top: 1px solid var(--line); font-size: var(--fs-body); }
.summary-totals__row--order_total dt { color: var(--forest); font-weight: 600; }
.summary-totals__row--order_total .amount { font-size: 1.5rem; font-weight: 700; }
.summary-meta { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.summary-meta address { font-style: normal; }
.account-tile { display: flex; align-items: center; gap: 20px; padding: 28px 40px; }
.account-tile > div { flex: 1; }
@media (max-width: 1080px) { .thanks__hero, .thanks__grid { grid-template-columns: minmax(0, 1fr); } .thanks__art { min-height: 280px; } }
@media (max-width: 820px) {
	.link-row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.link-row__num { padding-top: 0; }
	.link-row__test { justify-self: start; min-height: 0; }
	.thanks__intro, .link-step, .timeline-tile, .summary-tile { padding: 28px; }
	.link-form { flex-direction: column; align-items: stretch; }
	.link-step__head { align-items: flex-start; }
	.account-tile { flex-direction: column; align-items: flex-start; padding: 24px; }
}

/* =========================================================================
   Mijn account
   ========================================================================= */
.account { display: flex; flex-direction: column; gap: var(--gutter); padding-top: 8px; }
.account__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; padding-bottom: 8px; }
.account__title .lead { margin-top: 8px; max-width: 980px; }
.account-nav ul { list-style: none; display: flex; gap: 20px; margin: 0; padding: 18px 0 0; }
.account-nav a { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; text-decoration: none; white-space: nowrap; }
@media (max-width: 820px) { .account__head { flex-direction: column; } .account-nav ul { padding-top: 0; flex-wrap: wrap; } }

.card-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gutter); align-items: stretch; }
.card-groups > .help-tile, .card-group:only-of-type { grid-column: 1 / -1; }
.card-group { display: flex; flex-direction: column; gap: 20px; padding: 32px 36px; }
.card-group--todo { border: 2px solid var(--coral); }
.card-group__head { display: flex; align-items: center; gap: 16px; }
.card-group__head .status-chip { align-self: flex-start; margin-top: 14px; }
.card-group__thumb { position: relative; flex: none; width: 64px; height: 64px; overflow: hidden; border-radius: 14px; background: var(--forest); }
.card-group__thumb .review-card { position: absolute; left: 4px; top: 18px; width: 82px; transform: rotate(-8deg); box-shadow: none; }
.card-group__title { flex: 1; }
.card-group__title .h3 { font-size: 1.5rem; }
.status-chip { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px 7px 12px; border-radius: var(--radius-pill); background: var(--sand); font-size: .875rem; font-weight: 600; white-space: nowrap; }
.status-chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--coral); }
.status-chip--ok { background: var(--paper); }
.status-chip--ok::before { background: var(--success); }
.card-group__alert { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; background: var(--paper); }
.card-group__alert .icon { flex: none; color: var(--coral); }
.card-group .alert { margin: 0; }
.card-group__body { display: flex; flex-direction: column; gap: 24px; }
.card-group .link-form--stack textarea { min-height: 0; resize: none; overflow: hidden; line-height: 1.6; overflow-wrap: anywhere; }
/* Kaartrijen binnen een bestelling */
.card-rows { display: flex; flex-direction: column; }
.card-row { display: flex; flex-direction: column; gap: 12px; padding: 20px 0; border-top: 1px solid var(--line); }
.card-row:first-child { padding-top: 4px; border-top: 0; }
.card-row--todo { margin-inline: -16px; padding-inline: 16px; border-left: 3px solid var(--coral); }
.card-row--todo:first-child { padding-top: 12px; }
.card-row--off { opacity: .55; }
.card-row__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; margin: 0; }
.card-row__taps { margin-left: auto; font-size: var(--fs-small); color: var(--ink-muted); }
.card-row .alert { margin: 0; }
.card-row__more summary { display: inline-block; font-size: var(--fs-small); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.card-row__more[open] summary { margin-bottom: 8px; }
.card-row .link-form__buttons { margin-top: 2px; }
.card-group__help { margin-top: -6px; }
.card-group__help .icon { display: inline-block; margin-right: 4px; vertical-align: -4px; }
.valid-hint { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-small); font-weight: 600; color: var(--success); }
.valid-hint .icon { stroke-width: 2.6; }
.valid-hint--own { color: var(--ink-muted); }
.tap-stat { align-self: flex-start; display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 152px; padding: 20px 16px 22px; border-radius: var(--radius-md); background: var(--forest); color: rgba(255,255,255,.85); text-align: center; }
.tap-stat__num { font-size: 3.5rem; font-weight: 700; line-height: 1; letter-spacing: -.03em; color: var(--white); }
.card-group__foot { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-top: 24px; border-top: 1px solid var(--line-strong); }
.card-group__foot:not(:has(.card-group__actions > *)) { gap: 0; }
.card-group__status { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card-group__status .icon { flex: none; }
.card-group__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.help-tile { display: flex; align-items: center; gap: 24px; padding: 28px 36px; }
.help-tile > div { flex: 1; }
@media (max-width: 1080px) { .card-groups { grid-template-columns: minmax(0, 1fr); } }
.empty-cards { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 48px; }
@media (max-width: 820px) {
	.card-group { padding: 24px; }
	.card-group__head { flex-wrap: wrap; }
	.help-tile { flex-direction: column; align-items: flex-start; padding: 24px; }
}

/* Accountgegevens (WooCommerce form-edit-account) */
.woocommerce-EditAccountForm { padding: 40px 48px; border-radius: var(--radius-lg); background: var(--white); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
.woocommerce-EditAccountForm > * { grid-column: 1 / -1; }
.woocommerce-EditAccountForm .form-row-first { grid-column: 1; }
.woocommerce-EditAccountForm .form-row-last { grid-column: 2; }
.woocommerce-EditAccountForm fieldset { margin: 16px 0; padding: 24px 0 0; border: 0; border-top: 1px solid var(--line); }
.woocommerce-EditAccountForm legend { padding: 0; font-size: var(--fs-h4); font-weight: 600; }
.woocommerce-EditAccountForm #account_display_name_description { display: block; margin-top: 6px; font-size: 13px; color: var(--ink-muted); }
.woocommerce-EditAccountForm .button { justify-self: start; background: var(--coral); }
@media (max-width: 820px) { .woocommerce-EditAccountForm { padding: 24px; grid-template-columns: minmax(0, 1fr); } .woocommerce-EditAccountForm .form-row-first, .woocommerce-EditAccountForm .form-row-last { grid-column: 1; } }

/* Wachtwoord vergeten / opnieuw instellen */
.woocommerce-ResetPassword, .woocommerce-account .lost_reset_password { max-width: 640px; padding: 40px 48px; border-radius: var(--radius-lg); background: var(--white); }

/* =========================================================================
   Kaart nog niet gekoppeld (/r/… zonder reviewlink)
   ========================================================================= */
.not-linked__main { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.not-linked__card { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; max-width: 560px; padding: 48px; }
.not-linked__logo { height: 24px; width: auto; margin-bottom: 16px; }
.not-linked__owner { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 12px; padding: 20px; border-radius: var(--radius-md); background: var(--paper); }
@media (max-width: 560px) { .not-linked__card { padding: 28px; } }
@media (max-width: 560px) {
	.link-step__head { flex-direction: column; gap: 14px; }
	.card-group__title { flex: 1 1 calc(100% - 80px); }
	.card-group__head .status-chip { margin-left: 80px; }
	.thanks__art { min-height: 220px; }
}