/*
 * دروازه‌ی دانلود افزونه.
 *
 * ⚠️ همان قراردادِ .wsu-modal در assets/css/signup.css را دنبال می‌کند
 * (dialog، شیت از پایین روی موبایل، dvh با vh به‌عنوان پشتیبان،
 * safe-area-inset، قفلِ اسکرولِ iOS) — عمداً کپی نشده و از نو نوشته
 * نشده، فقط همان تصمیم‌های سنجیده تکرار شده‌اند.
 *
 * رنگ: سبزِ برند. پاپ‌آپِ بنفشِ قبلی به‌خواسته‌ی مالک کنار گذاشته شد.
 */
.wsg,.wsg *{box-sizing:border-box}
.wsg:not([open]){display:none}
.wsg{
  display:block;position:fixed;padding:0;border:0;background:transparent;
  /* dvh نه vh: نوار آدرس iOS ارتفاع را عوض می‌کند */
  max-height:92vh;max-height:92dvh;
  /* 100% نه 100vw: 100vw عرضِ نوار اسکرول را هم می‌شمارد و روی
     ویندوز/لینوکس خودش اسکرول افقی می‌سازد */
  max-width:min(430px,100%);width:100%;margin:auto;color:inherit
}
.wsg::backdrop{background:rgba(16,24,40,.55);backdrop-filter:blur(3px)}
.wsg__in{
  position:relative;overflow:hidden auto;background:#fff;border-radius:18px;
  max-height:92dvh;-webkit-overflow-scrolling:touch;
  box-shadow:0 24px 60px -12px rgba(16,24,40,.3)
}
/* ⚠️ [hidden] در برابر display:flex می‌بازد — باید صریح باشد */
.wsg__steps[hidden]{display:none}
.wsg__steps{display:flex;gap:3px;position:absolute;inset:0 0 auto;z-index:2;
  border-radius:18px 18px 0 0;overflow:hidden}
