/* ── پری‌لودر مشترک سامانه ─────────────────────────────────
   دو المان مستقل:
     #nq-pl   اسپلش هنگام بارگذاری صفحه (لوگو + حلقهٔ چرخان + نوار نامعین)
     #nq-bar  نوار باریک بالای صفحه هنگام رفتن به صفحهٔ بعد / ارسال فرم

   این فایل عمداً جدا از base.css است تا login و error و صفحات پنل
   همگی یک نسخهٔ کش‌شدهٔ واحد را بخوانند و مارک‌آپ داخل HTML تکرار نشود.

   failsafe: انیمیشن nq-pl-fs کاملاً CSS-only است و در ثانیهٔ ۳.۵ اسپلش را
   محو می‌کند — حتی اگر preloader.js اصلاً بارگذاری نشود یا خطا بدهد.

   عمداً از همان اولین نقاشیِ HTML نمایان است (بدون تأخیر/CSS-reveal): بین
   بسته‌شدن صفحهٔ قبلی و رسیدن اولین نقاشیِ صفحهٔ جدید، خودِ مرورگر یک شکاف
   کوتاه دارد که می‌تواند سفید دیده شود — این اسپلش دقیقاً برای پوشاندن
   همان شکاف است، نه فقط برای صفحات کند. عقب‌انداختنِ نمایشش (تجربه شد)
   باعث می‌شود همان شکاف سفید مرورگر لخت دیده شود، نه این‌که چیزی سریع‌تر
   به‌نظر برسد. */

#nq-pl{position:fixed;inset:0;z-index:9998;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 100% at 50% 0,#fff 0,#FAF9F4 62%);
  font-family:'DanaFaNum',Tahoma,Arial,sans-serif;
  transition:opacity .22s ease,visibility 0s linear .22s;
  animation:nq-pl-fs 0s linear 3.5s forwards}
#nq-pl.nq-done{animation:none;opacity:0;visibility:hidden;pointer-events:none}
@keyframes nq-pl-fs{to{opacity:0;visibility:hidden;pointer-events:none}}

/* مدت ورود عمداً کوتاه‌تر از MIN در preloader.js نگه داشته شده (بخش JS را
   ببین) تا وقتی محو شروع می‌شود، ورود قطعاً تمام شده باشد — وگرنه
   animation:none آن را نیمه‌کاره قطع می‌کند و یک «پرش» دیده می‌شود. */
#nq-pl .nq-in{display:flex;flex-direction:column;align-items:center;gap:16px;
  animation:nq-pl-up .18s cubic-bezier(.2,.8,.25,1) both}
#nq-pl.nq-done .nq-in{animation:none;transform:translateY(-6px) scale(.97);opacity:0;
  transition:transform .22s ease,opacity .22s ease}
@keyframes nq-pl-up{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}

#nq-pl .nq-mark{position:relative;width:78px;height:78px;display:flex;align-items:center;justify-content:center}
#nq-pl .nq-ring{position:absolute;inset:0;border-radius:50%;border:2px solid #e4e9f0;
  border-top-color:#C95F2D;animation:nq-pl-spin .85s linear infinite}
#nq-pl .nq-logo{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#C95F2D,#AD4F24);box-shadow:0 10px 26px rgba(201,95,45,.22)}
#nq-pl .nq-logo svg{width:28px;height:28px;display:block;stroke:#fff;fill:none;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@keyframes nq-pl-spin{to{transform:rotate(360deg)}}

#nq-pl .nq-name{font-size:13px;font-weight:600;color:#123D3A;line-height:1.6;text-align:center}
#nq-pl .nq-track{position:relative;width:132px;height:3px;border-radius:3px;background:#e6eaf0;
  overflow:hidden;direction:ltr}
#nq-pl .nq-track i{position:absolute;top:0;bottom:0;width:45%;border-radius:3px;
  background:linear-gradient(90deg,#B8D8C0,#C95F2D);
  animation:nq-pl-slide 1.1s cubic-bezier(.55,.1,.45,.9) infinite}
@keyframes nq-pl-slide{from{transform:translateX(-110%)}to{transform:translateX(245%)}}

/* نوار پیشرفت: فقط transform انیمیت می‌شود ⇒ روی لایهٔ GPU، بدون layout/paint. */
#nq-bar{position:fixed;top:0;right:0;left:0;height:3px;z-index:9999;pointer-events:none;
  opacity:0;transition:opacity .28s ease .12s}
#nq-bar.nq-on{opacity:1;transition-delay:0s}
#nq-bar i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:right center;
  background:linear-gradient(to left,#AD4F24,#C95F2D 55%,#B8D8C0);
  box-shadow:0 0 10px rgba(201,95,45,.45);
  transition:transform .24s cubic-bezier(.25,.8,.3,1)}

@media(max-width:480px){
  #nq-pl .nq-mark{width:70px;height:70px}
  #nq-pl .nq-logo{width:50px;height:50px;border-radius:14px}
  #nq-pl .nq-logo svg{width:25px;height:25px}
  #nq-pl .nq-name{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  #nq-pl .nq-in{animation:none}
  #nq-pl .nq-ring{animation-duration:1.6s}
  #nq-pl .nq-track i{animation-duration:2s}
}
@media print{
  #nq-pl,#nq-bar{display:none !important}
}


#nq-pl .nq-brand-lockup{width:190px;height:56px;display:grid;place-items:center}
#nq-pl .nq-brand-logo{grid-area:1/1;display:block;width:100%;height:100%;object-fit:contain}
#nq-pl .nq-brand-logo-light{display:none}
html[data-theme=dark] #nq-pl .nq-brand-logo-dark{display:none}
html[data-theme=dark] #nq-pl .nq-brand-logo-light{display:block}
@media(max-width:480px){#nq-pl .nq-brand-lockup{width:170px;height:50px}}


/* DataWay organizational palette */
#nq-pl{background:radial-gradient(120% 100% at 50% 0,#FFFFFF 0,#FAF9F4 62%)}
#nq-pl .nq-track{background:#E8F1EA}#nq-pl .nq-track i{background:linear-gradient(90deg,#B8D8C0,#247A63)}
#nq-bar i{background:linear-gradient(to left,#123C35,#247A63 55%,#B8D8C0);box-shadow:0 0 10px rgba(36,122,99,.35)}

html[data-theme=dark] #nq-pl{background:radial-gradient(120% 100% at 50% 0,#192A24 0,#101D19 62%)}
html[data-theme=dark] #nq-pl .nq-track{background:#29443C}
