/* SmartFX — سایدبارِ نهاد، اخبارِ مرتبط و سوالات متداول
   اسکوپ‌ها: .sfx-sb  ·  .sfx-rn  ·  .sfx-faq   (توکن روی خودِ اسکوپ، نه :root) */

.sfx-sb,.sfx-rn,.sfx-faq{
  --g:linear-gradient(150deg,#6a5be2,#4535ad);
  --accent:#5a4bd6; --accent-dk:#4535ad;
  --lilac:#efeaff; --lilac-2:#e3dbfa;
  --ink:#2a2350; --ink-2:#6f6a86; --ink-3:#9a97ad; --body:#35315a;
  --gold:#e8b64c;
  --sh:0 22px 50px -26px rgba(69,53,173,.45);
  --sh-sm:0 12px 28px -18px rgba(69,53,173,.42);
  direction:rtl;font-family:'IRANYekanX','IRANSans',Arial,sans-serif;color:var(--body)
}
.sfx-sb *,.sfx-rn *,.sfx-faq *{box-sizing:border-box}

/* ⚠️ قالب روی span و i قاعده‌ی سراسریِ font-size:1rem دارد (DESIGN-SYSTEM بخش ۷).
   بدون این مهار، متنِ فهرست ۱۶px می‌شود و اندازه‌های زیر بی‌اثر می‌مانند. */
.sfx-sb-toc-list a i,.sfx-sb-toc-list a span,
.sfx-toc-drawer-list a i,.sfx-toc-drawer-list a span,
.sfx-sb-toc-h span,.sfx-rn span,.sfx-faq span{
  font-size:inherit!important;line-height:inherit!important}


/* ================================================= دکمهٔ ثبت‌نام */
/* قابِ سفیدِ ساده با گردیِ کم؛ دکمه‌ی توپُرِ دیزاین‌سیستم داخلش. */
.sfx-sb-cta{background:#fff;border:1px solid var(--lilac-2);border-radius:14px;
  padding:12px;box-shadow:var(--sh-sm)}
.sfx-sb-cta a{display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--g);color:#fff;border-radius:11px;padding:14px 18px;
  font-size:14.5px;font-weight:800;text-decoration:none;line-height:1.7;
  box-shadow:0 12px 24px -14px rgba(69,53,173,.9);
  transition:transform .16s ease,box-shadow .16s ease}
.sfx-sb-cta a:hover{transform:translateY(-1px);color:#fff;
  box-shadow:0 16px 28px -14px rgba(69,53,173,.95)}
.sfx-sb-cta a svg{width:16px;height:16px;flex:none}

/* ================================================= فهرست مطالب */
.sfx-sb-toc{margin-top:12px;background:#fff;border:1px solid var(--lilac-2);border-radius:16px;
  box-shadow:var(--sh-sm);overflow:hidden}
.sfx-sb-toc-h{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:12px 16px;font-size:14px;font-weight:800;color:var(--ink)}
.sfx-sb-toc-h::-webkit-details-marker{display:none}
.sfx-sb-toc-h svg{margin-inline-start:auto;width:16px;height:16px;color:var(--ink-3);
  flex:none;transition:transform .22s ease}
.sfx-sb-toc[open] .sfx-sb-toc-h svg{transform:rotate(180deg)}

.sfx-sb-toc-list{position:relative;max-height:min(58vh,440px);overflow:auto;
  padding:2px 16px 12px;scrollbar-width:thin;scrollbar-color:var(--lilac-2) transparent}
