/**
 * EMPOLAS B2B — login and registration panel (0.12.4).
 * Used by the locked catalog and the logged-out My Account screen.
 */

.empolas-b2b-auth {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 24px;
	align-items: start;
	max-width: 900px;
	margin: 24px auto;
}

.empolas-b2b-auth__login,
.empolas-b2b-auth__cta {
	padding: 24px;
	border: 1px solid #dcdcde;
	border-radius: 10px;
	background: #fff;
}

.empolas-b2b-auth__title {
	margin: 0 0 8px 0;
	font-size: 1.25rem;
}

.empolas-b2b-auth__intro {
	margin: 0 0 16px 0;
	color: #4b5563;
}

.empolas-b2b-auth #empolas-b2b-login p {
	margin: 0 0 12px 0;
}

.empolas-b2b-auth #empolas-b2b-login label {
	display: block;
	margin-bottom: 4px;
	font-weight: 600;
}

.empolas-b2b-auth #empolas-b2b-login input[type="text"],
.empolas-b2b-auth #empolas-b2b-login input[type="password"] {
	width: 100%;
	min-height: 44px;
	padding: 8px 12px;
	border: 1px solid #c9ccd1;
	border-radius: 6px;
	font-size: 1rem;
}

.empolas-b2b-auth #empolas-b2b-login .login-remember label {
	font-weight: 400;
}

.empolas-b2b-auth #empolas-b2b-login .button,
.empolas-b2b-auth #empolas-b2b-login input[type="submit"] {
	min-height: 44px;
	padding: 10px 20px;
	background: var(--empolas-commerce-green, #4daf51);
	color: #fff;
	border: 0;
	border-radius: 6px;
	font-weight: 700;
	cursor: pointer;
}

.empolas-b2b-auth__lost {
	margin: 12px 0 0 0;
	font-size: 0.95rem;
}

/* --- Registration call to action --------------------------------------- */

.empolas-b2b-auth__cta {
	background: #f4f9f0;
	border-color: #cfe3bd;
}

.empolas-b2b-auth__cta-text {
	margin: 0 0 12px 0;
	font-size: 1.15rem;
	font-weight: 700;
}

.empolas-b2b-auth__cta-button {
	display: inline-block;
	min-height: 44px;
	padding: 11px 22px;
	background: var(--empolas-commerce-green, #4daf51);
	color: #fff !important;
	border-radius: 6px;
	font-weight: 700;
	text-decoration: none;
}

.empolas-b2b-auth__cta-button:hover,
.empolas-b2b-auth__cta-button:focus {
	background: #3f9243;
	color: #fff !important;
}

.empolas-b2b-auth__cta-note {
	margin: 12px 0 0 0;
	color: #4b5563;
	font-size: 0.95rem;
}

.empolas-b2b-auth :focus-visible {
	outline: 2px solid #1f5c8b;
	outline-offset: 2px;
}

/* --- My Account: one balanced login + registration layout (0.12.5) ------ */

/*
 * WooCommerce prints its own login column inside this wrapper, so both cards
 * share a single grid, a single max width and a single vertical rhythm. The
 * native markup is not overridden — it is only laid out.
 */
.empolas-b2b-account-auth {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 24px;
	align-items: stretch;
	max-width: 900px;
	margin: 24px auto;
}

/*
 * Exactly two grid children (0.12.6).
 *
 * With WooCommerce account registration suppressed, `form-login.php` prints a
 * bare `<h2>` followed by the login form — two siblings, not a column wrapper.
 * They used to land in the grid as separate items, so the heading took the
 * first cell, the form took the second and the partner card was pushed onto a
 * new row. The plugin now opens its own login card around that span, and the
 * card classes below are the ones that are actually styled; WooCommerce's
 * `u-columns` wrappers are only neutralized in case a shop re-enables them.
 */
.empolas-b2b-account-auth > * {
	min-width: 0;
}

.empolas-b2b-account-auth #customer_login,
.empolas-b2b-account-auth .u-columns,
.empolas-b2b-account-auth .u-column1,
.empolas-b2b-account-auth .col2-set,
.empolas-b2b-account-auth .col-1 {
	width: 100% !important;
	max-width: none !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* The two cards: identical box, identical padding, identical edges. */
.empolas-b2b-account-auth__login,
.empolas-b2b-account-auth__register .empolas-b2b-auth__cta {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 24px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 10px;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.empolas-b2b-account-auth__login h2 {
	margin: 0 0 16px 0;
	font-size: 1.25rem;
}

/* The native form must not add a second card inside the first one. */
.empolas-b2b-account-auth__login .woocommerce-form-login {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	background: none;
}

.empolas-b2b-account-auth .woocommerce-form-row label {
	display: block;
	margin-bottom: 4px;
	font-weight: 600;
}

.empolas-b2b-account-auth input[type="text"],
.empolas-b2b-account-auth input[type="email"],
.empolas-b2b-account-auth input[type="password"] {
	width: 100%;
	min-height: 44px;
	padding: 8px 12px;
	border: 1px solid #c9ccd1;
	border-radius: 6px;
	font-size: 1rem;
	box-sizing: border-box;
}

.empolas-b2b-account-auth button[type="submit"],
.empolas-b2b-account-auth .woocommerce-form-login__submit {
	min-height: 44px;
	padding: 10px 20px;
	background: var(--empolas-commerce-green, #4daf51);
	color: #fff;
	border: 0;
	border-radius: 6px;
	font-weight: 700;
	cursor: pointer;
}

.empolas-b2b-account-auth .woocommerce-form-login__rememberme {
	font-weight: 400;
}

/* The partner card fills the second column and matches the login card. */
.empolas-b2b-account-auth__register {
	display: flex;
	margin: 0;
}

.empolas-b2b-account-auth__register .empolas-b2b-auth__cta {
	background: #f4f9f0;
	border-color: #cfe3bd;
}

.empolas-b2b-account-auth :focus-visible {
	outline: 2px solid #1f5c8b;
	outline-offset: 2px;
}

@media screen and (max-width: 782px) {
	.empolas-b2b-auth,
	.empolas-b2b-account-auth {
		grid-template-columns: 1fr;
		gap: 16px;
		margin: 16px auto;
	}

	.empolas-b2b-account-auth__login,
	.empolas-b2b-account-auth__register .empolas-b2b-auth__cta {
		padding: 18px;
	}

	.empolas-b2b-auth__login,
	.empolas-b2b-auth__cta {
		padding: 18px;
	}

	.empolas-b2b-auth__cta-button {
		display: block;
		text-align: center;
	}
}
