/* Allis auth: login/register modal + My Account forms. LTR first, logical properties for RTL. */
.asp-auth, form.woocommerce-ResetPassword.lost_reset_password {
	--asp-a-radius: var(--theme-form-field-border-radius, 10px);
	--asp-a-h: var(--theme-form-field-height, 46px);
	--asp-a-border: color-mix(in srgb, var(--theme-text-color, #333) 30%, transparent);
	--asp-a-btn-bg: var(--theme-button-background-initial-color, var(--theme-palette-color-1, #2872fa));
	--asp-a-btn-tx: var(--theme-button-text-initial-color, #fff);
	--asp-a-muted: rgba(127, 127, 127, .9);
	color: var(--theme-text-color, inherit);
}

/* card on the page */
.asp-auth--page, form.woocommerce-ResetPassword.lost_reset_password {
	box-sizing: border-box; width: 100%; max-width: 460px; margin: 28px auto; padding: 28px;
	background: var(--theme-palette-color-8, #fff); border: 1px solid var(--theme-border-color, rgba(127, 127, 127, .25));
	border-radius: 16px; box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
}

/* tabs */
.asp-auth__tabs { display: none; }
.asp-auth--js .asp-auth__tabs {
	display: grid; grid-template-columns: 1fr 1fr; position: relative; isolation: isolate; padding: 4px; margin-block-end: 22px;
	background: color-mix(in srgb, var(--theme-text-color, #333) 8%, transparent); border-radius: calc(var(--asp-a-radius) + 4px);
}
.asp-auth__tabs::before {
	content: ""; position: absolute; z-index: -1; inset-block: 4px; inset-inline-start: 4px; width: calc(50% - 4px);
	background: var(--theme-palette-color-8, #fff); border-radius: var(--asp-a-radius);
	box-shadow: 0 1px 3px rgba(15, 23, 42, .16), 0 1px 2px rgba(15, 23, 42, .08); transition: transform .26s cubic-bezier(.4, 0, .2, 1);
}
.asp-auth[data-tab="register"] .asp-auth__tabs::before { transform: translateX(100%); }
[dir="rtl"] .asp-auth[data-tab="register"] .asp-auth__tabs::before { transform: translateX(-100%); }
.asp-auth__tab {
	appearance: none; border: 0; cursor: pointer; min-height: 40px; padding: 8px 14px; border-radius: var(--asp-a-radius);
	font: inherit; font-size: 14.5px; font-weight: 600; color: color-mix(in srgb, var(--theme-text-color, #333) 65%, transparent); background: transparent;
	transition: color .2s;
}
.asp-auth__tab:hover { color: var(--theme-text-color, #333); background: transparent; }
.asp-auth__tab.is-active, .asp-auth__tab.is-active:hover { color: var(--asp-a-btn-bg); background: transparent; }
.asp-auth__tab:focus-visible, .asp-auth__link:focus-visible, .asp-auth__eye:focus-visible, .asp-auth-modal__close:focus-visible { outline: 2px solid var(--asp-a-btn-bg); outline-offset: 2px; }
/* panels */
.asp-auth .u-columns { display: block; margin: 0; }
.asp-auth--page .u-columns, .asp-auth--page .u-column1, .asp-auth--page .u-column2, .asp-auth--page form { margin-inline: 0 !important; padding-inline: 0 !important; }
.asp-auth .u-column1, .asp-auth .u-column2 { float: none; width: 100%; max-width: none; padding: 0; margin: 0; }
.asp-auth--js .u-column1:not(.is-active), .asp-auth--js .u-column2:not(.is-active) { display: none; }
.asp-auth--js .u-column1 > h2, .asp-auth--js .u-column2 > h2 { display: none; }
.asp-auth .u-column1.from-start, .asp-auth .u-column2.from-end { animation: asp-auth-in .26s ease both; }
.asp-auth .u-column1.from-start { --asp-a-x: -18px; }
.asp-auth .u-column2.from-end { --asp-a-x: 18px; }
@keyframes asp-auth-in { from { opacity: 0; transform: translateX(var(--asp-a-x, 0)); } to { opacity: 1; transform: none; } }
[dir="rtl"] .asp-auth .u-column1.from-start { --asp-a-x: 18px; }
[dir="rtl"] .asp-auth .u-column2.from-end { --asp-a-x: -18px; }

/* forms */
.asp-auth form.woocommerce-form.woocommerce-form { border: 0; padding: 0; margin: 0; background: none; }

.asp-auth .form-row, form.woocommerce-ResetPassword.lost_reset_password .form-row { margin: 0 0 16px; padding: 0; width: 100%; float: none; }
.asp-auth label, form.woocommerce-ResetPassword.lost_reset_password label { display: block; margin: 0 0 6px; font-size: 13.5px; font-weight: 600; }
.asp-auth .required, form.woocommerce-ResetPassword.lost_reset_password .required { color: var(--asp-a-muted); font-weight: 400; text-decoration: none; }
.asp-auth input.input-text, form.woocommerce-ResetPassword.lost_reset_password input.input-text {
	display: block; box-sizing: border-box; width: 100%; height: var(--asp-a-h); padding-block: 0; padding-inline: 14px;
	border: 1.5px solid var(--asp-a-border); border-radius: var(--asp-a-radius); background: transparent; color: inherit; font-size: 15px;
	transition: border-color .15s, box-shadow .15s;
}
.asp-auth input.input-text:focus, form.woocommerce-ResetPassword.lost_reset_password input.input-text:focus {
	outline: 0; border-color: var(--asp-a-btn-bg); box-shadow: 0 0 0 3px color-mix(in srgb, var(--asp-a-btn-bg) 22%, transparent);
}
.asp-auth__pw { position: relative; display: block; }
.asp-auth__pw input.input-text { padding-inline-end: 46px; }
.asp-auth__eye {
	position: absolute; inset-block: 0; inset-inline-end: 4px; width: 40px; display: flex; align-items: center; justify-content: center;
	background: none; border: 0; padding: 0; cursor: pointer; color: inherit; opacity: .6;
}
.asp-auth__eye:hover, .asp-auth__eye.is-on { opacity: 1; }
.asp-auth .woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-weight: 500; cursor: pointer; }
.asp-auth .woocommerce-form-login__rememberme input[type="checkbox"] {
	appearance: none; -webkit-appearance: none; position: relative; flex: none; display: inline-block; margin: 0; width: 18px; height: 18px;
	border: 1.5px solid var(--asp-a-border); border-radius: 5px; background: transparent; cursor: pointer; transition: background .15s, border-color .15s;
}
.asp-auth .woocommerce-form-login__rememberme input[type="checkbox"]:checked { background: var(--asp-a-btn-bg); border-color: var(--asp-a-btn-bg); }
.asp-auth .woocommerce-form-login__rememberme input[type="checkbox"]:checked::after {
	content: ""; position: absolute; inset-block-start: 1px; inset-inline-start: 5px; width: 5px; height: 10px;
	border: solid var(--asp-a-btn-tx); border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.asp-auth .woocommerce-form-login__rememberme input[type="checkbox"]:focus-visible { outline: 2px solid var(--asp-a-btn-bg); outline-offset: 2px; }
.asp-auth .show-password-input, .asp-auth .password-input > .show-password-input { display: none !important; }
.asp-auth .password-input { display: block; }

/* remember + button layout */
.asp-auth form.login > p.form-row:has(.woocommerce-form-login__rememberme) { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; justify-content: space-between; }
.asp-auth form.login > p.form-row::before, .asp-auth form.login > p.form-row::after { display: none; }
.asp-auth form.login .woocommerce-form-login__submit { order: 3; flex: 0 0 100%; }
.asp-auth .woocommerce-button.button, form.woocommerce-ResetPassword.lost_reset_password .woocommerce-Button {
	display: block; box-sizing: border-box; width: 100%; min-height: 48px; margin: 0; padding: 10px 18px; float: none;
	border: 0; border-radius: var(--theme-button-border-radius, var(--asp-a-radius)); font-size: 15px; font-weight: 700; cursor: pointer;
	color: var(--asp-a-btn-tx); background: var(--asp-a-btn-bg); transition: filter .15s;
}
.asp-auth .woocommerce-button.button:hover, form.woocommerce-ResetPassword.lost_reset_password .woocommerce-Button:hover { filter: brightness(1.08); color: var(--asp-a-btn-tx); background: var(--asp-a-btn-bg); }
.asp-auth .woocommerce-button.button:disabled { opacity: .6; cursor: wait; }
.asp-auth .lost_password, form.woocommerce-ResetPassword.lost_reset_password .lost_password { margin: 14px 0 0; text-align: center; font-size: 14px; }
.asp-auth a { text-underline-offset: 3px; }
.asp-auth .woocommerce-privacy-policy-text { font-size: 12.5px; opacity: .7; margin: 0 0 14px; }
.asp-auth form p:not(.form-row):not(.asp-auth__switch):not(.lost_password) { font-size: 13.5px; opacity: .8; margin: 0 0 14px; }

/* footer switch */
.asp-auth__switch { display: none; margin: 18px 0 0; padding-block-start: 16px; border-block-start: 1px solid var(--theme-border-color, rgba(127, 127, 127, .25)); text-align: center; font-size: 14px; }
.asp-auth--js .asp-auth__switch { display: block; }
.asp-auth__link { background: none; border: 0; padding: 0; font: inherit; font-weight: 700; color: var(--asp-a-btn-bg); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* alerts (inline messages, rendered via AJAX) */
.asp-auth__alert {
	display: flex; align-items: flex-start; gap: 12px;
	margin: 0 0 18px; padding: 14px 12px 14px 14px; border-radius: calc(var(--asp-a-radius) + 2px);
	background: #fef2f2; border: 1px solid #f5b5b5;
	background: color-mix(in srgb, #dc2626 7%, #fff); border: 1px solid color-mix(in srgb, #dc2626 28%, transparent);
	color: #7f1d1d; font-size: 14px; line-height: 1.55;
	box-shadow: 0 8px 22px rgba(220, 38, 38, .10);
	box-shadow: 0 8px 22px color-mix(in srgb, #dc2626 10%, transparent);
	animation: asp-alert-in .25s ease;
}
.asp-auth__alert.is-ok {
	background: #f0fdf4; border-color: #a7e0b9;
	background: color-mix(in srgb, #16a34a 8%, #fff); border-color: color-mix(in srgb, #16a34a 30%, transparent);
	color: #14532d; box-shadow: 0 8px 22px rgba(22, 163, 74, .10); box-shadow: 0 8px 22px color-mix(in srgb, #16a34a 10%, transparent);
}
.asp-auth__alert[hidden] { display: none; }
.asp-auth__alert-icon { flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #dc2626; color: #fff; }
.asp-auth__alert.is-ok .asp-auth__alert-icon { background: #16a34a; }
.asp-auth__alert-body { flex: 1 1 auto; min-width: 0; }
.asp-auth__alert-body strong { display: block; margin-block-end: 2px; font-weight: 700; color: inherit; }
.asp-auth__alert-body p { margin: 0; }
.asp-auth__alert-x { flex: 0 0 auto; background: none; border: 0; padding: 0 4px; font-size: 22px; line-height: 1; color: inherit; opacity: .5; cursor: pointer; }
.asp-auth__alert-x:hover, .asp-auth__alert-x:focus-visible { opacity: 1; }
.asp-auth__alert.is-shake { animation: asp-shake .42s ease; }
.asp-auth input[aria-invalid="true"] { border-color: #dc2626 !important; box-shadow: 0 0 0 3px rgba(220, 38, 38, .16) !important; }
.asp-auth input[aria-invalid="true"] { border-color: #dc2626 !important; box-shadow: 0 0 0 3px color-mix(in srgb, #dc2626 16%, transparent) !important; }
.asp-auth button.is-busy { opacity: .75; cursor: progress; }
@keyframes asp-alert-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes asp-shake { 10%, 90% { transform: translateX(-1px); } 20%, 80% { transform: translateX(2px); } 30%, 50%, 70% { transform: translateX(-4px); } 40%, 60% { transform: translateX(4px); } }
@media (prefers-reduced-motion: reduce) { .asp-auth__alert, .asp-auth__alert.is-shake { animation: none; } }
.asp-auth .woocommerce-error, .asp-auth .woocommerce-message, .asp-auth .woocommerce-info { margin-block: 0 16px; }

/* modal */
html.asp-auth-lock { overflow: hidden; }
.asp-auth-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity .18s ease; }
.asp-auth-modal[hidden] { display: none; }
.asp-auth-modal.is-open { opacity: 1; }
.asp-auth-modal__overlay { position: absolute; inset: 0; background: rgba(15, 23, 42, .55); backdrop-filter: blur(2px); }
.asp-auth-modal__dialog {
	position: relative; box-sizing: border-box; width: 100%; max-width: 440px; max-height: calc(100vh - 32px); overflow: auto; padding: 32px 28px 26px;
	background: var(--theme-palette-color-8, #fff); color: var(--theme-text-color, inherit); border-radius: 16px;
	box-shadow: 0 24px 70px rgba(15, 23, 42, .35); transform: translateY(10px) scale(.97); transition: transform .2s ease; outline: 0;
	scrollbar-width: thin;
}
.asp-auth-modal.is-open .asp-auth-modal__dialog { transform: none; }
.asp-auth-modal__close {
	position: absolute; inset-block-start: 10px; inset-inline-end: 10px; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
	border: 0; border-radius: 50%; background: transparent; color: inherit; opacity: .6; cursor: pointer; padding: 0; transition: opacity .15s, background .15s;
}
.asp-auth-modal__close:hover { opacity: 1; background: color-mix(in srgb, var(--theme-text-color, #333) 8%, transparent); }
.asp-auth-modal__close svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.asp-auth--modal { margin: 0; padding: 0; border: 0; box-shadow: none; max-width: none; }

@media (max-width: 480px) {
	.asp-auth--page, form.woocommerce-ResetPassword.lost_reset_password { padding: 20px 16px; margin-block: 16px; }
	.asp-auth-modal { align-items: flex-end; padding: 0; }
	.asp-auth-modal__dialog { max-width: none; border-end-start-radius: 0; border-end-end-radius: 0; padding: 28px 18px 22px; max-height: 92vh; }
}
@media (prefers-reduced-motion: reduce) {
	.asp-auth-modal, .asp-auth-modal__dialog, .asp-auth__tab, .asp-auth__tabs::before { transition: none; }
	.asp-auth .u-column1.from-start, .asp-auth .u-column2.from-end { animation: none; }
}
