/**
 * Ajustes mínimos de responsividade (mobile).
 * Carregado por último para sobrepor CartFlows / post-20 / Elementor.
 */

/* checkout-template.css usa margin negativo aqui e desalinha o cabeçalho cinza da caixa branca */
.wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout .woocommerce-billing-fields__customer-info-wrapper {
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/* Mesmo motivo: field-wrapper com -7px alarga Factuurgegevens vs Klanteninformatie */
.wcf-embed-checkout-form .woocommerce-checkout .wcf-col2-set .woocommerce-billing-fields .woocommerce-billing-fields__field-wrapper {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout #customer_details .wcf-customer-info {
	display: block;
	width: 100%;
	box-sizing: border-box;
}

@media screen and (max-width: 768px) {
	.elementor-20 .elementor-element {
		--widgets-spacing-row: 12px;
		--widgets-spacing-column: 12px;
		--widgets-spacing: 12px 12px;
	}

	/* Padding horizontal total do bloco Woo (checkout-template @768) */
	.wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout .woocommerce {
		padding-left: 12px !important;
		padding-right: 12px !important;
		box-sizing: border-box;
	}

	#customer_information_heading,
	.woocommerce-billing-fields-custom {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	/* Secção 2 “Adres”: ::before usa -20px (desktop); no mobile o padding é 16px — sem isto o cabeçalho fica mais largo que a secção 1 */
	#billing_country_field::before {
		margin-left: -16px;
		margin-right: -16px;
		margin-top: -16px;
	}
}

@media screen and (max-width: 480px) {
	.elementor-20 .elementor-element {
		--widgets-spacing-row: 10px;
		--widgets-spacing-column: 10px;
		--widgets-spacing: 10px 10px;
	}

	.wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout .woocommerce {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}

	#customer_information_heading {
		padding: 12px 16px 12px 42px;
		font-size: 14px;
	}

	#customer_information_heading::before {
		left: 14px;
	}

	.woocommerce-billing-fields__customer-info-wrapper {
		padding: 14px !important;
	}

	#billing_country_field::before {
		margin-left: -14px;
		margin-right: -14px;
		margin-top: -16px;
	}

	/* Campos “caixa” em post-20.css usam padding 20px */
	#billing_first_name_field,
	#billing_last_name_field,
	#billing_phone_field,
	#billing_country_field,
	#billing_address_1_field,
	#billing_city_field,
	#billing_postcode_field {
		padding-left: 14px !important;
		padding-right: 14px !important;
		box-sizing: border-box;
	}

	/* E-mail só no bloco Klanteninformatie: sem padding extra (o wrapper já tem) */
	.woocommerce-billing-fields__customer-info-wrapper #billing_email_field {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.cartflows-container {
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
	}

	.elementor-section.elementor-element-7b5d56b > .elementor-container {
		max-width: 100%;
		padding-left: 8px;
		padding-right: 8px;
		box-sizing: border-box;
	}
}

@media screen and (max-width: 380px) {
	.wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout .woocommerce {
		padding-left: 8px !important;
		padding-right: 8px !important;
	}

	.elementor-section.elementor-element-7b5d56b > .elementor-container {
		padding-left: 6px;
		padding-right: 6px;
	}

	#customer_information_heading {
		padding-left: 38px;
		padding-right: 10px;
	}
}

/**
 * Site estático: o módulo WooCommerce Stripe UPE aponta para API’s inexistentes.
 * Mantém o rótulo iDEAL; o pagamento real usa o bloco #wcf-stripe-payment-mount.
 */
.payment_method_stripe_ideal .payment_box {
	display: none !important;
}

.wcf-stripe-payment-mount {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	padding: 16px 0 8px;
}

.wcf-main-product-line {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.wcf-main-product-thumb {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 6px;
	flex-shrink: 0;
}

.wcf-main-product-title {
	flex: 1;
	min-width: 0;
}