/* =====================================================================
   NEBULA 3D — لایهٔ مکملِ سه‌بعدی (فقط افزوده؛ حذفش = بازگشت کامل)
   ---------------------------------------------------------------------
   • آیکون‌های موجود (اموجی/FontAwesome) به «کاشیِ برجسته» تبدیل می‌شوند:
     وجه گرادیانی + بدنهٔ اکسترود (جعبه‌سایه‌ای) + هالهٔ رنگی + براق.
   • کارت‌ها/ویجت‌ها با تیلتِ ماوس + گلِر عمق می‌گیرند (nebula-3d.js).
   همه قواعد با body.nebula-body آغاز می‌شوند تا特异性 بر nebula.css
   و theme.min.css غالب باشد.
   ===================================================================== */

/* ---------- توکن‌های مشترک ---------- */
body.nebula-body{
  --n-c:#7c3aed;
  --n-tilt:12deg;
}

/* =====================================================================
   ۱) کاشیِ سه‌بعدیِ آیکون
   گروه A: ظرف‌هایی که از قبل باکس/پس‌زمینه دارند
   گروه B: ظرف‌های لَخت که باکس‌سازی می‌شوند
   ===================================================================== */
body.nebula-body .stat-ic,
body.nebula-body .svc-ic,
body.nebula-body .tk-stat-ic,
body.nebula-body .dc-stat-ic,
body.nebula-body .dc-addon-ic,
body.nebula-body .dc-are-ic,
body.nebula-body .dc-mgmt-ic,
body.nebula-body .dc-pns-ic,
body.nebula-body .dc-mod-ic,
body.nebula-body .dc-empty-ic,
body.nebula-body .hp-prod-ic,
body.nebula-body .hp-feat-ic,
body.nebula-body .hp-help-ic,
body.nebula-body .hp-acct-ic,
body.nebula-body .news-item .ic,
body.nebula-body .dl-ic,
body.nebula-body .kb-cat-ic,
body.nebula-body .av-tag,
body.nebula-body .ticket-head-av,
body.nebula-body .intro-av,
body.nebula-body .reply-ic,
body.nebula-body .ts-ic,
body.nebula-body .success-ic,
body.nebula-body .tk-kb-item-ic,
body.nebula-body .auth-icon-circle,
body.nebula-body .qi,
body.nebula-body .empty-ic,
body.nebula-body .svc-empty-ic,
body.nebula-body .dc-quick > i{
  position:relative;   /* هر کاشی باید anchor خودش باشد وگرنه براقِ ::after روی کارتِ والد می‌افتد */
  color:#fff !important;
  border:0 !important;
  background-color:var(--cd,#3b1e7a);
  transform:perspective(460px) rotateX(var(--n-tilt));
  text-shadow:0 1px 2px rgba(0,0,0,.30);
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1);
  box-shadow:
    0 2px 0 var(--cd,#3b1e7a),
    0 4px 0 var(--cd,#3b1e7a),
    0 var(--ndepth,5px) 0 var(--cd,#3b1e7a),
    inset 0 1.5px 0 rgba(255,255,255,.45),
    inset 0 -9px 14px rgba(0,0,0,.28),
    0 14px 24px -10px var(--c,#7c3aed) !important;
}

/* وجهِ گرادیانی — اگر color-mix پشتیبانی نشود، همان --cd ساده می‌ماند */
@supports (background:color-mix(in srgb,#000 50%,#fff)){
  body.nebula-body .stat-ic,
  body.nebula-body .svc-ic,
  body.nebula-body .tk-stat-ic,
  body.nebula-body .dc-stat-ic,
  body.nebula-body .dc-addon-ic,
  body.nebula-body .dc-are-ic,
  body.nebula-body .dc-mgmt-ic,
  body.nebula-body .dc-pns-ic,
  body.nebula-body .dc-mod-ic,
  body.nebula-body .dc-empty-ic,
  body.nebula-body .hp-prod-ic,
  body.nebula-body .hp-feat-ic,
  body.nebula-body .hp-help-ic,
  body.nebula-body .hp-acct-ic,
  body.nebula-body .news-item .ic,
  body.nebula-body .dl-ic,
  body.nebula-body .kb-cat-ic,
  body.nebula-body .av-tag,
  body.nebula-body .ticket-head-av,
  body.nebula-body .intro-av,
  body.nebula-body .reply-ic,
  body.nebula-body .ts-ic,
  body.nebula-body .success-ic,
  body.nebula-body .tk-kb-item-ic,
  body.nebula-body .auth-icon-circle,
  body.nebula-body .qi,
  body.nebula-body .empty-ic,
  body.nebula-body .svc-empty-ic,
  body.nebula-body .dc-quick > i{
    --cd:color-mix(in srgb, var(--c,#7c3aed) 46%, #000);
    background-image:linear-gradient(155deg,
      color-mix(in srgb, var(--c,#7c3aed) 82%, #fff),
      var(--c,#7c3aed) 52%,
      color-mix(in srgb, var(--c,#7c3aed) 68%, #000)) !important;
  }
}

/* براقِ شیشه‌ای روی وجه (هرجا ::after آزاد باشد) */
body.nebula-body .svc-ic::after,
body.nebula-body .dc-stat-ic::after,
body.nebula-body .tk-stat-ic::after,
body.nebula-body .hp-prod-ic::after,
body.nebula-body .hp-feat-ic::after,
body.nebula-body .hp-help-ic::after,
body.nebula-body .kb-cat-ic::after,
body.nebula-body .qi::after,
body.nebula-body .ticket-head-av::after,
body.nebula-body .intro-av::after,
body.nebula-body .success-ic::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:radial-gradient(120% 85% at 30% 0%, rgba(255,255,255,.42), rgba(255,255,255,0) 55%);
}
body.nebula-body .qi,
body.nebula-body .ticket-head-av,
body.nebula-body .intro-av,
body.nebula-body .success-ic,
body.nebula-body .svc-empty-ic{position:relative;}

/* گروه B — باکس‌سازی ظرف‌های لَخت */
body.nebula-body .qi{
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
}
body.nebula-body .qi i.fas{color:inherit !important; font-size:inherit; filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.3));}
body.nebula-body .quick-grid a{flex-direction:column;}
body.nebula-body .empty-ic,
body.nebula-body .svc-empty-ic{
  width:64px; height:64px; border-radius:18px; margin:0 auto 10px;
  display:flex; align-items:center; justify-content:center; font-size:26px !important; opacity:1 !important;
}
body.nebula-body .dc-quick > i{
  width:44px; height:44px; border-radius:13px; margin:0 auto 8px;
  display:flex !important; align-items:center; justify-content:center; font-size:18px !important;
}

/* glyphsِ برداریِ جایگزین (nebula-3d.js) روی وجه */
body.nebula-body .fa-n3d{color:#fff !important; font-size:inherit; filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.3));}

/* حالتِ شناورِ کارت: کاشی کمی بلندتر/نیم‌رخ‌تر */
body.nebula-body :is(.stat-card,.svc-card,.dc-stat,.tk-stat,.hp-prod-card,.hp-feat,.hp-help-card,
  .hp-acct-card,.dept-card,.tk-dept-card,.ring-card,.wallet-card,.dl-card,.kb-cat,
  .quick-grid a,.dc-quick a):hover
  :is(.stat-ic,.svc-ic,.dc-stat-ic,.tk-stat-ic,.hp-prod-ic,.hp-feat-ic,.hp-help-ic,
  .hp-acct-ic,.qi,.dc-quick > i,.kb-cat-ic,.dl-ic,.av-tag){
  transform:perspective(460px) rotateX(6deg) translateY(-3px);
  --n-tilt:6deg;
}

/* ---------- نقشهٔ رنگ (--c) به تفکیک زمینه ---------- */
body.nebula-body .stat-card .stat-ic{--c:#7c3aed}
body.nebula-body .stat-card.sc-green  .stat-ic{--c:#059669}
body.nebula-body .stat-card.sc-amber  .stat-ic{--c:#B45309}
body.nebula-body .stat-card.sc-red    .stat-ic{--c:#E11D48}
body.nebula-body .stat-card.sc-violet .stat-ic{--c:#7c3aed}
body.nebula-body .stat-card.sc-cyan   .stat-ic{--c:#0891B2}

body.nebula-body .svc-ic{--c:#0891B2; --ndepth:6px}

body.nebula-body .dc-stat .dc-stat-ic{--c:#7c3aed}
body.nebula-body .dc-stat.sc-green  .dc-stat-ic{--c:#059669}
body.nebula-body .dc-stat.sc-violet .dc-stat-ic{--c:#7c3aed}
body.nebula-body .dc-stat.sc-amber  .dc-stat-ic{--c:#B45309}
body.nebula-body .dc-stat.sc-red    .dc-stat-ic{--c:#E11D48}
body.nebula-body .dc-stat.sc-cyan   .dc-stat-ic{--c:#0891B2}
body.nebula-body .dc-addon-ic.a{--c:#0891B2}
body.nebula-body .dc-addon-ic.b{--c:#B45309}
body.nebula-body .dc-addon-ic.c{--c:#7c3aed}
body.nebula-body .dc-are-ic{--c:#7c3aed; --ndepth:6px}
body.nebula-body .dc-mgmt-ic,
body.nebula-body .dc-pns-ic{--c:#7c3aed}
body.nebula-body .dc-mod-ic{--c:#7c3aed}
body.nebula-body .dc-empty-ic{--c:#64748b}

body.nebula-body .tk-stat.sc-open     .tk-stat-ic{--c:#0891B2}
body.nebula-body .tk-stat.sc-answered .tk-stat-ic{--c:#B45309}
body.nebula-body .tk-stat.sc-closed   .tk-stat-ic{--c:#059669}
body.nebula-body .tk-stat.sc-total    .tk-stat-ic{--c:#7c3aed}
body.nebula-body .av-tag{--c:#7c3aed}
body.nebula-body .tk-kb-item-ic{--c:#0891B2}
body.nebula-body .ticket-head-av{--c:#7c3aed; --ndepth:8px}
body.nebula-body .intro-av{--c:#7c3aed; --ndepth:8px}
body.nebula-body .reply-ic{--c:#7c3aed}
body.nebula-body .ts-ic{--c:#7c3aed}
body.nebula-body .empty-ic{--c:#64748b}
body.nebula-body .svc-empty-ic{--c:#64748b; --ndepth:3px}
body.nebula-body .success-ic{--c:#059669; --ndepth:9px}

body.nebula-body .hp-prod-ic{--c:#7c3aed; --ndepth:7px}
body.nebula-body .hp-prod-card:nth-child(3n+2) .hp-prod-ic{--c:#0891B2}
body.nebula-body .hp-prod-card:nth-child(3n)   .hp-prod-ic{--c:#DB2777}
body.nebula-body .hp-prod-domain .hp-prod-ic{--c:#0891B2}
body.nebula-body .hp-feat-ic{--c:#7c3aed; --ndepth:6px}
body.nebula-body .hp-help-ic{--c:#0891B2; --ndepth:6px}
body.nebula-body .hp-acct-ic{--c:#7c3aed; --ndepth:5px}
body.nebula-body .hp-ic-v{--c:#7c3aed}
body.nebula-body .hp-ic-c{--c:#0891B2}
body.nebula-body .hp-ic-p{--c:#DB2777}
body.nebula-body .hp-ic-g{--c:#059669}
body.nebula-body .hp-ic-a{--c:#B45309}

body.nebula-body .dl-ic{--c:#7c3aed}
body.nebula-body .kb-cat-ic{--c:#7c3aed; --ndepth:6px}
body.nebula-body .news-item .ic{--c:#7c3aed; --ndepth:4px}
body.nebula-body .news-item .ic.i2{--c:#0891B2}
body.nebula-body .news-item .ic.i3{--c:#B45309}

body.nebula-body .qi{--c:#7c3aed; --ndepth:5px}
body.nebula-body .quick-grid a:nth-child(2) .qi{--c:#0891B2}
body.nebula-body .quick-grid a:nth-child(3) .qi{--c:#059669}
body.nebula-body .quick-grid a:nth-child(4) .qi{--c:#DB2777}
body.nebula-body .dc-quick > i{--c:#7c3aed; --ndepth:6px}
body.nebula-body .dc-quick a:nth-child(3n+2) i{--c:#0891B2}
body.nebula-body .dc-quick a:nth-child(3n)   i{--c:#DB2777}

body.nebula-body .auth-icon-circle.ok{--c:#059669}
body.nebula-body .auth-icon-circle.warn{--c:#B45309}
body.nebula-body .auth-icon-circle.bad{--c:#E11D48}

/* نشانِ حرفیِ برند (fallback لوگو) */
body.nebula-body .brand .mark,
body.nebula-body .auth-brand .mark{
  color:#fff !important; border:0 !important; --c:#7c3aed; --cd:#3b1e7a;
  background-color:var(--c) !important;
  transform:perspective(420px) rotateX(10deg);
  box-shadow:
    0 2px 0 var(--cd), 0 4px 0 var(--cd),
    inset 0 1.5px 0 rgba(255,255,255,.5),
    inset 0 -7px 12px rgba(0,0,0,.28),
    0 12px 22px -10px var(--c) !important;
}

/* =====================================================================
   ۲) تیلتِ ماوس + گلِر (کلاس .n3d-tilt توسط JS افزوده می‌شود)
   ===================================================================== */
body.nebula-body .n3d-tilt{
  position:relative;
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s;
}
body.nebula-body .n3d-tilt::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  opacity:0; transition:opacity .35s; z-index:3;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),
    rgba(255,255,255,.20), rgba(255,255,255,0) 46%);
}
body.nebula-body .n3d-tilt:hover::after{opacity:1;}
body.nebula-body .n3d-tilt:hover{
  box-shadow:0 26px 50px -26px rgba(76,29,149,.42),
             0 8px 18px -12px rgba(15,23,42,.24) !important;
}
/* تیلتِ کارت با براقِ موجود در .hero/.wallet هماهنگ است؛ کارت‌های تخت
   عمقِ ثابتِ ملایمی می‌گیرند تا حتی بدون ماوس هم سه‌بعدی دیده شوند */
body.nebula-body :is(.stat-card,.dc-stat,.tk-stat,.svc-card,.hp-prod-card,.hp-feat,
  .hp-help-card,.hp-acct-card,.kb-cat,.dl-card,.ring-card,.wallet-card,
  .quick-grid a,.dc-quick a,.tk-dept-card,.dept-card):not(.n3d-tilt):not(:hover){
  transform:perspective(1200px) rotateX(.6deg);
}

/* =====================================================================
   ۳) نمایان‌شدنِ پلکانی هنگامِ اسکرول
   ===================================================================== */
@keyframes n3dRise{from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none}}
body.nebula-body .n3d-reveal{opacity:0}
body.nebula-body .n3d-reveal.n3d-in{animation:n3dRise .55s cubic-bezier(.2,.7,.2,1) forwards}

/* =====================================================================
   ۴) کاهشِ حرکت / نبودِ ماوس — همه خاموش، طراحی تختِ اصلی بازمی‌گردد
   ===================================================================== */
@media (prefers-reduced-motion: reduce){
  body.nebula-body .stat-ic,
  body.nebula-body .svc-ic,
  body.nebula-body .tk-stat-ic,
  body.nebula-body .dc-stat-ic,
  body.nebula-body .dc-addon-ic,
  body.nebula-body .dc-are-ic,
  body.nebula-body .dc-mgmt-ic,
  body.nebula-body .dc-are-ic,
  body.nebula-body .hp-prod-ic,
  body.nebula-body .hp-feat-ic,
  body.nebula-body .hp-help-ic,
  body.nebula-body .hp-acct-ic,
  body.nebula-body .qi,
  body.nebula-body .dc-quick > i,
  body.nebula-body .ticket-head-av,
  body.nebula-body .intro-av,
  body.nebula-body .brand .mark,
  body.nebula-body .auth-brand .mark{
    transform:none !important;
  }
  body.nebula-body .n3d-tilt,
  body.nebula-body :is(.stat-card,.dc-stat,.tk-stat,.svc-card,.hp-prod-card,.kb-cat,
    .ring-card,.wallet-card,.quick-grid a,.dc-quick a):not(.n3d-tilt):not(:hover){
    transform:none !important;
  }
  body.nebula-body .n3d-reveal{opacity:1 !important; animation:none !important;}
}
@media (hover:none){
  body.nebula-body .n3d-tilt:hover{box-shadow:none !important;}
  body.nebula-body .n3d-tilt::after{display:none;}
}