.sfx-sb-toc-list::-webkit-scrollbar{width:4px}
.sfx-sb-toc-list::-webkit-scrollbar-thumb{background:var(--lilac-2);border-radius:99px}
/* ریلِ عمودیِ سمتِ راست */
.sfx-sb-toc-list::before{content:'';position:absolute;top:4px;bottom:12px;right:16px;
  width:2px;background:#eee9fa;border-radius:2px}

.sfx-sb-toc-list a{position:relative;display:flex;gap:5px;padding:6px 14px 6px 2px;
  font-size:12px;font-weight:600;line-height:1.55;color:var(--ink-2);text-decoration:none;
  transition:color .16s ease}
.sfx-sb-toc-list a::before{content:'';position:absolute;right:-0px;top:6px;bottom:6px;width:2px;
  border-radius:2px;background:transparent;transition:background .16s ease}
.sfx-sb-toc-list a i{font-style:normal;flex:none;color:var(--ink-3);font-weight:700}
.sfx-sb-toc-list a span{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sfx-sb-toc-list a:hover{color:var(--accent-dk)}
.sfx-sb-toc-list a:hover i{color:var(--accent)}
.sfx-sb-toc-list a.is-active{color:var(--accent);font-weight:800}
.sfx-sb-toc-list a.is-active i{color:var(--accent)}
.sfx-sb-toc-list a.is-active::before{background:var(--accent)}
.sfx-sb-toc-list a.lvl-3{padding-right:24px;font-size:11.5px}
.sfx-sb-toc-empty{padding:4px 16px 14px;font-size:12.5px;color:var(--ink-3)}

/* ============================================== اخبارِ مرتبط */
.sfx-rn{background:#fff;border:1px solid var(--lilac-2);border-radius:20px;
  box-shadow:var(--sh-sm);padding:20px 22px;margin-top:18px}
.sfx-rn-h{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.sfx-rn-h h3{margin:0;font-size:17px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:9px}
.sfx-rn-h h3 svg{width:20px;height:20px;color:var(--accent)}
.sfx-rn-all{margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;font-size:13px;
  font-weight:700;color:var(--accent-dk);text-decoration:none}
.sfx-rn-all:hover{color:var(--accent)}
.sfx-rn-all svg{width:14px;height:14px}
.sfx-rn-nav{display:flex;gap:7px}
.sfx-rn-nav button{width:34px;height:34px;border-radius:11px;border:1.5px solid var(--lilac-2);
  background:#fff;color:var(--ink-2);display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:.16s}
.sfx-rn-nav button:hover:not(:disabled){background:var(--lilac);border-color:var(--accent);color:var(--accent-dk)}
.sfx-rn-nav button:disabled{opacity:.4;cursor:default}
.sfx-rn-nav svg{width:15px;height:15px}

.sfx-rn-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding-bottom:4px;-ms-overflow-style:none;scrollbar-width:none}
.sfx-rn-track::-webkit-scrollbar{display:none}
.sfx-rn-card{flex:0 0 282px;scroll-snap-align:start;background:#fff;border:1px solid var(--lilac-2);
  border-radius:16px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sfx-rn-card:hover{transform:translateY(-4px);box-shadow:var(--sh);border-color:var(--accent)}
.sfx-rn-thumb{aspect-ratio:16/9;background:var(--lilac);overflow:hidden}
.sfx-rn-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.sfx-rn-card:hover .sfx-rn-thumb img{transform:scale(1.05)}
.sfx-rn-b{padding:13px 15px 15px;display:flex;flex-direction:column;flex:1}
.sfx-rn-t{font-size:14.5px;font-weight:800;color:var(--ink);line-height:1.75;margin:0 0 10px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sfx-rn-f{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px}
.sfx-rn-time{font-size:12px;font-weight:600;color:var(--ink-3);display:inline-flex;align-items:center;gap:5px}
.sfx-rn-time svg{width:13px;height:13px}
.sfx-rn-more{font-size:12.5px;font-weight:800;color:var(--accent);display:inline-flex;align-items:center;gap:4px}
.sfx-rn-more svg{width:13px;height:13px}
.sfx-rn-empty{font-size:13.5px;color:var(--ink-2);padding:14px 0}
.sfx-rn-sk{flex:0 0 282px;height:212px;border-radius:16px;background:linear-gradient(100deg,#f4f1fc 30%,#faf9ff 50%,#f4f1fc 70%);
  background-size:220% 100%;animation:sfxRnSk 1.2s linear infinite}
@keyframes sfxRnSk{to{background-position:-220% 0}}
@media(max-width:575px){.sfx-rn{padding:16px}.sfx-rn-card{flex-basis:245px}}

/* ============================================ سوالات متداول */
.sfx-faq{margin-top:18px}
.sfx-faq-h{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.sfx-faq-h h3{margin:0;font-size:17px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:9px}
.sfx-faq-h h3 svg{width:20px;height:20px;color:var(--accent)}
.sfx-faq-h span{margin-inline-start:auto;font-size:12.5px;font-weight:700;color:var(--ink-3);
  background:#f7f5fe;border:1px solid var(--lilac-2);border-radius:999px;padding:5px 13px}

.sfx-faq-item{background:#fff;border:1px solid var(--lilac-2);border-radius:14px;
  margin-bottom:10px;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}
.sfx-faq-item[open]{border-color:var(--accent);box-shadow:var(--sh-sm)}
.sfx-faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;
  padding:15px 18px;font-size:14.5px;font-weight:700;color:var(--ink);line-height:1.8;
  transition:background .18s ease}
.sfx-faq-item summary::-webkit-details-marker{display:none}
.sfx-faq-item summary:hover{background:var(--lilac)}
.sfx-faq-item[open] summary{background:var(--lilac);color:var(--accent-dk)}
.sfx-faq-q{flex:1;min-width:0}
.sfx-faq-ic{flex:none;width:28px;height:28px;border-radius:9px;background:#f7f5fe;
  border:1px solid var(--lilac-2);display:flex;align-items:center;justify-content:center;
  color:var(--accent);transition:transform .25s ease,background .18s ease}
.sfx-faq-ic svg{width:14px;height:14px}
.sfx-faq-item[open] .sfx-faq-ic{transform:rotate(180deg);background:#fff}
.sfx-faq-a{padding:2px 18px 18px;font-size:14px;line-height:2.05;color:var(--body);text-align:justify}
.sfx-faq-a p{margin:0 0 10px}
.sfx-faq-a p:last-child{margin:0}
.sfx-faq-a a{color:var(--accent);font-weight:700}

@media (prefers-reduced-motion:reduce){
  .sfx-sb *,.sfx-rn *,.sfx-faq *{transition:none!important;animation:none!important}
  .sfx-rn-track{scroll-behavior:auto}
}

/* ================================ فهرست مطالبِ موبایل (دکمهٔ شناور + کشو) */
.sfx-toc-fab{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:1050;display:none;
  align-items:center;gap:7px;background:linear-gradient(150deg,#6a5be2,#4535ad);color:#fff;border:none;
  border-radius:14px 0 0 14px;padding:14px 9px;font-family:'IRANYekanX','IRANSans',Arial,sans-serif;
  font-size:12.5px;font-weight:800;writing-mode:vertical-rl;
  box-shadow:-6px 0 20px -8px rgba(69,53,173,.8);cursor:pointer}
.sfx-toc-fab svg{width:17px;height:17px;transform:rotate(90deg)}

.sfx-toc-backdrop{position:fixed;inset:0;z-index:1099;background:rgba(24,16,58,.5);
  opacity:0;transition:opacity .25s ease}
.sfx-toc-backdrop.is-open{opacity:1}

.sfx-toc-drawer{position:fixed;top:0;right:0;z-index:1100;width:84vw;max-width:330px;height:100dvh;
  background:#fff;direction:rtl;font-family:'IRANYekanX','IRANSans',Arial,sans-serif;
  box-shadow:-10px 0 34px rgba(20,10,60,.24);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .25s ease}
.sfx-toc-drawer.is-open{transform:none}
.sfx-toc-drawer-h{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 18px;border-bottom:1px solid #e3dbfa;flex:none}
.sfx-toc-drawer-h b{font-size:15.5px;font-weight:800;color:#2a2350}
.sfx-toc-drawer-h button{width:34px;height:34px;border-radius:50%;border:none;background:#f4f1fc;
  color:#6f6a86;font-size:20px;line-height:1;cursor:pointer}
.sfx-toc-drawer-h button:hover{background:#efeaff;color:#4535ad}
.sfx-toc-drawer-list{flex:1;overflow:auto;padding:12px 18px 26px}
.sfx-toc-drawer-list{position:relative}
.sfx-toc-drawer-list::before{content:'';position:absolute;top:12px;bottom:26px;right:18px;
  width:2px;background:#eee9fa;border-radius:2px}
.sfx-toc-drawer-list a{position:relative;display:flex;gap:7px;padding:10px 16px 10px 6px;
  font-size:12.5px;font-weight:600;line-height:1.6;color:#6f6a86;text-decoration:none}
.sfx-toc-drawer-list a::before{content:'';position:absolute;right:0;top:9px;bottom:9px;width:2px;
  border-radius:2px;background:transparent}
.sfx-toc-drawer-list a i{font-style:normal;flex:none;color:#9a97ad;font-weight:700}
.sfx-toc-drawer-list a:active,.sfx-toc-drawer-list a:hover{color:#4535ad}
.sfx-toc-drawer-list a.is-active{color:#5a4bd6;font-weight:800}
.sfx-toc-drawer-list a.is-active::before{background:#5a4bd6}
.sfx-toc-drawer-list a.lvl-3{padding-right:30px;font-size:13px}

@media(max-width:991px){
  .sfx-toc-fab{display:flex}
  .sfx-sb-toc{display:none}          /* در موبایل فقط کشو */
}
@media (prefers-reduced-motion:reduce){
  .sfx-toc-drawer,.sfx-toc-backdrop{transition:none}
}

/* =================================== رفتارِ سایدبار هنگام اسکرول
   قالب کلاسِ .sidebar-fixed را با JS می‌گذارد و سایدبار را تا نزدیکِ فوتر
   شناور نگه می‌دارد؛ نتیجه‌اش این بود که روی بخشِ نظرات هم می‌افتاد.
   اینجا با sticky بومی جایگزینش می‌کنیم: سایدبار همراهِ اسکرول می‌آید و
   دقیقا وقتی ستونِ محتوا (تا اخبارِ بروکر) تمام شد، طبیعی به بالا می‌رود. */
#sidebar-wrapper,
#sidebar-wrapper.sidebar-fixed,
#sidebar-wrapper.sticky-top{
  position:sticky!important;
  top:90px!important;
  left:auto!important;right:auto!important;bottom:auto!important;
  width:auto!important;max-width:none!important;transform:none!important;
  max-height:calc(100vh - 110px);
  overflow-y:auto;overflow-x:hidden;
  scrollbar-width:thin;scrollbar-color:#e3dbfa transparent;
}
#sidebar-wrapper::-webkit-scrollbar{width:4px}
#sidebar-wrapper::-webkit-scrollbar-thumb{background:#e3dbfa;border-radius:99px}
@media(max-width:991px){
  #sidebar-wrapper{position:static!important;max-height:none;overflow:visible}
}