/* Phone + country code (flag) on checkout */

.opsmind-phone-field {
	display: flex;
	align-items: stretch;
	gap: 0;
	width: 100%;
	border: 1px solid #d1d5db;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	direction: ltr;
}

.opsmind-phone-field:focus-within {
	border-color: #1b7fea;
	box-shadow: 0 0 0 3px rgba(27, 127, 234, 0.15);
}

.opsmind-phone-field .opsmind-phone-code {
	flex: 0 0 auto;
	min-width: 6.5rem;
	max-width: 8.5rem;
	border: 0;
	border-right: 1px solid #e5e7eb;
	background: #f8fafc;
	padding: 10px 8px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: #111827;
	cursor: pointer;
	appearance: auto;
}

.opsmind-phone-field input[name="ops_phone"] {
	flex: 1 1 auto;
	border: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	margin: 0 !important;
	border-radius: 0 !important;
	min-width: 0;
	padding: 10px 12px !important;
	font-size: 15px;
	direction: ltr;
	text-align: left;
}

.billing_information .form-group:has(.opsmind-phone-field) > input[name="ops_phone"] {
	/* moved into wrapper */
}

/* Keep label alignment with Arabic checkout */
.billing_information .form-group:has(.opsmind-phone-field) label {
	display: block;
	margin-bottom: 6px;
}

input[name="ops_email"]:invalid:not(:placeholder-shown):not(:focus) {
	border-color: #dc2626 !important;
}