/* =============================================================================
   IYG User Registration Styles
   ============================================================================= */

/* -----------------------------------------------------------------------------
   WooCommerce compatibility
   WC themes scope virtually all their form rules under .woocommerce; the
   shortcode_output() method wraps the form in <div class="woocommerce"> to
   match that context.  The rule below suppresses the duplicate show-password
   button that WooCommerce's password-strength script injects into any
   .password-input span whose HTML already contains one.
   ----------------------------------------------------------------------------- */

.password-input .show-password-input ~ .show-password-input {
	display: none;
}

/* -----------------------------------------------------------------------------
   Inline field feedback messages
   ----------------------------------------------------------------------------- */

.iyg-field-feedback {
	display: block;
	font-size: 0.82em;
	margin-top: 4px;
	min-height: 1.2em;
	line-height: 1.4;
}

.iyg-feedback--valid {
	color: #2e7d32;
}

.iyg-feedback--invalid {
	color: #c62828;
}

.iyg-feedback--checking {
	color: #666;
	font-style: italic;
}

/* -----------------------------------------------------------------------------
   Input border states
   ----------------------------------------------------------------------------- */

.woocommerce-form-register .woocommerce-Input.iyg-field--valid {
	border-color: #43a047 !important;
}

.woocommerce-form-register .woocommerce-Input.iyg-field--invalid {
	border-color: #e53935 !important;
}

.woocommerce-form-register .woocommerce-Input.iyg-field--checking {
	border-color: #aaa !important;
}

/* -----------------------------------------------------------------------------
   Field hint text (below phone input)
   ----------------------------------------------------------------------------- */

.iyg-field-hint {
	display: block;
	margin-top: 4px;
	font-size: 0.8em;
	color: #666;
	line-height: 1.5;
}

/* -----------------------------------------------------------------------------
   Inline checkbox labels (SMS opt-in, Terms)
   ----------------------------------------------------------------------------- */

.woocommerce-form__label-for-checkbox.inline {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	cursor: pointer;
	line-height: 1.5;
}

.woocommerce-form__label-for-checkbox.inline input[type="checkbox"] {
	flex-shrink: 0;
	width: 18px !important;
	height: 18px !important;
	margin: 3px 0 0 0 !important;
	cursor: pointer;
}

/* Terms checkbox */
#reg_terms_conditions {
	width: 18px !important;
	height: 18px !important;
	cursor: pointer;
}

/* -----------------------------------------------------------------------------
   First / Last name side-by-side layout
   ----------------------------------------------------------------------------- */

@media ( min-width: 480px ) {
	.woocommerce-form-register .form-row-first,
	.woocommerce-form-register .form-row-last {
		width: 48%;
		display: inline-block;
		vertical-align: top;
	}

	.woocommerce-form-register .form-row-first {
		margin-right: 3%;
	}
}

/* -----------------------------------------------------------------------------
   Username-specific feedback (inherits .iyg-field-feedback base styles)
   ----------------------------------------------------------------------------- */

.iyg-username-feedback {
	font-weight: 500;
}
