.q8ps-account-entry {
	--q8ps-teal: #00a98f;
	--q8ps-teal-dark: #007f72;
	--q8ps-navy: #071224;
	--q8ps-muted: #64748b;
	--q8ps-border: #dfe8ee;
	display: grid;
	grid-template-columns: minmax(360px, 520px) minmax(0, 1fr);
	gap: 28px;
	align-items: stretch;
	max-width: 1120px;
	margin: 20px auto 48px;
	color: var(--q8ps-navy);
}

.q8ps-account-entry * {
	box-sizing: border-box;
	letter-spacing: 0;
	text-transform: none;
}

.q8ps-account-entry [hidden] {
	display: none !important;
}

[data-q8ps-method-field][hidden] {
	display: none !important;
}

.q8ps-account-card,
.q8ps-account-benefits {
	border: 1px solid rgba(15, 23, 42, .08);
	border-radius: 22px;
	background: rgba(255, 255, 255, .95);
	box-shadow: 0 22px 60px rgba(15, 23, 42, .10);
}

.q8ps-account-card {
	padding: 34px;
}

.q8ps-account-benefits {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 560px;
	padding: 42px;
	background:
		linear-gradient(135deg, rgba(0, 169, 143, .14), rgba(255, 255, 255, .94)),
		#fff;
}

.q8ps-account-panel {
	display: none;
}

.q8ps-account-panel.is-active {
	display: block;
}

.q8ps-reset-panel {
	display: none;
}

.q8ps-reset-panel.is-active {
	display: block;
}

.q8ps-account-entry h2 {
	margin: 0;
	color: var(--q8ps-navy);
	font-size: 30px;
	font-weight: 900;
	line-height: 1.12;
}

.q8ps-account-benefits h2 {
	font-size: clamp(30px, 4vw, 46px);
	line-height: 1.05;
}

.q8ps-account-panel > p,
.q8ps-account-benefits > p {
	margin: 12px 0 24px;
	color: var(--q8ps-muted);
	font-size: 15px;
	line-height: 1.65;
}

.q8ps-account-kicker {
	margin: 0 0 14px !important;
	color: var(--q8ps-teal-dark) !important;
	font-size: 13px !important;
	font-weight: 900;
}

.q8ps-account-form {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0;
}

.q8ps-account-form label {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin: 0;
	color: #26364d;
	font-size: 13px;
	font-weight: 850;
}