.wsg__steps i{flex:1;height:3px;background:#e6e9ef}
.wsg__steps i.on{background:#0ace8c}

.wsg__x{position:absolute;top:10px;left:10px;width:44px;height:44px;
  display:grid;place-items:center;border:0;border-radius:50%;
  background:rgba(0,0,0,.05);color:#333;cursor:pointer;padding:0;z-index:3}
.wsg__x:hover{background:rgba(0,0,0,.1)}
.wsg__x:focus-visible{outline:2px solid #06b578;outline-offset:2px}

.wsg__head{padding:26px 22px 0;text-align:center}
.wsg__head h2{font-size:18px;margin:0 0 6px;font-weight:600;line-height:1.7}
.wsg__head p{font-size:13.5px;color:#6b7280;margin:0;line-height:1.8}
.wsg__icon{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;
  margin:0 auto 14px;background:#e8faf3;color:#06b578}
.wsg__body{padding:18px 22px 22px}
.wsg__foot{padding:0 22px 22px;text-align:center;font-size:12.5px;color:#6b7280}
.wsg__foot a{color:#06b578}

/* کارت‌های انتخاب */
.wsg-pick{display:grid;gap:10px}
.wsg-pick button{font:inherit;text-align:right;display:flex;gap:13px;align-items:flex-start;
  width:100%;padding:16px;border:1.5px solid #e6e9ef;border-radius:14px;background:#fff;
  cursor:pointer;transition:border-color .15s,background .15s}
.wsg-pick button:hover{border-color:#0ace8c;background:#e8faf3}
.wsg-pick button:focus-visible{outline:2px solid #06b578;outline-offset:2px}
.wsg-pick .t{font-weight:600;font-size:15px;display:block;margin-bottom:2px}
.wsg-pick .s{font-size:12.5px;color:#6b7280;line-height:1.7;display:block}
.wsg-pick .ic{flex:0 0 40px;height:40px;border-radius:11px;display:grid;place-items:center;
  background:#e8faf3;color:#06b578}

/* فرم */
.wsg label{display:block;font-size:13px;font-weight:600;margin:0 0 6px}
.wsg-f{margin-bottom:14px}
.wsg input[type=text],.wsg input[type=password],.wsg input[type=tel]{
  width:100%;font:inherit;padding:13px 14px;border:1.5px solid #e6e9ef;
  border-radius:12px;background:#fff;color:inherit}
.wsg input:focus{outline:0;border-color:#0ace8c;box-shadow:0 0 0 3px rgba(10,206,140,.16)}
.wsg-hint{font-size:12px;color:#6b7280;margin:5px 0 0;line-height:1.7}
.wsg-otp{letter-spacing:.5em;text-align:center;font-size:20px;font-weight:600;direction:ltr}
.wsg-go{width:100%;font:inherit;font-weight:600;font-size:15.5px;padding:15px;border:0;
  border-radius:12px;background:#0ace8c;color:#fff;cursor:pointer;margin-top:4px}
.wsg-go:hover:not(:disabled){background:#06b578}
.wsg-go:disabled{opacity:.55;cursor:not-allowed}
.wsg-go:focus-visible{outline:2px solid #14181f;outline-offset:2px}
.wsg-ghost{width:100%;font:inherit;padding:12px;border:0;background:transparent;
  color:#6b7280;cursor:pointer;font-size:13.5px;margin-top:8px}
.wsg-ghost:hover:not(:disabled){color:#14181f}
.wsg-ghost:disabled{opacity:.5;cursor:not-allowed}
.wsg-err{background:#fff1f0;color:#b42318;border:1px solid #ffd2cd;border-radius:11px;
  padding:11px 13px;font-size:13px;margin-bottom:14px;line-height:1.8}
.wsg-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:420px){.wsg-two{grid-template-columns:1fr}}

.wsg-ok{text-align:center}
.wsg-ok .big{width:66px;height:66px;border-radius:50%;background:#e8faf3;color:#06b578;
  display:grid;place-items:center;margin:4px auto 14px}
.wsg-note{background:#e8faf3;border:1px solid #c8f0e0;border-radius:12px;padding:13px;
  font-size:13px;margin:14px 0;text-align:right;line-height:1.9}
.wsg-note b{font-weight:600}

/*
 * ⚠️ دکمه‌ی اصلی چسبیده به پایینِ شیت.
 *
 * گزارشِ کد ریویو: روی آیفون صفحه‌کلید که بالا می‌آید «ادامه» و
 * «تأیید و دانلود» را می‌پوشاند، و چون `body{position:fixed}` است
 * مرورگر هم خودش صفحه را جابه‌جا نمی‌کند. با sticky، دکمه همیشه در
 * دیدِ کادرِ اسکرول‌شونده می‌ماند.
 */
@media (max-width:575px){
  .wsg-go{position:sticky;bottom:0;z-index:2;
    box-shadow:0 -10px 16px -8px rgba(255,255,255,.95)}
}

/* موبایل: شیت از پایین */
@media (max-width:575px){
  .wsg{max-width:100%;max-height:94vh;max-height:94dvh;margin:auto auto 0}
  .wsg__in{border-radius:18px 18px 0 0;max-height:94vh;max-height:94dvh;
    padding-bottom:calc(6px + env(safe-area-inset-bottom))}
  .wsg__steps{border-radius:18px 18px 0 0}
}
/* قفل اسکرول پس‌زمینه — در iOS تنها position:fixed واقعاً کار می‌کند */
body.wsg-open{position:fixed;width:100%;overflow:hidden}
@media (prefers-reduced-motion:no-preference){
  .wsg[open]{animation:wsgPop .22s cubic-bezier(.2,.8,.3,1)}
  @keyframes wsgPop{from{opacity:0;transform:translateY(14px) scale(.98)}}
}
.wsg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/*
 * ── بازخوردِ «گرفتم، دارم باز می‌کنم» ──
 *
 * ⚠️ این شیت در <head> است، پس استایل همان لحظه‌ی کلیک حاضر است — حتی
 * پیش از اینکه plugin-gate.js اجرا شود. راه‌اندازِ درون‌خطی فقط همین
 * صفت را می‌گذارد (inc/plugin-gate.php:websima_gate_boot).
 *
 * بدونِ این، کاربری که پیش از بارگذاریِ اسکریپت روی دکمه می‌زند هیچ
 * نشانه‌ای نمی‌گیرد و فکر می‌کند دکمه خراب است — همان چیزی که روی سایتِ
 * زنده گزارش شد.
 *
 * ⚠️ ::after و نه ::before: خودِ `.button` در style.css:734 از ::before
 * برای انیمیشنِ پرشدنِ هاور استفاده می‌کند.
 */
[data-wsg-dl][data-wsg-wait]{cursor:progress}
[data-wsg-dl][data-wsg-wait]::after{
  content:'';flex:0 0 14px;width:14px;height:14px;margin-inline-start:8px;
  border-radius:50%;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;
  animation:wsgSpin .7s linear infinite
}
@keyframes wsgSpin{to{transform:rotate(360deg)}}
/* ⚠️ حرکت را حذف نکن — کاربر باید بفهمد چیزی در جریان است؛ فقط آرامش کن */
@media (prefers-reduced-motion:reduce){
  [data-wsg-dl][data-wsg-wait]::after{animation-duration:2.2s}
}

/*
 * ── دکمه‌ی دانلود: مستقل از `.button`ِ قالب ──
 *
 * ⚠️ چرا کلاسِ خودش (۱۴۰۵/۰۷/۰۹).
 *
 * `.button` قالب یک `::before` دارد که روی هاور از عرضِ ۰ به ۱۰۰٪
 * می‌رسد (style.css:734) — یعنی ۰٫۳ ثانیه انیمیشن روی دکمه‌ای که کلِ
 * ادعایش «آنی» بودن است. `overflow:hidden` همان قاعده هم اسپینرِ
 * بازخورد را می‌بُرید.
 *
 * `<button>` است نه `<span>`: با Tab فوکوس می‌گیرد، با Enter و Space
 * کار می‌کند، و برای صفحه‌خوان دکمه است. نسخه‌ی قبلی هیچ‌کدام نبود.
 *
 * این شیت در <head> است، پس دکمه از اولین رنگ درست دیده می‌شود.
 */
.wsg-dl{
  /* ⚠️ فاصله‌ی پایین: `.button mb-3`ِ قبلی این را از بوت‌استرپ می‌گرفت و
     با کلاسِ اختصاصی از دست رفت — دکمه به دکمه‌های زیرش چسبیده بود. */
  width:100%;margin:0 0 1rem;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:11px 20px;border:0;border-radius:50px;cursor:pointer;
  font:inherit;font-weight:600;font-size:15px;line-height:1.6;color:#fff;
  background:linear-gradient(to bottom,#12e39b,#0ace8c);
  box-shadow:0 2px 10px -1px rgba(10,206,140,.45);
  /* ⚠️ بدونِ transition روی رنگ: هاور باید فوری باشد، نه کشیده */
  user-select:none;-webkit-tap-highlight-color:transparent
}
.wsg-dl:hover{background:linear-gradient(to bottom,#0ace8c,#06b578)}
.wsg-dl:active{transform:translateY(1px)}
.wsg-dl:focus-visible{outline:2px solid #14181f;outline-offset:2px}
.wsg-dl i{font-size:17px;line-height:1}
/* ⚠️ حداقل ۴۴ پیکسل ارتفاع: کمتر از این روی موبایل هدفِ لمسِ قابل‌اتکایی نیست */
@media (max-width:575px){.wsg-dl{min-height:48px;font-size:15.5px}}