.wc-sms-btn-loading {
	position: relative;
	opacity: 0.85;
	cursor: wait;
	pointer-events: none;
}

.wc-sms-btn-loading::after {
	content: '';
	display: inline-block;
	width: 0.9em;
	height: 0.9em;
	margin-left: 0.5em;
	vertical-align: middle;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: wc-sms-spin 0.6s linear infinite;
}

@keyframes wc-sms-spin {
	to {
		transform: rotate(360deg);
	}
}

/* Match WooCommerce native field layout and input box styling. */
.woocommerce .woocommerce-form-login.login .woocommerce-form-row label,
.woocommerce .woocommerce-ResetPassword.lost_reset_password .woocommerce-form-row label,
#wc-sms-login-form-wrap .woocommerce-form-row label,
#wc-sms-forgot-password-form .woocommerce-form-row label {
	display: block;
	margin-bottom: 0.5em;
}

.woocommerce .woocommerce-form-login.login .form-row .input-text,
.woocommerce .woocommerce-ResetPassword.lost_reset_password .form-row .input-text,
#wc-sms-login-form-wrap .woocommerce-form-row .input-text,
#wc-sms-forgot-password-form .woocommerce-form-row .input-text {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-family: inherit;
	font-weight: 400;
	letter-spacing: normal;
	padding: 0.9rem 1.1rem;
	margin: 0;
	line-height: normal;
	height: auto;
	background-color: var(--wc-form-color-background, #fff);
	border: var(--wc-form-border-width, 1px) solid var(--wc-form-border-color, rgba(32, 7, 7, 0.8));
	border-radius: var(--wc-form-border-radius, 4px);
}

.wc-sms-auth-actions .button {
	margin-right: 0.5em;
}

.wc-sms-change-mobile {
	background: transparent;
	border: 0;
	color: #2271b1;
	box-shadow: none;
	padding-left: 0;
}

.wc-sms-change-mobile:hover {
	color: #135e96;
	background: transparent;
}

/* intl-tel-input + WooCommerce field integration */
.wc-sms-phone-field-wrap .iti,
.wc-sms-intl-phone-wrap .iti {
	width: 100%;
	display: block;
}

.wc-sms-phone-field-wrap .iti .iti__tel-input,
.wc-sms-intl-phone-wrap .iti .iti__tel-input {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-family: inherit;
	font-weight: 400;
	letter-spacing: normal;
	padding: 0.9rem 1.1rem;
	margin: 0;
	line-height: normal;
	height: auto;
	background-color: var(--wc-form-color-background, #fff);
	border: var(--wc-form-border-width, 1px) solid var(--wc-form-border-color, rgba(32, 7, 7, 0.8));
	border-radius: var(--wc-form-border-radius, 4px);
}

.wc-sms-phone-field-wrap .iti .iti__tel-input:focus,
.wc-sms-intl-phone-wrap .iti .iti__tel-input:focus {
	border-color: currentColor;
	outline: none;
}

.iti__country-list {
	z-index: 100;
	max-width: 100%;
}

.iti--separate-dial-code .iti__selected-country {
	border-radius: var(--wc-form-border-radius, 4px) 0 0 var(--wc-form-border-radius, 4px);
}

@media (max-width: 480px) {
	.iti__country-list {
		white-space: normal;
	}
}
