/**
 * Phone field layout.
 */
.cp-phone-field {
	display: flex;
	gap: 0.45rem;
	align-items: stretch;
	width: 100%;
}

.cp-phone-field__cc {
	flex: 0 0 auto;
	min-width: 7.5rem;
	max-width: 9rem;
	padding: 0.55rem 0.45rem;
	border: 1px solid #d7e2e8;
	border-radius: 10px;
	font: inherit;
	background: #fff;
}

.cp-phone-field__national {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.55rem 0.75rem;
	border: 1px solid #d7e2e8;
	border-radius: 10px;
	font: inherit;
	background: #fff;
}

.cp-phone-field__cc:focus,
.cp-phone-field__national:focus {
	outline: 2px solid rgba(11, 79, 108, 0.25);
	border-color: #0b4f6c;
}

.cp-admin .cp-phone-field__cc,
.cp-admin .cp-phone-field__national {
	border-radius: 4px;
	padding: 0.35rem 0.5rem;
}