/* ==========================================================================
 * ن۱۵۱ — sign-in popup (.kj-authm) — overlay furniture ONLY.
 *
 * The popup's card reuses the standalone screen verbatim: the markup carries
 * .kj-auth-surface / .kj-auth-intro / .kj-auth-seal / .kj-auth-switch inside a
 * .kj-auth-screen scope, and auth.css is enqueued alongside this sheet — so
 * the forms can never drift from the my-account page again (owner feedback:
 * «فرم ورود و ثبت‌نام یک چیز جدید بود اصلاً»). ما in این ورقه فقط قابِ
 * نمایش است: بک‌دراپ شیشه‌ای، وسط‌چینی، اسکرول و دکمهٔ بستن.
 * ========================================================================== */

.kj-authm-open { overflow: hidden; }

.kj-authm[hidden] { display: none !important; }
.kj-authm { position: fixed; inset: 0; z-index: 99990; }

/* ---------- ن۱۵۲ backdrop = همان لایهٔ سبد خرید (.kj-overlay) ----------
 * مالک: «تار بودنش باید عین بازشوندهٔ سبد خرید باشد، بدون رنگ برند». قبلاً
 * تینتِ color-mix برند کار می‌شد و در مرورگرهای webkit قدیمی اصلاً تار
 * نبود چون -webkit- prefix نداشت. الان همان نسخهٔ header.css:.kj-overlay. */
.kj-authm__backdrop {
  position: absolute; inset: 0;
  background: rgba(18, 19, 26, .5);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  animation: kj-authm-fade .28s ease both;
}
@keyframes kj-authm-fade { from { opacity: 0 } to { opacity: 1 } }

/* ---------- positioner: centred on every viewport (never a sheet) ---------- */
.kj-authm__wrap {
  position: relative; height: 100%;
  display: grid; place-items: center;
  padding: 18px 14px;
  overflow-y: auto; overscroll-behavior: contain;
}

/* ---------- card: geometry + shadow; the LOOK is auth.css's surface ---------- */
.kj-authm__scope { width: min(100%, 460px); min-width: 0; }
.kj-authm__scope .kj-authm__card {
  width: 100%;
  max-height: calc(100vh - 36px); max-height: calc(100svh - 36px);
  overflow-y: auto; overscroll-behavior: contain;
  outline: none;
  animation: kj-authm-zoom .34s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes kj-authm-zoom { from { transform: scale(.96); opacity: 0 } to { transform: none; opacity: 1 } }

/* close chip — گوشهٔ «شروعِ» خط (در RTL: چپ) تا روی سیلِ بالای intro نیفتد؛
 * در ن۱۵۲ زمانی که ✕ inline-start نشست، با سیلِ قفل سمت راست intro تداخل داشت. */
.kj-authm__close {
  position: absolute; top: 12px; inset-inline-end: 12px; z-index: 2;
  display: grid; place-items: center; width: 36px; height: 36px; padding: 0;
  border: 1px solid color-mix(in srgb, var(--kj-primary, #e11d38) 12%, #fff);
  border-radius: 50%; cursor: pointer;
  color: var(--kj-muted, #4a5264); background: #fff;
  box-shadow: 0 4px 12px rgba(60, 42, 53, .07);
  transition: background .2s ease, transform .15s ease;
}
.kj-authm__close:hover {
  background: color-mix(in srgb, var(--kj-primary, #e11d38) 5%, #fff);
  transform: rotate(90deg);
}

/* eyebrows/title margins inside the floating card */
.kj-authm__scope .kj-auth-intro { margin-top: 6px; }

@media (max-width: 600px) {
  .kj-authm__wrap { padding: 14px 12px; }
  .kj-authm__scope { width: min(100%, 460px); }
}
/* ---------- ن۱۵۴ حالت انتظار AJAX (سواپ مرحله بدون خروج از صفحه) ---------- */
.kj-authm__card--busy { pointer-events: none; }
.kj-authm__card--busy .kj-authm__body { opacity: .55; transition: opacity .16s ease; }
.kj-authm__body { transition: opacity .16s ease; }
.kj-authm__card--busy .kj-authm__close { pointer-events: auto; } /* بستن همیشه ممکن است */

@media (prefers-reduced-motion: reduce) {
  .kj-authm__backdrop, .kj-authm__card, .kj-authm__close { transition: none !important; animation-duration: .01s !important; }
}