/**
 * Country Code Field Styles
 *
 * @package woo-cart-abandonment-recovery-pro
 * @since 1.1.3
 */

/* Classic Checkout */
.woocommerce-checkout .billing_country_code_field,
.woocommerce-checkout .shipping_country_code_field {
	width: 30% !important;
	clear: left;
}

.woocommerce-checkout .billing_phone_field,
.woocommerce-checkout .shipping_phone_field {
	width: 66% !important;
}

#billing_phone_country_code,
#shipping_phone_country_code {
	width: 100%;
	height: auto;
	box-sizing: border-box;
}

/* CartFlows Checkout – unset forced 100% width so form-row-first/last layout works */
body[class*="cartflows-"] .woocommerce-checkout #billing_phone_country_code_field + #billing_phone_field,
body[class*="cartflows-"] .woocommerce-checkout #shipping_phone_country_code_field + #shipping_phone_field {
	width: unset !important;
}

/* Block Checkout */
.wc-phone-with-country {
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	align-items: flex-start;
	width: 100%;
}

.wc-country-code-field {
	flex: 0 0 auto;
	min-width: 110px;
	max-width: 180px;
	width: 35%;
}

.wc-phone-with-country .wc-block-components-text-input {
	flex: 1 1 auto;
	min-width: 0;
}

/* Responsive */
@media (max-width: 480px) {
	.wc-phone-with-country {
		flex-direction: column;
		gap: 0;
	}

	.wc-country-code-field {
		width: 100%;
		max-width: 100%;
	}

	.woocommerce-checkout .billing_country_code_field,
	.woocommerce-checkout .shipping_country_code_field,
	.woocommerce-checkout .billing_phone_field,
	.woocommerce-checkout .shipping_phone_field {
		width: 100% !important;
		clear: both;
	}
}