/* Gestel.nu – WooCommerce-blokken (winkelwagen, afrekenen, bedankt, mijn account). Alleen op WooCommerce-pagina's. */

/* Bredere kolom: formulier + besteloverzicht naast elkaar. */
.woocommerce-page .gn-article--page .gn-col { max-width: calc(1080px + 2 * var(--gn-gutter)); }
.woocommerce-page .gn-content .alignwide { margin-inline: 0; }

.woocommerce-page .gn-content { font-size: 1rem; }
.woocommerce-page .gn-content a:not(.wc-block-components-button) { color: var(--gn-link); }

/* Invoervelden volgen de thema-kleuren (ook dark mode). */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-textarea,
.wc-block-components-select .wc-blocks-components-select__select,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.woocommerce-page .gn-content input.input-text,
.woocommerce-page .gn-content select {
	background-color: var(--gn-surface) !important;
	color: var(--gn-text) !important;
	border-color: var(--gn-border) !important;
	border-radius: var(--gn-radius-sm) !important;
}
.wc-block-components-text-input label,
.wc-block-components-select label,
.wc-blocks-components-select__label,
.wc-block-components-combobox label { color: var(--gn-muted) !important; }
.wc-blocks-components-select__expand,
.wc-block-components-select svg { fill: var(--gn-text); }
.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"],
.wc-block-components-radio-control__input {
	background-color: var(--gn-surface);
	border-color: var(--gn-muted);
}
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--gn-text); }
.wc-block-components-radio-control__input:checked::before { background: var(--gn-text); }

/* Vlakken en randen. */
.wc-block-components-sidebar-layout .wc-block-components-sidebar,
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-components-radio-control-accordion-option,
.wc-block-components-panel,
.wc-block-components-totals-wrapper { border-color: var(--gn-border) !important; }
.wc-block-components-validation-error,
.wc-block-components-validation-error p { color: #c43d2f; }

/* Knoppen in de huisstijl. */
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-empty-cart-block .wp-block-button__link,
.woocommerce-page .gn-content .button {
	background: var(--gn-cta-bg) !important;
	color: var(--gn-cta-text) !important;
	border: 0 !important;
	border-radius: var(--gn-radius-sm);
	font-weight: 700;
	text-decoration: none;
}
.wc-block-components-button:not(.is-link):hover { filter: brightness(1.12); }
.wc-block-components-button:not(.is-link):focus-visible { outline: 3px solid var(--gn-focus); outline-offset: 2px; }

/* Bedankpagina en mijn account: tabellen en blokken leesbaar in dark mode. */
.woocommerce-page .gn-content table { width: 100%; border-collapse: collapse; }
.woocommerce-page .gn-content th,
.woocommerce-page .gn-content td { padding: var(--gn-space-2) var(--gn-space-3); border-bottom: 1px solid var(--gn-border); text-align: left; }
.woocommerce-order-overview { display: flex; flex-wrap: wrap; gap: var(--gn-space-3) var(--gn-space-6); padding: 0; list-style: none; }
.woocommerce-order-overview li { font-size: .875rem; color: var(--gn-muted); }
.woocommerce-order-overview strong { display: block; color: var(--gn-text); font-size: 1rem; }
.woocommerce-notice,
.woocommerce-info,
.woocommerce-message { padding: var(--gn-space-3) var(--gn-space-4); border-radius: var(--gn-radius-sm); background: var(--gn-surface-2); }
.woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; gap: var(--gn-space-2) var(--gn-space-4); padding: 0; list-style: none; }
.woocommerce-page .gn-content dl { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--gn-space-2) var(--gn-space-4); padding: 0; }
.woocommerce-page .gn-content dt { font-weight: 600; }
.woocommerce-page .gn-content dt,
.woocommerce-page .gn-content dd { margin: 0; padding: 0; overflow-wrap: anywhere; }