/* Saudi phone: login-style row with nested SA +966 chip + local input */
.aq-phone-field {
	display: block;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.aq-phone-input-shell {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	gap: 8px;
	direction: ltr;
	unicode-bidi: isolate;
}

.aq-phone-prefix {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 4px;
	padding: 0.35rem 0.5rem;
	font-size: inherit;
	line-height: 1.25;
	color: var(--Colors-Gray-Dark, #666666);
	white-space: nowrap;
	user-select: none;
	pointer-events: none;
	border: 1px solid var(--Colors-Gray-Lighter, #e6e6e6);
	border-radius: 8px;
	background: var(--Colors-White, #fff);
	box-sizing: border-box;
}

.aq-phone-prefix-chevron {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--Colors-Gray-Default, #999999);
	line-height: 0;
}

.aq-phone-prefix-chevron svg {
	display: block;
	width: 16px;
	height: 16px;
}

.aq-phone-prefix-label {
	font-weight: 500;
	color: var(--Colors-Gray-Darkest, #111111);
}

.aq-phone-field .aq-phone-local {
	flex: 1 1 auto;
	min-width: 0;
	width: 0;
	border: none;
	outline: none;
	background: transparent;
	box-shadow: none;
	padding: 0;
	box-sizing: border-box;
}

[dir="rtl"] .aq-phone-field .aq-phone-local {
	text-align: right;
}

[dir="ltr"] .aq-phone-field .aq-phone-local {
	text-align: left;
}

.aq-phone-field .aq-phone-local::placeholder {
	color: var(--Colors-Gray-Default, #999999);
}

.aq-phone-input-shell:focus-within {
	outline: none;
}

.aq-phone-input-shell:not([class*="focus-within:"]):focus-within {
	box-shadow: 0 0 0 2px rgba(106, 93, 139, 0.3);
}

/* Account modals: outer .Field / .client-login-field already has the border */
.Field .aq-phone-field,
.forgot-password-field .aq-phone-field,
.join-partner-input-field .aq-phone-field,
.client-login-field .aq-phone-field {
	flex: 1 1 0;
	min-width: 0;
	width: auto;
}

.Field .aq-phone-input-shell,
.forgot-password-field .aq-phone-input-shell,
.join-partner-input-field .aq-phone-input-shell,
.client-login-field .aq-phone-input-shell {
	border: none;
	outline: none;
	background: transparent;
	padding: 0;
	box-shadow: none;
	width: 100%;
}

.Field .aq-phone-input-shell:focus-within,
.forgot-password-field .aq-phone-input-shell:focus-within,
.join-partner-input-field .aq-phone-input-shell:focus-within,
.client-login-field .aq-phone-input-shell:focus-within {
	box-shadow: none;
}

.form-input-group .aq-phone-field {
	width: 100%;
}

form[data-validate-form] .aq-phone-field,
.grid .aq-phone-field {
	width: 100%;
	min-width: 0;
}

/* E-shop / retail: login-style outer row (border + icon); inner widget stays borderless */
.aq-phone-outer-field {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	padding: 0.625rem 0.75rem;
	min-height: 0;
	background: var(--Colors-Gray-White, #fff);
	overflow: hidden;
	border-radius: 12px;
	outline: 1px var(--Colors-Gray-Lighter, #e6e6e6) solid;
	outline-offset: -1px;
	flex-direction: row-reverse;
}

[dir="ltr"] .aq-phone-outer-field {
	flex-direction: row;
}

.aq-phone-outer-field:focus-within {
	outline: 2px rgba(106, 93, 139, 0.45) solid;
	outline-offset: -2px;
}

.aq-phone-outer-icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	position: relative;
	line-height: 0;
}

.aq-phone-plain-input,
.aq-phone-outer-field .aq-phone-local {
	flex: 1 1 0;
	min-width: 0;
	border: none;
	outline: none;
	background: transparent;
	color: var(--Colors-Gray-Darkest, #111111);
	font-size: inherit;
	font-weight: 500;
	line-height: 1.25;
	width: 100%;
	box-sizing: border-box;
}

[dir="rtl"] .aq-phone-plain-input,
[dir="rtl"] .aq-phone-outer-field .aq-phone-local {
	text-align: right;
}

[dir="ltr"] .aq-phone-plain-input,
[dir="ltr"] .aq-phone-outer-field .aq-phone-local {
	text-align: left;
}

.aq-phone-plain-input::placeholder,
.aq-phone-outer-field .aq-phone-local::placeholder {
	color: var(--Colors-Gray-Default, #999999);
}

.aq-phone-outer-field .aq-phone-field {
	flex: 1 1 0;
	min-width: 0;
	width: auto;
}

.aq-phone-outer-field .aq-phone-input-shell {
	border: none;
	outline: none;
	background: transparent;
	padding: 0;
	box-shadow: none;
	width: 100%;
	min-height: 0;
	align-items: center;
}

.aq-phone-outer-field .aq-phone-prefix {
	padding: 0.125rem 0.375rem;
	font-size: 0.875rem;
	line-height: 1.2;
}

.aq-phone-outer-field .aq-phone-prefix-chevron svg {
	width: 14px;
	height: 14px;
}

.aq-phone-outer-field .aq-phone-input-shell:focus-within {
	box-shadow: none;
}
