/* Saudi mobile field: same height and border as the other inputs.
   Gray sits only behind the fixed +966 and flag. */
.elementor-field-group > .mtk-phone,
.mutakamela-suggestions-field .mtk-phone {
	flex: 1 0 100%;
	width: 100%;
	max-width: 100%;
}

.mtk-phone {
	display: flex;
	align-items: stretch;
	direction: ltr;
	width: 100%;
	box-sizing: border-box;
	min-height: 40px;
	margin: 0;
	padding: 0;
	gap: 8px;
	background: transparent;
	border: 0;
	border-radius: 0;
	overflow: visible;
}

.mtk-phone input,
.mtk-phone input.elementor-field,
.mutakamela-suggestions-field .mtk-phone input {
	flex: 1 1 auto;
	min-width: 0;
	width: auto !important;
	height: 40px;
	min-height: 40px !important;
	margin: 0 !important;
	padding: 5px 14px !important;
	border: 1px solid #e3e6ea !important;
	border-radius: 3px !important;
	background: #fff !important;
	box-shadow: none !important;
	color: #1f2124;
	font-size: 15px !important;
	font-weight: 400;
	line-height: 1.4 !important;
	text-align: left;
	direction: ltr;
}

.mtk-phone--ar input,
html[dir="rtl"] .mtk-phone input {
	direction: rtl;
	text-align: right;
}

.mtk-phone input::placeholder {
	color: #69727d;
	font-size: 15px;
	font-weight: 400;
	opacity: 0.7;
}

.mtk-phone--ar input::placeholder,
html[dir="rtl"] .mtk-phone input::placeholder {
	direction: rtl;
	text-align: right;
	unicode-bidi: isolate;
}

.mtk-phone:focus-within input {
	border-color: #c5cad1 !important;
}

.mtk-phone input:focus {
	outline: none;
	box-shadow: none;
}

.mtk-phone__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	flex: 0 0 auto;
	margin: 0;
	padding: 0 10px;
	background: #f3f5f7;
	border: 0;
	border-radius: 3px;
	color: #3d4a54;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
}

.mtk-phone__code {
	direction: ltr;
	unicode-bidi: isolate;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

.mtk-phone__flag {
	font-size: 15px;
	line-height: 1;
}