.q8ps-account-form input[type="email"],
.q8ps-account-form input[type="password"],
.q8ps-account-form input[type="tel"],
.q8ps-account-form input[type="text"] {
	width: 100%;
	height: 48px;
	margin: 0;
	border: 1px solid var(--q8ps-border);
	border-radius: 13px;
	background: #f8fbfc;
	color: var(--q8ps-navy);
	font-size: 15px;
	font-weight: 700;
	box-shadow: none;
	transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.q8ps-account-form input:focus {
	border-color: rgba(0, 169, 143, .55);
	background: #fff;
	box-shadow: 0 0 0 4px rgba(0, 169, 143, .12);
	outline: none;
}

.q8ps-phone-combo {
	display: grid;
	grid-template-columns: minmax(150px, .42fr) minmax(0, 1fr);
	gap: 10px;
	align-items: center;
}

.q8ps-phone-combo select,
.q8ps-phone-combo input {
	width: 100%;
	height: 48px;
	margin: 0;
	border: 1px solid var(--q8ps-border);
	border-radius: 13px;
	background: #f8fbfc;
	color: var(--q8ps-navy);
	font-size: 14px;
	font-weight: 800;
}

.q8ps-phone-combo select {
	direction: ltr;
	text-align: left;
}

.q8ps-account-lost .woocommerce-ResetPassword {
	margin: 0;
}

.q8ps-account-lost .woocommerce-ResetPassword p {
	margin: 0 0 16px;
	color: var(--q8ps-muted);
	font-size: 15px;
	line-height: 1.65;
}

.q8ps-account-lost .woocommerce-ResetPassword label {
	display: block;
	margin: 0 0 16px;
	color: var(--q8ps-text);
	font-size: 13px;
	font-weight: 800;
}

.q8ps-account-lost .woocommerce-ResetPassword input[type="text"],
.q8ps-account-lost .woocommerce-ResetPassword input[type="password"] {
	width: 100%;
	min-height: 48px;
	margin-top: 8px;
	padding: 0 14px;
	border: 1px solid rgba(10, 32, 41, .14);
	border-radius: 14px;
	background: #fff;
	color: var(--q8ps-text);
	font-size: 15px;
	direction: ltr;
}

.q8ps-account-lost .woocommerce-ResetPassword .button {
	width: 100%;
	min-height: 50px;
	border: 1px solid var(--q8ps-teal);
	border-radius: 999px;
	background: linear-gradient(135deg, #00c5ad, #008f7d);
	color: #fff;
	font-size: 15px;
	font-weight: 900;
	box-shadow: 0 14px 32px rgba(0, 169, 143, .25);
}

.q8ps-account-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.q8ps-password-field {
	position: relative;
	display: block;
}

.q8ps-password-field button {
	position: absolute;
	inset-inline-end: 8px;
	top: 50%;
	min-height: 34px;
	padding: 0 10px;
	border: 0;
	border-radius: 9px;
	background: #ecf5f5;
	color: var(--q8ps-teal-dark);
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	transform: translateY(-50%);
	cursor: pointer;
}

.q8ps-account-form small {
	color: #7b8797;
	font-size: 12px;
	font-weight: 700;
}

.q8ps-account-row,
.q8ps-account-switch {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.q8ps-reset-methods {
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0 0 16px;
}

.q8ps-method-toggle {
	margin-bottom: 2px;
}

.q8ps-method-toggle .q8ps-check {
	align-items: center;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid var(--q8ps-border);
	border-radius: 13px;
	background: #f8fbfc;
}

.q8ps-method-toggle .q8ps-check:has(input:checked) {
	border-color: rgba(0, 169, 143, .42);
	background: #eefdfb;
	color: var(--q8ps-teal-dark) !important;
}

.q8ps-check {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start;
	gap: 9px !important;
	color: #526076 !important;
	font-size: 13px !important;
	font-weight: 750 !important;
	line-height: 1.45;
}

.q8ps-check input {
	flex: 0 0 auto;
	margin-top: 2px;
	accent-color: var(--q8ps-teal);
}

.q8ps-account-row a,
.q8ps-account-switch button,
.q8ps-link-button {
	border: 0;
	background: transparent;
	color: var(--q8ps-teal-dark);
	font-size: 13px;
	font-weight: 900;
	text-decoration: none;
	cursor: pointer;
}

.q8ps-account-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 50px;
	margin: 4px 0 0;
	border: 1px solid var(--q8ps-teal);
	border-radius: 999px;
	background: linear-gradient(135deg, #00c5ad, #008f7d);
	color: #fff;
	font-size: 15px;
	font-weight: 900;
	box-shadow: 0 14px 32px rgba(0, 169, 143, .25);
	cursor: pointer;
}

.q8ps-account-primary:hover,
.q8ps-account-primary:focus {
	background: linear-gradient(135deg, #00bda5, #007c70);
	color: #fff;
	outline: none;
}

.q8ps-account-primary:disabled {
	opacity: .62;
	cursor: wait;
}

.q8ps-account-secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 18px;
	border: 1px solid rgba(12, 148, 144, .32);
	border-radius: 14px;
	background: #fff;
	color: #087875;
	font-size: 15px;
	font-weight: 800;
	cursor: pointer;
}

.q8ps-account-secondary:hover,
.q8ps-account-secondary:focus {
	background: #eefdfb;
	border-color: rgba(12, 148, 144, .58);
	color: #06625f;
}

.q8ps-account-switch {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid rgba(15, 23, 42, .08);
	color: #657386;
	font-size: 14px;
}

.q8ps-account-status {
	min-height: 20px;
	color: #526076;
	font-size: 13px;
	font-weight: 750;
	line-height: 1.45;
}

.q8ps-account-status.is-error,
.q8ps-field-error {
	color: #b42318;
}

.q8ps-account-status.is-success {
	color: #007f72;
}

.q8ps-field-error {
	display: block;
	font-size: 12px;
	font-weight: 800;
}

.q8ps-account-form label.has-error input {
	border-color: rgba(180, 35, 24, .56);
	background: #fff8f7;
}

.q8ps-phone-combo.has-error .q8ps-field-error {
	grid-column: 1 / -1;
	margin-top: -2px;
}

.q8ps-field-error a {
	color: #007f72;
	font-weight: 900;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.q8ps-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.q8ps-account-benefits ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 30px 0 0;
	padding: 0;
	list-style: none;
}

.q8ps-account-benefits li {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 12px 14px;
	border-radius: 14px;
	background: #fff;
	color: #203047;
	font-size: 14px;
	font-weight: 850;
	box-shadow: 0 10px 26px rgba(15, 23, 42, .07);
}

.q8ps-account-benefits li::before {
	content: "";
	display: inline-block;
	width: 9px;
	height: 9px;
	margin-inline-end: 10px;
	border-radius: 50%;
	background: var(--q8ps-teal);
	box-shadow: 0 0 0 5px rgba(0, 169, 143, .12);
}

.q8ps-account-note {
	margin: 22px 0 0 !important;
	padding: 12px 14px;
	border-radius: 12px;
	background: #f4f8fa;
	color: #657386 !important;
	font-size: 12px !important;
	font-weight: 750;
	line-height: 1.5 !important;
}

.q8ps-checkout-login.q8ps-account-card {
	--q8ps-teal: #00a98f;
	--q8ps-teal-dark: #007f72;
	--q8ps-navy: #071224;
	--q8ps-muted: #64748b;
	--q8ps-border: #dfe8ee;
	width: min(100%, 720px);
	max-width: 720px;
	margin: 0 auto 24px;
	padding: 24px;
	box-sizing: border-box;
}

form.q8ps-checkout-login-form.login:not([style*="display: none"]):not([style*="display:none"]) {
	display: flex !important;
}

.q8ps-checkout-login-intro,
.q8ps-checkout-account-note {
	margin: 0 0 14px;
	color: #64748b;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.55;
}

.q8ps-checkout-account-extra {
	margin-top: 14px;
	padding: 18px;
	border: 1px solid rgba(15, 23, 42, .08);
	border-radius: 16px;
	background: #f8fbfc;
}

.q8ps-checkout-phone-label {
	display: block;
	margin: 0 0 8px;
	color: #26364d;
	font-size: 13px;
	font-weight: 850;
}

.q8ps-checkout-phone-combo {
	margin-bottom: 14px;
}

.q8ps-checkout-confirm-password {
	margin: 0 !important;
}

.q8ps-checkout-confirm-password input {
	min-height: 48px;
	border: 1px solid var(--q8ps-border, #dfe8ee);
	border-radius: 13px;
	background: #fff;
	box-shadow: none;
}

[dir="rtl"] .q8ps-account-entry,
body.rtl .q8ps-account-entry {
	text-align: right;
}

[dir="rtl"] .q8ps-account-form input[dir="ltr"],
body.rtl .q8ps-account-form input[dir="ltr"] {
	text-align: left;
}

.q8ps-account-modal[hidden] {
	display: none !important;
}

.q8ps-account-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	padding: 18px;
	background: rgba(7, 18, 36, .48);
}

.q8ps-account-modal__panel {
	width: min(100%, 430px);
	padding: 26px;
	border: 1px solid rgba(15, 23, 42, .08);
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 28px 70px rgba(15, 23, 42, .22);
}

.q8ps-account-modal__panel h3 {
	margin: 0 0 10px;
	color: var(--q8ps-navy);
	font-size: 24px;
	font-weight: 900;
	line-height: 1.15;
}

.q8ps-account-modal__panel p {
	margin: 0 0 18px;
	color: var(--q8ps-muted);
	font-size: 14px;
	line-height: 1.6;
}

.q8ps-account-modal-fields {
	display: grid;
	gap: 12px;
	margin: 0 0 14px;
}

.q8ps-account-modal-fields label {
	display: grid;
	gap: 7px;
	margin: 0;
	color: #26364d;
	font-size: 13px;
	font-weight: 850;
}

.q8ps-account-modal-fields input {
	width: 100%;
	height: 48px;
	margin: 0;
	border: 1px solid var(--q8ps-border);
	border-radius: 13px;
	background: #f8fbfc;
	color: var(--q8ps-navy);
	font-size: 15px;
	font-weight: 850;
	box-shadow: none;
}

.q8ps-account-modal-fields input:focus {
	border-color: rgba(0, 169, 143, .55);
	background: #fff;
	box-shadow: 0 0 0 4px rgba(0, 169, 143, .12);
	outline: none;
}

.q8ps-account-modal-phone {
	grid-template-columns: minmax(96px, 118px) minmax(0, 1fr);
	gap: 8px;
}

.q8ps-modal-country {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	height: 44px;
	padding: 0 10px;
	border: 1px solid var(--q8ps-border);
	border-radius: 11px;
	background: #eefdfb;
	color: var(--q8ps-teal-dark);
	font-size: 13px;
	font-weight: 900;
	white-space: nowrap;
}

.q8ps-account-modal-phone input {
	height: 44px;
	border-radius: 11px;
}

.q8ps-account-modal-error {
	min-height: 18px;
	margin: 0 0 14px;
	color: #b42318;
	font-size: 12px;
	font-weight: 850;
	line-height: 1.4;
}

.q8ps-account-modal-fields label.has-error input,
.q8ps-account-modal-phone.has-error input {
	border-color: rgba(180, 35, 24, .56);
	background: #fff8f7;
}

.q8ps-account-modal__actions {
	display: flex;
	justify-content: center;
	gap: 12px;
}

.q8ps-account-modal__actions .q8ps-account-primary,
.q8ps-account-modal__actions .q8ps-account-secondary {
	flex: 1 1 0;
	width: 100%;
	min-width: 0;
	min-height: 50px;
	margin: 0;
}

.q8ps-account-modal__actions .q8ps-account-secondary {
	min-height: 50px;
	padding: 0 22px;
	border: 1px solid rgba(0, 169, 143, .24);
	border-radius: 999px;
	background: #eefdfb;
	color: var(--q8ps-teal-dark);
	font-size: 15px;
	font-weight: 900;
	cursor: pointer;
}

.q8ps-account-modal__actions .q8ps-account-secondary:hover,
.q8ps-account-modal__actions .q8ps-account-secondary:focus {
	background: #def8f4;
	outline: none;
}

@media (max-width: 900px) {
	.q8ps-account-entry {
		grid-template-columns: 1fr;
		gap: 18px;
		margin-top: 6px;
	}

	.q8ps-account-card {
		order: 1;
		padding: 24px;
	}

	.q8ps-checkout-login.q8ps-account-card {
		padding: 22px;
	}

	.q8ps-account-benefits {
		order: 2;
		min-height: 0;
		padding: 26px;
	}
}

@media (max-width: 560px) {
	.q8ps-account-entry {
		margin-inline: -4px;
	}

	.q8ps-account-card,
	.q8ps-account-benefits {
		border-radius: 18px;
		padding: 20px;
	}

	.q8ps-checkout-login.q8ps-account-card,
	.q8ps-checkout-account-extra {
		padding: 18px;
	}

	.q8ps-account-grid,
	.q8ps-account-benefits ul {
		grid-template-columns: 1fr;
	}

	.q8ps-account-row,
	.q8ps-account-switch {
		align-items: flex-start;
		flex-direction: column;
	}

	.q8ps-phone-combo {
		grid-template-columns: 1fr;
	}

	.q8ps-account-modal__panel {
		padding: 22px;
	}

	.q8ps-account-modal__actions {
		flex-direction: column;
	}

	.q8ps-account-modal__actions .q8ps-account-primary,
	.q8ps-account-modal__actions .q8ps-account-secondary {
		width: 100%;
	}
}