/**
 * Lightweight layout for FluentCart checkout login panel.
 * Rendered via fluent_cart/before_checkout_page_start (sibling above [data-fluent-cart-checkout-page]).
 * Markup avoids FluentCart fct_* classes so core checkout JS/CSS never targets this panel.
 */

.fcl-checkout-login {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin-bottom: 1rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--fct-checkout-border-color, #d6dae1);
	border-radius: 6px;
	background: var(--fct-checkout-secondary-bg-color, #f5f6f7);
}

.fcl-checkout-login *,
.fcl-checkout-login *::before,
.fcl-checkout-login *::after {
	box-sizing: border-box;
}

.fcl-checkout-login .fcl-checkout-login__section-body,
.fcl-checkout-login [data-fcl-checkout-login-field-wrap] {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

.fcl-checkout-login__field--spaced {
	margin-top: 12px;
}

.fcl-checkout-login__label {
	display: block;
	margin: 0 0 4px;
	font-size: 15px;
	font-weight: 500;
	color: var(--fct-checkout-primary-text-color, #2f3448);
}

.fcl-checkout-login__label-text abbr.required {
	text-decoration: none;
	border: none;
}

.fcl-checkout-login__form .fcl-checkout-login__input[type="text"],
.fcl-checkout-login__form .fcl-checkout-login__input[type="password"] {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0;
	min-height: 40px;
	padding: 10px 16px;
	line-height: 1;
	border-radius: 8px;
	border-style: solid;
	border-width: 1px;
	border-color: var(
		--fct-checkout-input-border-color,
		var(--fct-checkout-border-color, #d6dae1)
	);
	background-color: var(--fct-checkout-input-bg-color, #fff);
	font-size: 15px;
	color: var(--fct-checkout-input-text-color, #2f3448);
}

.fcl-checkout-login__form .fcl-checkout-login__input[type="password"] {
	font-size: 13px;
	letter-spacing: 0.02em;
}

.fcl-checkout-login__form .fcl-checkout-login__input[type="text"]:focus,
.fcl-checkout-login__form .fcl-checkout-login__input[type="password"]:focus {
	border-color: var(--fct-checkout-active-border-color, #8d9095);
	outline: 2px solid transparent;
	outline-offset: 2px;
}

.fcl-checkout-login__error {
	display: block;
	margin-top: 4px;
	min-height: 1.25em;
	font-size: 13px;
	color: var(--fct-checkout-error-color, #dc3545);
}

.fcl-checkout-login__title {
	margin: 0 0 4px;
	font-size: 1rem;
	line-height: 1.35;
	font-weight: 600;
	color: var(--fct-checkout-primary-text-color, #2f3448);
}

.fcl-checkout-login__intro {
	margin: 0 0 12px;
	font-size: 14px;
	line-height: 1.45;
	color: var(--fct-checkout-secondary-text-color, #565865);
}

.fcl-checkout-login__actions-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	margin-top: 8px;
}

.fcl-checkout-login__submit--primary {
	cursor: pointer;
	padding: 10px 20px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.25;
	border-radius: 6px;
	border: 1px solid var(--fct-btn-border-color, #253241);
	background: var(--fct-checkout-btn-bg-color, #253241);
	color: var(--fct-checkout-btn-text-color, #fff);
	transition: opacity 0.15s ease;
}

.fcl-checkout-login__submit--primary:disabled {
	opacity: 0.65;
	cursor: wait;
}

.fcl-checkout-login [data-fcl-checkout-login-field-wrap].has-error .fcl-checkout-login__input {
	border-color: var(--fct-checkout-error-color, #dc3545);
}

.fcl-checkout-login__lost {
	font-size: 14px;
}

.fcl-checkout-login__lost a {
	text-decoration: underline;
	color: var(
		--fct-modal-checkout-active-text-color,
		var(--fct-checkout-active-border-color, #017ef3)
	);
}

.fcl-checkout-login__remember-wrap {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}

.fcl-checkout-login__checkbox-label {
	font-size: 14px;
	cursor: pointer;
	color: var(--fct-checkout-primary-text-color, #2f3448);
}

/* Visually hide fieldset legend when FluentCart/theme does not ship .sr-only */
.fcl-checkout-login .sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}
