/* ---------- ۱. توکن‌های ارث‌بریده از پوسته ---------- */
.qa-main,
.qa-body {
  /* شکل */
  --qa-ease: cubic-bezier(.22, .61, .2, 1);
  --qa-radius: var(--radius-lg, 16px);
  --qa-radius-sm: var(--radius-md, 10px);
  --qa-radius-xs: var(--radius-sm, 8px);
  --qa-header-h: 62px;

  /* رنگ تأکیدی — از پوسته */
  --qa-accent: var(--accent, var(--accent-color, #7C3AED));
  --qa-accent-hov: var(--accent-strong, var(--accent-hover, var(--accent, var(--accent-color, #6D28D9))));
  --qa-accent-contrast: var(--accent-contrast, #FFFFFF);

  /* گرادیان امضای پوسته (۱.۳.۰) — مثل Renewal؛ در نبود، رنگ تأکیدی */
  --qa-grad: var(--grad, var(--accent, var(--accent-color, #7C3AED)));

  /* متن — از پوسته؛ در نبود، خاکستری خنثی (روشن و تاریک) */
  --qa-text: var(--text, var(--text-primary, rgba(0, 0, 0, .87)));
  --qa-text-2: var(--text-2, var(--text-secondary, rgba(127, 127, 127, 1)));
  --qa-text-3: var(--text-3, var(--text-tertiary, rgba(127, 127, 127, .82)));

  /* سطوح و خط — از پوسته؛ در نبود، لایه‌های شفاف خنثی */
  --qa-bg: transparent;
  --qa-surface: var(--surface, var(--bg-secondary, rgba(127, 127, 127, .05)));
  --qa-surface-2: var(--surface-2, var(--bg-tertiary, rgba(127, 127, 127, .09)));
  --qa-border: var(--border, var(--border-color, rgba(127, 127, 127, .24)));
  --qa-border-2: var(--border-strong, var(--border-hover, rgba(127, 127, 127, .4)));

  /* سایه — از پوسته؛ در نبود، ملایم و خنثی */
  --qa-shadow-sm: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, .05), 0 2px 8px rgba(0, 0, 0, .05));
  --qa-shadow: var(--shadow-md, 0 2px 6px rgba(0, 0, 0, .05), 0 12px 32px rgba(0, 0, 0, .09));

  /* تُن‌های وضعیت — ملایم و شفاف */
  --qa-ok: #0E9F6E;
  --qa-warn: #B45309;
  --qa-err: #DC2626;
  --qa-info: #2563EB;
}

[data-theme="dark"] .qa-main,
[data-theme="dark"] .qa-body {
  --qa-text: var(--text, var(--text-primary, rgba(233, 238, 247, .92)));
  --qa-text-2: var(--text-2, var(--text-secondary, rgba(175, 180, 190, 1)));
  --qa-text-3: var(--text-3, var(--text-tertiary, rgba(150, 155, 165, .9)));
}

/* لایه‌های شفافِ تأکیدی — روی رنگ پوسته ساخته می‌شوند */
.qa-main,
.qa-body {
  --qa-accent-subtle: rgba(127, 127, 127, .06);
  --qa-accent-soft: rgba(127, 127, 127, .12);
}
@supports (color: color-mix(in srgb, red 10%, transparent)) {
  .qa-main,
  .qa-body {
    --qa-accent-subtle: color-mix(in srgb, var(--qa-accent) 9%, transparent);
    --qa-accent-soft: color-mix(in srgb, var(--qa-accent) 16%, transparent);
  }
}

/* ---------- ۲. پایه ---------- */
*, *::before, *::after { box-sizing: border-box; }

/* قالب مستقل: بدون پوسته — استک فونت جایگزین و پس‌زمینهٔ خودش */
.qa-body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--font, 'Vazirmatn', Tahoma, 'Segoe UI', Arial, sans-serif);
  font-size: 15px;
  line-height: 1.9;
  color: var(--qa-text);
  background: var(--qa-bg, #F6F8FB);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* داخل پوستهٔ سایت: هیچ فونت و پس‌زمینه‌ای تحمیل نمی‌شود */
.qa-main {
  color: var(--qa-text);
  font-size: 15px;
  line-height: 1.9;
}

.qa-body :target,
.qa-main :target { scroll-margin-top: calc(var(--qa-header-h) + 16px); }
/* حالت داخل پوستهٔ سایت: سربرگ خود پوسته جا می‌خواهد */
body.is-forum .qa-main :target { scroll-margin-top: 110px; }

.qa-skip {
  position: absolute;
  inset-inline-end: 16px;
  top: -48px;
  z-index: 100;
  background: var(--qa-accent);
  color: var(--qa-accent-contrast);
  padding: 8px 16px;
  border-radius: var(--qa-radius-xs);
  font-size: 13px;
  text-decoration: none;
  transition: top .2s var(--qa-ease);
}
.qa-skip:focus { top: 10px; }

/* ---------- ۲.۵ چیدمان دوستونه: محتوا + سایدبار ---------- */
.qa-layout {
  display: flex;
  flex-direction: column;
  gap: 26px;
  align-items: stretch;
}

.qa-content {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
}

.qa-main {
  flex: 1;
  width: 100%;
  max-width: 1120px;
  margin-inline: auto;
  padding-block: 28px 64px;
  padding-inline: 20px;
}
.qa-body .qa-main { padding: 28px 20px 64px; }

/* مدیاکوئری دسکتاپ فقط وقتی سایدبار واقعاً در DOM هست فعال می‌شود.
   از :has() استفاده می‌کنیم تا وقتی showSidebar خاموش است و <aside>
   رندر نمی‌شود، چیدمان تک‌ستونی بماند و qa-content عرض کامل بگیرد. */
@media (min-width: 1024px) {
  .qa-layout:has(> .qa-sidebar) {
    flex-direction: row;
    align-items: flex-start;
  }
  .qa-layout:has(> .qa-sidebar) > .qa-content {
    flex: 1 1 0;
    min-width: 0;
  }
  .qa-layout:has(> .qa-sidebar) > .qa-sidebar {
    flex: 0 0 300px;
    width: 300px;
  }
}

/* ---------- ۳. سربرگ (فقط قالب مستقل) ---------- */
.qa-header {
  position: sticky;
  top: 0;
  z-index: 50;
  height: var(--qa-header-h);
  background: var(--qa-surface);
  border-bottom: 1px solid var(--qa-border);
}

.qa-header-inner {
  max-width: 1120px;
  margin: 0 auto;
  height: 100%;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.qa-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--qa-text);
  font-weight: 700;
  font-size: 16px;
  min-width: 0;
}
.qa-brand-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  color: var(--qa-accent-contrast);
  background: var(--qa-grad);
  flex: 0 0 auto;
}
.qa-brand-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.qa-nav { display: flex; align-items: center; gap: 8px; }

.qa-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--qa-border);
  color: var(--qa-text-2);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  transition: color .18s var(--qa-ease), border-color .18s var(--qa-ease), background .18s var(--qa-ease);
}
.qa-nav-link:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
  text-decoration: none;
}

.qa-theme-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--qa-border);
  background: transparent;
  color: var(--qa-text-2);
  cursor: pointer;
  transition: color .18s var(--qa-ease), border-color .18s var(--qa-ease), background .18s var(--qa-ease);
}
.qa-theme-btn:hover { color: var(--qa-accent); border-color: var(--qa-accent-soft); background: var(--qa-accent-subtle); }

.qa-icon-moon { display: none; }
.qa-icon-sun { display: block; }
[data-theme="dark"] .qa-icon-moon { display: block; }
[data-theme="dark"] .qa-icon-sun { display: none; }

/* ---------- ۴. سربرگ انجمن (۲.۰.۰) — بالای تمام عناصر ----------
   عنوان/توضیح هیرو + آمار شیشه‌ای + جستجو + منوی کاربر.
   رنگ سربرگ داینامیک است: --qa-grad از پوسته می‌آید مگر آنکه
   تنظیم «رنگ سربرگ» افزونه مقدار دیگری بدهد (inline روی qa-fhead).
   نکته: overflow:hidden عمداً حذف شده تا منوی کاربر (qa-usermenu-pop)
   بتواند از کادر سربرگ بیرون بیاید؛ حلقهٔ تزئینی به‌جای عنصرِ سرریز‌دار
   با گرادیان شعاعی روی لایهٔ تمام‌قد رسم می‌شود. */
.qa-fhead {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px 26px 20px;
  margin-bottom: 14px;
  border-radius: var(--qa-radius);
  color: var(--qa-accent-contrast);
  background: var(--qa-grad);
  box-shadow: var(--qa-shadow);
}
/* لایهٔ تیره‌کنندهٔ ملایم — خوانایی متن روی هر گرادیانی */
.qa-fhead::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(155deg, rgba(0, 0, 0, .18), rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, .12));
  pointer-events: none;
}
/* حلقهٔ تزئینی پشت کاربر — گرادیان شعاعی داخل کادر (بدون نیاز به برش)؛
   در جهت راست‌به‌چپ گوشهٔ چپ (کنار کاربر) و در چپ‌به‌راست گوشهٔ راست. */
.qa-fhead::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    circle 150px at calc(100% - 40px) -20px,
    rgba(255, 255, 255, 0) 107px,
    rgba(255, 255, 255, .08) 108px,
    rgba(255, 255, 255, .08) 149px,
    rgba(255, 255, 255, 0) 150px
  );
  pointer-events: none;
}
[dir="rtl"] .qa-fhead::after {
  background: radial-gradient(
    circle 150px at 40px -20px,
    rgba(255, 255, 255, 0) 107px,
    rgba(255, 255, 255, .08) 108px,
    rgba(255, 255, 255, .08) 149px,
    rgba(255, 255, 255, 0) 150px
  );
}

.qa-fhead-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.qa-fhead-main {
  display: flex;
  align-items: center;
  gap: 15px;
  min-width: 0;
}

.qa-fhead-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  flex: 0 0 auto;
  border-radius: 16px;
  color: var(--qa-accent-contrast);
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .25);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.qa-fhead-id { min-width: 0; }

.qa-fhead-title {
  margin: 0;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.5;
  color: inherit;
  letter-spacing: -.2px;
}

.qa-fhead-intro {
  margin: 3px 0 0;
  font-size: 13.5px;
  line-height: 1.9;
  color: rgba(255, 255, 255, .88);
  max-width: 560px;
}

/* --- ردیف آمار + جستجو (۲.۰.۰) — جستجو روبروی چیپ‌های آمار --- */
.qa-fhead-strip {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

/* --- آمار شیشه‌ای سربرگ --- */
.qa-fhead-stats {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}
.qa-fhead-stat {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 32px;
  padding-inline: 13px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .13);
  border: 1px solid rgba(255, 255, 255, .2);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  font-size: 12.5px;
}
.qa-fhead-stat svg { opacity: .85; }
.qa-fhead-stat b { font-size: 13.5px; font-weight: 800; color: inherit; }
.qa-fhead-stat span { opacity: .85; }

/* --- دکمه‌های شیشه‌ای مهمان --- */
.qa-fhead-guest {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.qa-fhead-gbtn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 38px;
  padding-inline: 15px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .28);
  background: rgba(255, 255, 255, .14);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: inherit;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: background .18s var(--qa-ease), transform .12s var(--qa-ease);
}
.qa-fhead-gbtn:hover {
  background: rgba(255, 255, 255, .24);
  color: inherit;
  text-decoration: none;
}
.qa-fhead-gbtn.is-primary { background: rgba(255, 255, 255, .92); color: #1f2937; }
.qa-fhead-gbtn.is-primary:hover { background: #fff; color: #111827; }

/* --- منوی کاربر (آواتار + نام + کشو) --- */
.qa-usermenu { position: relative; }

.qa-usermenu-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 5px 12px 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .28);
  background: rgba(255, 255, 255, .14);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: inherit;
  font: inherit;
  cursor: pointer;
  transition: background .18s var(--qa-ease);
}
.qa-usermenu-btn:hover,
.qa-usermenu-btn.is-open { background: rgba(255, 255, 255, .24); }

.qa-usermenu .qa-avatar {
  width: 38px;
  height: 38px;
  font-size: 15px;
  border: 2px solid rgba(255, 255, 255, .55);
}

.qa-usermenu-id {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  min-width: 0;
}
.qa-usermenu-name {
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13.5px;
  font-weight: 800;
  color: inherit;
  line-height: 1.5;
}
.qa-usermenu-role {
  font-size: 11px;
  opacity: .8;
  line-height: 1.5;
}
.qa-usermenu-chev {
  flex: 0 0 auto;
  opacity: .8;
  transition: transform .18s var(--qa-ease);
}
.qa-usermenu-btn.is-open .qa-usermenu-chev { transform: rotate(180deg); }

.qa-usermenu-pop {
  position: absolute;
  top: calc(100% + 10px);
  inset-inline-end: 0;
  z-index: 80;
  min-width: 200px;
  padding: 6px;
  border-radius: var(--qa-radius-sm);
  border: 1px solid var(--qa-border-2);
  background: var(--card-glass, var(--qa-surface-solid, #fff));
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  backdrop-filter: blur(18px) saturate(1.5);
  box-shadow: var(--shadow-lg, var(--qa-shadow));
  color: var(--qa-text);
}
.qa-usermenu-pop[hidden] { display: none; }
[data-theme="dark"] .qa-usermenu-pop { background: #1c222c; }

.qa-usermenu-head {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 8px 12px 10px;
  border-bottom: 1px solid var(--qa-border);
  margin-bottom: 6px;
}
.qa-usermenu-head-name { font-size: 13.5px; font-weight: 800; color: var(--qa-text); }
.qa-usermenu-head-role { font-size: 11.5px; color: var(--qa-text-3); }

.qa-usermenu-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 12px;
  border-radius: var(--qa-radius-xs);
  color: var(--qa-text-2);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s var(--qa-ease), color .15s var(--qa-ease);
}
.qa-usermenu-item svg { color: var(--qa-text-3); flex: 0 0 auto; }
.qa-usermenu-item:hover {
  background: var(--qa-accent-subtle);
  color: var(--qa-accent);
  text-decoration: none;
}
.qa-usermenu-item:hover svg { color: var(--qa-accent); }
.qa-usermenu-item.is-danger { color: var(--qa-err); }
.qa-usermenu-item.is-danger svg { color: var(--qa-err); }
.qa-usermenu-item.is-danger:hover {
  background: color-mix(in srgb, var(--qa-err) 9%, transparent);
  color: var(--qa-err);
}

/* ---------- ۴.۲ جستجوی داخل سربرگ (۲.۰.۰) ----------
   از نوار ناوبریِ حذف‌شده به داخل سربرگ منتقل شد؛ روبروی آمار.
   روی رنگ سربرگ، ظاهر شیشه‌ای روشن می‌گیرد. */
.qa-fhead-search {
  margin-inline-start: auto;
  flex: 1 1 220px;
  max-width: 340px;
  min-width: 0;
  height: 38px;
  padding: 0;
  padding-inline: 12px 5px;
  background: rgba(255, 255, 255, .13);
  border-color: rgba(255, 255, 255, .22);
  color: inherit;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background .18s var(--qa-ease), border-color .18s var(--qa-ease), box-shadow .18s var(--qa-ease);
}
.qa-fhead-search:hover { background: rgba(255, 255, 255, .18); }
.qa-fhead-search:focus-within {
  background: rgba(255, 255, 255, .2);
  border-color: rgba(255, 255, 255, .45);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .18);
}
.qa-fhead-search input { color: inherit; }
.qa-fhead-search input::placeholder { color: rgba(255, 255, 255, .78); }
.qa-fhead-search svg { opacity: .85; }
.qa-fhead-search .qa-search-clear-btn { color: rgba(255, 255, 255, .85); }
.qa-fhead-search .qa-search-clear-btn:hover { background: rgba(255, 255, 255, .2); color: #fff; }

/* ---------- ۴.۳ چیپ فیلتر فعال (دسته/جستجو) — کنار نوار مرتب‌سازی ---------- */
.qa-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 36px;
  padding-inline: 13px;
  border-radius: 999px;
  border: 1px solid var(--qa-border);
  background: var(--qa-surface);
  color: var(--qa-text-2);
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
  max-width: 100%;
  transition: background .15s var(--qa-ease), color .15s var(--qa-ease), border-color .15s var(--qa-ease);
}
@supports (color: color-mix(in srgb, red 10%, transparent)) {
  .qa-filter-chip {
    border-color: color-mix(in srgb, var(--cat-color, var(--qa-accent)) 38%, transparent);
    background: color-mix(in srgb, var(--cat-color, var(--qa-accent)) 8%, transparent);
    color: var(--cat-color, var(--qa-accent));
  }
}
.qa-filter-chip:hover { text-decoration: none; filter: brightness(.96); }
.qa-filter-chip > span:not(.qa-filter-chip-x) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-filter-chip-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  opacity: .65;
}
.qa-filter-chip:hover .qa-filter-chip-x { opacity: 1; }

/* ---------- ۴.۵ جستجو ---------- */
.qa-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 4px 0 12px;
  min-width: 220px;
  flex: 0 1 280px;
  height: 40px;
  border: 1px solid var(--qa-border);
  border-radius: 999px;
  background: var(--qa-surface);
  color: var(--qa-text-2);
  transition: border-color .18s var(--qa-ease), box-shadow .18s var(--qa-ease);
}
.qa-search:focus-within {
  border-color: var(--qa-accent);
  box-shadow: 0 0 0 3px var(--qa-accent-subtle);
}
.qa-search svg { flex: 0 0 auto; }
.qa-search input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--qa-text);
  font: inherit;
  font-size: 13.5px;
  outline: none;
  height: 100%;
}
.qa-search input::placeholder { color: var(--qa-text-3); }
.qa-search-clear-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--qa-text-2);
  cursor: pointer;
}
.qa-search-clear-btn:hover { background: var(--qa-surface-2); color: var(--qa-err); }
.qa-search-clear {
  color: var(--qa-accent);
  font-weight: 700;
  text-decoration: none;
  font-size: 12.5px;
  margin-inline-start: 8px;
}
.qa-search-clear:hover { text-decoration: underline; }

.qa-mark {
  background: var(--qa-accent-soft);
  color: inherit;
  border-radius: 4px;
  padding-inline: 2px;
  font-weight: 700;
}

/* ---------- ۵. دکمه‌ها — از رنگ تأکیدی پوسته ---------- */
.qa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 40px;
  padding-inline: 16px;
  border-radius: 999px;
  border: 1px solid var(--qa-border);
  background: var(--qa-surface);
  color: var(--qa-text);
  font: inherit;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background .18s var(--qa-ease), color .18s var(--qa-ease),
    border-color .18s var(--qa-ease), transform .12s var(--qa-ease);
}
.qa-btn:active { transform: translateY(1px) scale(.99); }
.qa-btn:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: 2px; }
.qa-btn svg { flex: 0 0 auto; }

.qa-btn-primary {
  background: var(--qa-grad);
  border-color: var(--qa-accent);
  color: var(--qa-accent-contrast);
}
.qa-btn-primary:hover {
  background: var(--qa-grad);
  border-color: var(--qa-accent-hov);
  color: var(--qa-accent-contrast);
  text-decoration: none;
  filter: brightness(1.06);
}

.qa-btn-ghost { background: transparent; }
.qa-btn-ghost:hover {
  background: var(--qa-accent-subtle);
  border-color: var(--qa-accent-soft);
  color: var(--qa-accent);
  text-decoration: none;
}

/* ---------- ۵.۵ دکمه‌های ریز اقدام روی پست‌ها ---------- */
.qa-post-action {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 30px;
  padding-inline: 10px;
  border: 1px solid var(--qa-border);
  border-radius: 999px;
  background: transparent;
  color: var(--qa-text-2);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: color .16s var(--qa-ease), border-color .16s var(--qa-ease), background .16s var(--qa-ease);
}
.qa-post-action:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
.qa-post-action:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: 1px; }
.qa-post-action svg { pointer-events: none; }

/* ---------- ۶. نوار مرتب‌سازی — تمام‌عرض بالای دو ستون (۲.۰.۰) ----------
   بیرون از qa-layout قرار می‌گیرد تا بالای qa-list و qa-sidebar تراز شود. */
.qa-stats {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
}

.qa-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding-inline: 12px;
  border-radius: 999px;
  border: 1px solid var(--qa-border);
  background: var(--qa-surface);
  color: var(--qa-text-2);
  font-size: 12.5px;
  font-weight: 700;
}
.qa-chip svg { color: var(--qa-accent); }

/* نوار تب مرتب‌سازی — الهام‌گرفته از FlatBB */
.qa-sort-bar {
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: 4px;
  border-radius: 999px;
  background: var(--qa-surface-2);
  border: 1px solid var(--qa-border);
}
a.qa-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding-inline: 14px;
  border-radius: 999px;
  border: 0;
  background: transparent;
  color: var(--qa-text-3);
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s var(--qa-ease), color .15s var(--qa-ease);
  white-space: nowrap;
}
a.qa-sort-btn:hover {
  color: var(--qa-text);
  background: var(--qa-surface);
  text-decoration: none;
}
a.qa-sort-btn.is-active {
  color: var(--qa-accent-contrast);
  background: var(--qa-accent);
}
a.qa-sort-btn.is-active svg { color: var(--qa-accent-contrast); }
a.qa-sort-btn svg { color: var(--qa-text-3); }
a.qa-sort-btn:hover svg { color: var(--qa-text); }

/* تب گزارش‌ها — نارنجی با badge */
a.qa-sort-btn--flagged { color: var(--qa-warn); }
a.qa-sort-btn--flagged svg { color: var(--qa-warn); }
a.qa-sort-btn--flagged:hover {
  background: color-mix(in srgb, var(--qa-warn) 10%, transparent);
  color: var(--qa-warn);
}
a.qa-sort-btn--flagged.is-active {
  background: var(--qa-warn);
  color: #fff;
}
a.qa-sort-btn--flagged.is-active svg { color: #fff; }
.qa-sort-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--qa-accent);
  color: #fff;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1;
}
a.qa-sort-btn.is-active .qa-sort-badge {
  background: rgba(255, 255, 255, .3);
  color: #fff;
}
a.qa-sort-btn--flagged.is-active .qa-sort-badge { background: rgba(255,255,255,.3); color: #fff; }

/* تب «در انتظار تأیید» (۲.۰.۰) — کهربایی با badge؛ مانند تب گزارش‌ها
   فقط وقتی نمایش داده می‌شود که موردی در صف باشد */
a.qa-sort-btn--pending { color: var(--qa-warn); }
a.qa-sort-btn--pending svg { color: var(--qa-warn); }
a.qa-sort-btn--pending:hover {
  background: color-mix(in srgb, var(--qa-warn) 10%, transparent);
  color: var(--qa-warn);
}
a.qa-sort-btn--pending.is-active {
  background: var(--qa-warn);
  color: #fff;
}
a.qa-sort-btn--pending.is-active svg { color: #fff; }
a.qa-sort-btn--pending .qa-sort-badge { background: var(--qa-warn); color: #fff; }
a.qa-sort-btn--pending.is-active .qa-sort-badge { background: rgba(255,255,255,.3); color: #fff; }

/* دکمهٔ خانه (۲.۰.۰) — فقط آیکون؛ ابتدای نوار؛ نقش «جدیدترین» را هم دارد.
   جداکنندهٔ ظریف بین خانه و بقیهٔ تب‌ها فقط وقتی دیده می‌شود که دکمهٔ بعدی هست. */
a.qa-sort-btn.qa-sort-home {
  width: 38px;
  padding-inline: 0;
  justify-content: center;
  flex: 0 0 auto;
}
a.qa-sort-home + a.qa-sort-btn::before {
  content: '';
  align-self: center;
  height: 16px;
  border-inline-start: 1px solid var(--qa-border);
  margin-inline-end: 4px;
}

/* دکمهٔ «پرسش جدید» کنار نوار مرتب‌سازی (۲.۰.۰) — فقط وقتی سایدبار پنهان است.
   هم‌قد نوار (۴۴px = ۳۴ دکمه + ۲×۴ پدینگ + ۲×۱ خط) */
.qa-sort-ask {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 44px;
  padding-inline: 17px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--qa-accent);
  color: var(--qa-accent-contrast);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background .18s var(--qa-ease), box-shadow .18s var(--qa-ease), transform .12s var(--qa-ease);
}
.qa-sort-ask:hover {
  background: var(--qa-accent-hov);
  color: var(--qa-accent-contrast);
  text-decoration: none;
}
.qa-sort-ask:active { transform: translateY(1px); }
.qa-sort-ask:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: 2px; }
.qa-sort-ask.is-open { box-shadow: 0 0 0 3px var(--qa-accent-subtle); }

/* بج ساعت‌شنی «در انتظار تأیید» روی عنوان پرسش + پس‌زمینهٔ کهربایی آیتم */
.qa-wait-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  color: var(--qa-warn);
  background: color-mix(in srgb, var(--qa-warn) 14%, transparent);
}
.qa-wait-badge.is-reply {
  width: auto;
  padding-inline: 5px;
  gap: 4px;
}
.qa-wait-badge b {
  font-size: 10.5px;
  font-weight: 800;
  color: var(--qa-warn);
  line-height: 1;
}
.qa-item.is-waiting { background: rgba(180, 83, 9, .07); }
.qa-item.is-waiting:hover { background: rgba(180, 83, 9, .11); }
.qa-item.is-pending-replies { background: rgba(180, 83, 9, .05); }
.qa-item.is-pending-replies:hover { background: rgba(180, 83, 9, .09); }
.qa-item.is-waiting .qa-item-title-text,
.qa-item.is-pending-replies .qa-item-title-text { color: var(--qa-text-2); }

/* (جستجوی درون‌خطی قدیمی حذف شد — جستجو داخل سربرگ است) */

/* چیپ فیلتر «بی‌پاسخ» — قابل کلیک و حالت فعال */
a.qa-chip-filter {
  text-decoration: none;
  color: var(--qa-text-2);
  cursor: pointer;
  transition: background .15s var(--qa-ease), color .15s var(--qa-ease), border-color .15s var(--qa-ease);
}
a.qa-chip-filter:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
a.qa-chip-filter.is-active {
  color: var(--qa-accent-contrast);
  background: var(--qa-accent);
  border-color: var(--qa-accent);
}
a.qa-chip-filter.is-active svg { color: var(--qa-accent-contrast); }

/* ---------- ۷. فرم‌ها ---------- */
.qa-ask {
  margin-bottom: 22px;
  padding: 20px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
}

.qa-ask-title, .qa-reply-title {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 800;
  color: var(--qa-text);
  position: relative;
  padding-inline-start: 12px;
}
.qa-ask-title::after, .qa-reply-title::after {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 4px;
  bottom: 4px;
  width: 3.5px;
  border-radius: 3px;
  background: var(--qa-accent);
}

.qa-form { display: flex; flex-direction: column; gap: 14px; }

.qa-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 560px) {
  .qa-form-row { grid-template-columns: 1fr; }
}

.qa-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.qa-field label { font-size: 13px; font-weight: 600; color: var(--qa-text-2); }
.qa-req { color: var(--qa-err); }

.qa-field input, .qa-form textarea {
  width: 100%;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  padding: 10px 12px;
  background: var(--qa-bg, transparent);
  color: var(--qa-text);
  font: inherit;
  font-size: 14px;
  outline: none;
  transition: border-color .16s var(--qa-ease), box-shadow .16s var(--qa-ease);
}
.qa-field input::placeholder, .qa-form textarea::placeholder { color: var(--qa-text-3); }
.qa-field input:focus, .qa-form textarea:focus {
  border-color: var(--qa-accent);
  box-shadow: 0 0 0 3px var(--qa-accent-subtle);
}
.qa-form textarea {
  resize: vertical;
  min-height: 96px;
  line-height: 1.9;
  /* (۲.۱.۰) متن فارسی RTL و راست‌چین، متن انگلیسی LTR و چپ‌چین — خودکار */
  direction: rtl;
  unicode-bidi: plaintext;
  text-align: start;
}

.qa-field-note { margin: 0; font-size: 12px; color: var(--qa-text-3); }
.qa-form-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.qa-form-identity {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 13.5px;
  color: var(--qa-text-2);
}
.qa-form-identity .qa-avatar { width: 30px; height: 30px; font-size: 13px; }
.qa-form-identity b { color: var(--qa-accent); }

.qa-hp {
  position: absolute !important;
  inset-inline-start: -9999px !important;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

/* ---------- ۷.۵ ویرایش درجا ---------- */
.qa-edit {
  margin-block: 4px 12px;
  padding: 16px;
  border: 1px dashed var(--qa-accent-soft);
  border-radius: var(--qa-radius-sm);
  background: var(--qa-accent-subtle);
}
.qa-edit[hidden] { display: none; }
.qa-edit-form { gap: 10px; }

/* ---------- ۸. فهرست پرسش‌ها ---------- */
.qa-list {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
  overflow: hidden;
  box-shadow: var(--qa-shadow-sm);
}

.qa-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  color: var(--qa-text);
  transition: background .15s var(--qa-ease);
}
.qa-item + .qa-item { border-top: 1px solid var(--qa-border); }
.qa-item:hover { background: var(--qa-accent-subtle); }
.qa-item:focus-within { outline: 2px solid var(--qa-accent); outline-offset: -2px; }
.qa-item.is-pinned { background: var(--qa-accent-subtle); }
.qa-item.is-pinned + .qa-item:not(.is-pinned) { border-top: 1px solid var(--qa-border-2); }

.qa-item-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }

.qa-item-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  color: var(--qa-text);
  min-width: 0;
}

/* لینک کشیده‌شده: کل کارت را کلیک‌پذیر می‌کند، بدون آنکه <a> تو در تو
   با لینک نویسنده ساخته شود. الگوی استاندارد stretched-link. */
.qa-item-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.qa-item-link::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}
.qa-item:hover .qa-item-link { color: var(--qa-accent-hov); }

.qa-item-title-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

/* بولت سبز «خوانده‌نشده» کنار عنوان */
.qa-unread-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--qa-ok, #16a34a);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--qa-ok, #16a34a) 25%, transparent);
  display: inline-block;
}
.qa-item.is-unread .qa-item-title-text { font-weight: 800; }

/* هر عنصر تعاملی داخل کارت باید بالای لینک کشیده‌شده باشد تا کلیک‌پذیر بماند */
.qa-item-meta,
.qa-item-side {
  position: relative;
  z-index: 2;
}

.qa-lock-badge, .qa-pin-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  flex: 0 0 auto;
  color: var(--qa-warn);
  background: color-mix(in srgb, var(--qa-warn) 14%, transparent);
}
.qa-pin-badge {
  color: var(--qa-accent);
  background: var(--qa-accent-soft);
}

/* نشان تیک سبز در فهرست برای پرسش‌های حل‌شده (قفل به‌دلیل بهترین‌پاسخ) */
.qa-best-badge-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  flex: 0 0 auto;
  color: var(--qa-ok, #16a34a);
  background: color-mix(in srgb, var(--qa-ok, #16a34a) 14%, transparent);
}

.qa-item.is-locked .qa-item-title-text { color: var(--qa-text-2); }

.qa-item-excerpt {
  font-size: 12.5px;
  color: var(--qa-text-3);
  line-height: 1.8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qa-item-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--qa-text-3);
}
.qa-author-link { color: var(--qa-text-2); font-weight: 600; text-decoration: none; }
a.qa-author-link:hover { color: var(--qa-accent); text-decoration: underline; }
.qa-dot { opacity: .7; }

.qa-item-side {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  text-align: end;
  font-size: 12px;
  color: var(--qa-text-3);
}

.qa-activity {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.qa-views {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.qa-views svg { opacity: .75; }

.qa-item-last { color: var(--qa-text-2); font-weight: 600; }

.qa-count {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 24px;
  padding-inline: 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: var(--qa-accent-contrast);
  background: var(--qa-accent);
  white-space: nowrap;
}
.qa-count.is-zero { color: var(--qa-text-3); background: var(--qa-surface-2); font-weight: 600; }

/* ---------- ۹. آواتار ---------- */
.qa-avatar {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 50%;
  font-weight: 800;
  font-size: 17px;
  color: #fff;
  background: hsl(var(--ava-h, 210) 62% 46%);
  user-select: none;
}
.qa-avatar .qa-grava {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  background: hsl(var(--ava-h, 210) 62% 46%);
}
.qa-avatar-guest {
  background: var(--qa-surface-2);
  color: var(--qa-text-2);
}

/* ---------- ۱۰. حالت خالی ---------- */
.qa-empty {
  padding: 44px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
}
.qa-empty-slim { padding: 30px 24px; }
.qa-empty-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--qa-accent-subtle);
  color: var(--qa-accent);
  margin-bottom: 6px;
}
.qa-empty-title { margin: 0 0 4px; font-size: 15px; font-weight: 700; color: var(--qa-text-2); }
.qa-empty-text { margin: 0; font-size: 13px; color: var(--qa-text-3); }

/* ---------- ۱۱. صفحه‌بندی ---------- */
.qa-pagination { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 18px; }

.qa-page-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  padding-inline: 10px;
  border-radius: 999px;
  border: 1px solid var(--qa-border);
  background: var(--qa-surface);
  color: var(--qa-text-2);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.qa-page-btn:hover { color: var(--qa-accent); border-color: var(--qa-accent-soft); background: var(--qa-accent-subtle); text-decoration: none; }
.qa-page-btn.is-current {
  color: var(--qa-accent-contrast);
  background: var(--qa-accent);
  border-color: var(--qa-accent);
}
.qa-page-btn.is-disabled { opacity: .45; pointer-events: none; }
.qa-page-ellipsis { color: var(--qa-text-3); }

/* indicator «صفحه X از Y • N پرسش» */
.qa-page-info {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--qa-text-3);
  font-variant-numeric: tabular-nums;
  padding: 0 8px;
}
.qa-page-info-sep { opacity: .6; }
.qa-page-info--solo {
  margin-inline-start: 0;
  margin-top: 18px;
  padding: 0;
}

/* صفحه‌بندی پاسخ‌ها (داخل تاپیک) */
.qa-answers-pagination { margin-top: 16px; margin-bottom: 4px; }

/* ---------- ۱۲. مسیر ----------
   (حذف‌شده — ناوبری کامل زیر سربرگ داریم) */

/* ---------- ۱۳. پرسش ---------- */
.qa-question {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
  padding: 20px;
  position: relative;
  /* ۲.۲.۰ — overflow:hidden حذف شد تا دراپ‌داون چرخ‌دنده بیرون کارت دیده شود
     (همان رفع qa-fhead/qa-usermenu-pop)؛ گوشه‌های نوار تأکیدی با border-radius خودش */
  box-shadow: var(--qa-shadow-sm);
}
.qa-question::before {
  content: '';
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 3px;
  border-radius: var(--qa-radius) var(--qa-radius) 0 0;
  /* تیره به شفاف، از سمت شروعِ متن (منطقی؛ راست در RTL و چپ در LTR) */
  background: linear-gradient(
  to left,
  color-mix(in srgb, var(--qa-accent) 0%, transparent),
  var(--qa-accent),
  color-mix(in srgb, var(--qa-accent) 0%, transparent)
);
}
[dir="ltr"] .qa-question::before {
  background: linear-gradient(to right, var(--qa-accent), transparent);
}
.qa-question.is-waiting { border-color: color-mix(in srgb, var(--qa-warn) 40%, transparent); }

.qa-question-head, .qa-answer-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.qa-question-id, .qa-answer-id { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.qa-question-author, .qa-answer-author { font-size: 14px; font-weight: 700; }
.qa-answer-author.is-staff { color: var(--qa-accent); }

/* بج «رسمی» کنار نام مدیر اصلی — آیکون Lucide «badge-check» */
.qa-official-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-inline-start: 3px;
  vertical-align: middle;
  color: var(--qa-accent);
  flex: 0 0 auto;
  position: relative;
  top: -1px;
}
.qa-official-badge svg { flex: 0 0 auto; width: 100%; height: 100%; }

/* بج «عضو» سبز برای کاربران عضو غیرمدیر — آیکون Lucide «user-check» */
.qa-member-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  margin-inline-start: 3px;
  vertical-align: middle;
  color: var(--qa-ok, #16a34a);
  flex: 0 0 auto;
  position: relative;
  top: -1px;
}
.qa-member-badge svg { flex: 0 0 auto; width: 100%; height: 100%; }

.qa-question-actions, .qa-answer-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  flex-wrap: wrap;
}

.qa-question-meta, .qa-answer-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--qa-text-3);
}
.qa-question-views { display: inline-flex; align-items: center; gap: 4px; }

.qa-question-title {
  margin: 0 0 10px;
  font-size: 21px;
  font-weight: 800;
  line-height: 1.6;
  color: var(--qa-text);
}

.qa-question-text, .qa-answer-body {
  font-size: 14.5px;
  line-height: 2;
  color: var(--qa-text);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.qa-link { color: var(--qa-accent); text-decoration: none; font-weight: 600; }
.qa-link:hover { text-decoration: underline; }

.qa-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 22px;
  padding-inline: 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: var(--qa-surface-2);
  color: var(--qa-text-2);
}
.qa-badge.is-waiting { color: var(--qa-warn); background: color-mix(in srgb, var(--qa-warn) 13%, transparent); }
.qa-badge.is-pinned { color: var(--qa-accent); background: var(--qa-accent-soft); }
.qa-badge.is-locked { color: var(--qa-warn); background: color-mix(in srgb, var(--qa-warn) 13%, transparent); }
.qa-badge.is-best-solved { color: var(--qa-ok, #16a34a); background: color-mix(in srgb, var(--qa-ok, #16a34a) 13%, transparent); }

/* ---------- ۱۴. پابرگ پرسش و ابزار مدیر ---------- */
.qa-question-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--qa-border);
}

/* ۲.۲.۰ — چیدمان دوطرفهٔ پابرگ کارت‌ها:
   راست (ابتدای RTL) = قلب/پاسخ/نقل‌قول/ویرایش؛
   چپ = گزارش/بهترین/شمارشگر/چرخ‌دنده */
.qa-foot-side {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.qa-foot-left { margin-inline-start: auto; }

/* پابرگ کارت پاسخ — همیشه جداشده با خط بالای خودش */
.qa-answer-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--qa-border);
}

/* نوار اشتراک‌گذاری (۱.۴.۰) */
.qa-share-bar {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.qa-share-bar .qa-post-action,
.qa-flag-form .qa-flag-btn {
  width: 32px;
  height: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.qa-share-copy.is-copied {
  color: var(--qa-ok, #16a34a);
  border-color: color-mix(in srgb, var(--qa-ok, #16a34a) 35%, transparent);
  background: color-mix(in srgb, var(--qa-ok, #16a34a) 8%, transparent);
}

/* دکمهٔ گزارش تخلف (۱.۴.۰) */
.qa-flag-form { display: inline-flex; }
.qa-flag-btn { color: var(--qa-text-3); }
.qa-flag-btn:hover {
  color: var(--qa-warn);
  border-color: color-mix(in srgb, var(--qa-warn) 35%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 8%, transparent);
}
.qa-flag-btn.is-flagged {
  color: var(--qa-warn);
  border-color: color-mix(in srgb, var(--qa-warn) 35%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 10%, transparent);
  cursor: default;
}

/* نشان گزارش برای مدیر — نارنجی با شمارش */
.qa-flag-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 30px;
  padding-inline: 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--qa-warn) 35%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 10%, transparent);
  color: var(--qa-warn);
  font-size: 11.5px;
  font-weight: 700;
}
.qa-clear-flags-btn { color: var(--qa-err); }
.qa-clear-flags-btn:hover {
  background: color-mix(in srgb, var(--qa-err) 14%, transparent);
  color: var(--qa-err);
}

/* پسند (لایک) پرسش‌ها و پاسخ‌ها — ۲.۰.۰ */
.qa-like-form { display: inline-flex; }
.qa-like-form .qa-like-btn {
  width: auto;
  min-width: 32px;
  height: 32px;
  padding-inline: 9px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.qa-like-btn { color: var(--qa-text-3); }
.qa-like-btn:hover {
  color: #e11d48;
  border-color: color-mix(in srgb, #e11d48 35%, transparent);
  background: color-mix(in srgb, #e11d48 8%, transparent);
}
.qa-like-btn.is-liked {
  color: #e11d48;
  border-color: color-mix(in srgb, #e11d48 35%, transparent);
  background: color-mix(in srgb, #e11d48 10%, transparent);
}
.qa-like-btn.is-liked svg { fill: #e11d48; }
.qa-like-btn.is-busy { opacity: .55; pointer-events: none; }
.qa-like-count {
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1;
}

/* نشان شمار پسند برای نویسندهٔ خودِ نوشته (۲.۰.۰) — غیرکلیکی */
.qa-like-badge {
  color: #e11d48;
  border-color: color-mix(in srgb, #e11d48 26%, transparent);
  background: color-mix(in srgb, #e11d48 6%, transparent);
  cursor: default;
}
.qa-like-badge:hover {
  color: #e11d48;
  border-color: color-mix(in srgb, #e11d48 26%, transparent);
  background: color-mix(in srgb, #e11d48 6%, transparent);
}
.qa-like-badge svg { fill: #e11d48; }

/* ---------- انیمیشن پسند به سبک اینستاگرام (۲.۰.۰) ----------
   سه لایه: پاپِ قلب (بزرگ‌شدن فنری با برگشت)، حلقهٔ رز که از دکمه
   پخش و محو می‌شود، و ۸ ذرهٔ ریز که بیرون می‌پرند ( qa-like-burst
   توسط forum.js ساخته می‌شود). برداشتن پسند یک جمع‌شدن کوچک دارد. */
.qa-like-form .qa-like-btn { position: relative; }

.qa-like-btn.qa-just-liked svg {
  animation: qaHeartPop .75s cubic-bezier(.22, 1.4, .36, 1) both;
}
.qa-like-btn.qa-just-unliked svg {
  animation: qaHeartShrink .35s ease both;
}

/* حلقهٔ پخش‌شونده دور دکمه */
.qa-like-btn.qa-just-liked::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 999px;
  border: 2px solid #e11d48;
  pointer-events: none;
  animation: qaLikeRing .65s ease-out both;
}

@keyframes qaHeartPop {
  0%   { transform: scale(.2); }
  28%  { transform: scale(1.45); }
  48%  { transform: scale(.85); }
  68%  { transform: scale(1.25); }
  84%  { transform: scale(.95); }
  100% { transform: scale(1); }
}
@keyframes qaHeartShrink {
  0%   { transform: scale(1); }
  50%  { transform: scale(.72); }
  100% { transform: scale(1); }
}
@keyframes qaLikeRing {
  0%   { transform: scale(.55); opacity: .85; }
  100% { transform: scale(1.65); opacity: 0; }
}

/* ذره‌های انفجار — مسیر هر ذره با --tx/--ty از JS تعیین می‌شود */
.qa-like-burst {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.qa-like-burst i {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4.5px;
  height: 4.5px;
  margin: -2.25px 0 0 -2.25px;
  border-radius: 50%;
  background: #e11d48;
  box-shadow: 0 0 4px color-mix(in srgb, #e11d48 55%, transparent);
  animation: qaLikeDot .6s ease-out both;
}
.qa-like-burst i:nth-child(2n) {
  background: #fb7185; /* رزِ روشن‌تر — تن‌پرش رنگی مثل اینستاگرام */
}
@keyframes qaLikeDot {
  0%   { transform: translate(0, 0) scale(1); opacity: 1; }
  70%  { opacity: .85; }
  100% { transform: translate(var(--tx, 20px), var(--ty, -20px)) scale(.25); opacity: 0; }
}

/* کاربرانی که حرکت کمتر می‌خواهند — بدون انیمیشن */
@media (prefers-reduced-motion: reduce) {
  .qa-like-btn.qa-just-liked svg,
  .qa-like-btn.qa-just-unliked svg,
  .qa-like-btn.qa-just-liked::after,
  .qa-like-burst i { animation: none; }
}

/* ---------- دکمهٔ تأیید نوشتهٔ در انتظار — از محیط کاربری (۲.۰.۰) ---------- */
.qa-approve-form { display: inline-flex; }
.qa-approve-form .qa-approve-btn,
.qa-post-action.qa-approve-btn {
  color: var(--qa-ok);
  border-color: color-mix(in srgb, var(--qa-ok) 38%, transparent);
  background: color-mix(in srgb, var(--qa-ok) 8%, transparent);
}
.qa-post-action.qa-approve-btn:hover {
  color: var(--qa-ok);
  border-color: color-mix(in srgb, var(--qa-ok) 55%, transparent);
  background: color-mix(in srgb, var(--qa-ok) 15%, transparent);
}
/* در فهرست صف تأیید — دکمهٔ فشرده در ستون کناری آیتم */
.qa-item-side .qa-approve-form { display: inline-flex; }
.qa-item-side .qa-approve-btn { height: 28px; padding-inline: 9px; font-size: 11.5px; }

/* دکمهٔ آپلود تصویر در ویرایشگر (imgurl.ir) — ۲.۰.۰ */
.qa-tb-upload-btn.is-busy {
  pointer-events: none;
  color: var(--qa-accent);
  background: var(--qa-accent-soft);
}
.qa-tb-upload-btn.is-busy svg {
  animation: qaTbPulse 1s ease-in-out infinite;
}
@keyframes qaTbPulse {
  0%, 100% { opacity: 1; transform: translateY(0); }
  50% { opacity: .35; transform: translateY(-2px); }
}

/* آمار پسند در پروفایل — رز */
.qa-pstat-likes b { color: #e11d48; }

/* ۲.۲.۰ — ابزارهای مدیر به دراپ‌داون چرخ‌دنده منتقل شدند (استایل‌های پایین) */
.qa-lock-form { display: inline-flex; }
.qa-post-action.is-active-tool {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
.qa-post-action.is-locked-btn { color: var(--qa-warn); border-color: color-mix(in srgb, var(--qa-warn) 35%, transparent); }
.qa-post-action.is-locked-btn:hover { color: var(--qa-warn); background: color-mix(in srgb, var(--qa-warn) 9%, transparent); border-color: color-mix(in srgb, var(--qa-warn) 45%, transparent); }
.qa-tools-note { font-size: 12px; color: var(--qa-text-3); }

/* ---------- ۱۵. پاسخ‌ها ---------- */
.qa-answers { margin-top: 26px; }

/* ۲.۲.۰ — شمارشگر «N پاسخ» زیر سربرگ حذف شد */

.qa-answers-list { display: flex; flex-direction: column; gap: 12px; }

.qa-answer {
  position: relative;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm);
  background: var(--qa-surface);
  padding: 16px 18px;
}
.qa-answer:target {
  border-color: var(--qa-accent);
  box-shadow: 0 0 0 3px var(--qa-accent-subtle);
}
.qa-answer.is-waiting {
  border-color: color-mix(in srgb, var(--qa-warn) 40%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 6%, var(--qa-surface, transparent));
}
/* بهترین پاسخ: حاشیه و پس‌زمینهٔ سبز */
.qa-answer.is-best {
  border-color: color-mix(in srgb, var(--qa-ok, #16a34a) 50%, transparent);
  background: color-mix(in srgb, var(--qa-ok, #16a34a) 7%, var(--qa-surface, transparent));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--qa-ok, #16a34a) 25%, transparent);
}
.qa-answer.is-best:target {
  border-color: var(--qa-ok, #16a34a);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--qa-ok, #16a34a) 20%, transparent);
}
/* نوار «بهترین پاسخ» در گوشهٔ بالای کارت */
.qa-best-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 10px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 800;
  color: #fff;
  background: var(--qa-ok, #16a34a);
  box-shadow: 0 1px 3px color-mix(in srgb, var(--qa-ok, #16a34a) 30%, transparent);
}
.qa-best-badge svg { color: #fff; }
/* دکمهٔ «بهترین پاسخ» روی کارت */
.qa-best-form { display: inline-flex; }
.qa-best-toggle { color: var(--qa-text-3); }
.qa-best-toggle:hover {
  color: var(--qa-ok, #16a34a);
  border-color: color-mix(in srgb, var(--qa-ok, #16a34a) 35%, transparent);
  background: color-mix(in srgb, var(--qa-ok, #16a34a) 8%, transparent);
}
.qa-best-toggle.is-active {
  color: #fff;
  background: var(--qa-ok, #16a34a);
  border-color: var(--qa-ok, #16a34a);
}
.qa-best-toggle.is-active:hover {
  color: #fff;
  background: color-mix(in srgb, var(--qa-ok, #16a34a) 85%, black);
  border-color: color-mix(in srgb, var(--qa-ok, #16a34a) 85%, black);
}
.qa-answer-head { flex-wrap: wrap; }

/* ---------- ۱۶. فرم پاسخ ---------- */
.qa-reply {
  margin-top: 22px;
  padding: 20px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
}

.qa-closed-note {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: var(--qa-radius-sm);
  background: var(--qa-surface-2);
  color: var(--qa-text-2);
  font-size: 13.5px;
  font-weight: 600;
}
.qa-closed-note a { color: var(--qa-accent); font-weight: 700; text-decoration: none; }
.qa-closed-note a:hover { text-decoration: underline; }

.qa-locked-note {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid color-mix(in srgb, var(--qa-warn) 35%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 8%, transparent);
  color: var(--qa-warn);
}

/* ---------- ۱۷. نوار پیام ---------- */
.qa-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 18px;
  padding: 12px 16px;
  border-radius: var(--qa-radius-sm);
  border: 1px solid var(--qa-border);
  background: var(--qa-surface-2);
  font-size: 13.5px;
}
.qa-banner p { margin: 0; font-weight: 600; }
.qa-banner.is-ok { color: var(--qa-ok); background: color-mix(in srgb, var(--qa-ok) 9%, transparent); border-color: color-mix(in srgb, var(--qa-ok) 30%, transparent); }
.qa-banner.is-waiting { color: var(--qa-warn); background: color-mix(in srgb, var(--qa-warn) 10%, transparent); border-color: color-mix(in srgb, var(--qa-warn) 32%, transparent); }
.qa-banner.is-error { color: var(--qa-err); background: color-mix(in srgb, var(--qa-err) 8%, transparent); border-color: color-mix(in srgb, var(--qa-err) 30%, transparent); }

.qa-banner-close {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font-size: 16px;
  cursor: pointer;
  opacity: .7;
}
.qa-banner-close:hover { opacity: 1; }
.qa-banner-close:disabled {
  opacity: .35;
  cursor: not-allowed;
}

/* شمارش معکوس زندهٔ فلود کنترل (۱.۵.۳) */
.qa-countdown {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  padding: 2px 8px;
  border-radius: var(--qa-radius-xs);
  background: color-mix(in srgb, currentColor 14%, transparent);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .5px;
  direction: ltr;
  margin-inline-start: 6px;
}

/* ---------- ۱۸. سایدبار — سه ویجت به سبک FlatBB ---------- */
.qa-sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

.qa-widget {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
  padding: 16px;
  box-shadow: var(--qa-shadow-sm);
}

.qa-widget-title {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 12px;
  font-size: 13.5px;
  font-weight: 800;
  color: var(--qa-text);
}
.qa-widget-title svg { color: var(--qa-accent); flex: 0 0 auto; }

/* --- ویجت پروفایل کاربر --- */
.qa-wu-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  min-width: 0;
}
.qa-wu-head .qa-avatar { width: 48px; height: 48px; font-size: 19px; }
.qa-wu-head .qa-avatar .qa-grava { background: none; }
.qa-wu-id { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.qa-wu-name {
  font-size: 14.5px;
  font-weight: 800;
  color: var(--qa-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-wu-name a { color: inherit; text-decoration: none; }
.qa-wu-name a:hover { color: var(--qa-accent); }
.qa-wu-role { font-size: 12px; color: var(--qa-text-3); }

.qa-wu-stats {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.qa-wu-stats > a,
.qa-wu-stats > span {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 8px 4px;
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface-2);
  color: var(--qa-text);
  text-decoration: none;
}
.qa-wu-stats > a:hover { background: var(--qa-accent-subtle); }
.qa-wu-stats > a > b,
.qa-wu-stats > span > b { font-size: 15px; font-weight: 800; line-height: 1.4; color: var(--qa-text); }
.qa-wu-stats > a > span,
.qa-wu-stats > span > span { font-size: 11px; color: var(--qa-text-3); }

/* ستون امتیاز در ویجت کاربر — رنگ متمایز */
.qa-wu-score > b { color: var(--qa-accent); }
.qa-wu-score { background: var(--qa-accent-subtle) !important; }

.qa-wu-note {
  margin: 0 0 12px;
  font-size: 12.5px;
  line-height: 1.9;
  color: var(--qa-text-2);
}

.qa-wu-new { width: 100%; }

/* --- ویجت آمار --- */
.qa-stat-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.qa-stat-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--qa-border);
  font-size: 13px;
  color: var(--qa-text-2);
}
.qa-stat-list li:last-child { border-bottom: 0; }
.qa-stat-list b { font-size: 14px; font-weight: 800; color: var(--qa-text); }
.qa-stat-online b { color: var(--qa-ok, #16a34a); }
.qa-stat-online span { display: inline-flex; align-items: center; gap: 6px; }
.qa-online-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--qa-ok, #16a34a);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--qa-ok, #16a34a) 25%, transparent);
  animation: qaOnlinePulse 2s ease-in-out infinite;
}
@keyframes qaOnlinePulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .5; }
}

/* --- ویجت حساب --- */
.qa-auth-row { display: flex; flex-direction: column; gap: 8px; }
.qa-auth-btn { width: 100%; height: 38px; }

/* --- ویجت آخرین اعضا (گرید ۸ آواتار) --- */
.qa-members-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px 8px;
}
.qa-member-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 6px 2px;
  border-radius: var(--qa-radius-xs);
  background: transparent;
  color: var(--qa-text);
  text-decoration: none;
  text-align: center;
  min-width: 0;
  transition: background .15s var(--qa-ease);
}
a.qa-member-card:hover {
  background: var(--qa-accent-subtle);
  text-decoration: none;
}
/* --- تولتیپ یکپارچهٔ همهٔ [data-tooltip] ها (۱.۲.۲) ---
   پیش‌تر فقط کارت‌های اعضا تولتیپ سفارشی داشتند (::after/::before);
   اکنون همهٔ تولتیپ‌ها — از جمله همان کارت‌ها — با یک المان واحدِ
   div.qa-tooltip از forum.js رندر می‌شوند تا استایل همه‌جا یکسان باشد.
   رنگ‌ها ثابت‌اند تا در هر دو حالت روشن/تاریک خوانا باشد. */
.qa-tooltip {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  max-width: min(300px, calc(100vw - 20px));
  padding: 6px 10px;
  border-radius: 8px;
  background: #1f2937;
  color: #ffffff;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.6;
  text-align: center;
  direction: rtl;
  white-space: normal;
  word-break: break-word;
  pointer-events: none;
  opacity: 0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
  transition: opacity .15s var(--qa-ease, ease), transform .15s var(--qa-ease, ease);
  transform: translateY(4px);
}
[data-theme="dark"] .qa-tooltip {
  background: #f3f4f6;
  color: #111827;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .5);
}
.qa-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.qa-tooltip.qa-tooltip-below {
  transform: translateY(-4px);
}
.qa-tooltip.qa-tooltip-below.is-visible {
  transform: translateY(0);
}
.qa-tooltip-arrow {
  position: absolute;
  bottom: -5px;
  left: 50%;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-bottom-width: 0;
  border-top-color: #1f2937;
  transform: translateX(-50%);
}
[data-theme="dark"] .qa-tooltip-arrow {
  border-top-color: #f3f4f6;
}
.qa-tooltip.qa-tooltip-below .qa-tooltip-arrow {
  bottom: auto;
  top: -5px;
  border-top-width: 0;
  border-bottom-width: 5px;
  border-bottom-color: #1f2937;
}
[data-theme="dark"] .qa-tooltip.qa-tooltip-below .qa-tooltip-arrow {
  border-bottom-color: #f3f4f6;
}
@media (prefers-reduced-motion: reduce) {
  .qa-tooltip { transition: none; }
}
.qa-member-card .qa-avatar {
  width: 44px;
  height: 44px;
  font-size: 17px;
  border-radius: 12px;
}
.qa-member-card .qa-avatar .qa-grava {
  border-radius: 12px;
}
.qa-member-name {
  display: block;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--qa-text-2);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.qa-member-card:hover .qa-member-name { color: var(--qa-accent); }

@media (max-width: 420px) {
  .qa-members-grid { grid-template-columns: repeat(4, 1fr); gap: 8px 6px; }
  .qa-member-card .qa-avatar { width: 40px; height: 40px; font-size: 15px; border-radius: 10px; }
  .qa-member-name { font-size: 10px; }
}

/* --- ویجت اعلان‌ها — زنگوله و popup (۱.۵.۲) --- */
/* ویجت قدیمی اعلان‌ها حذف شد؛ اعلان‌ها اکنون در زنگولهٔ ویجت کاربر هستند */
.qa-notif-bell {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--qa-border);
  background: var(--qa-surface);
  color: var(--qa-text-2);
  cursor: pointer;
  flex: 0 0 auto;
  margin-inline-start: auto;
  transition: background .15s, color .15s, border-color .15s;
}
.qa-notif-bell:hover {
  background: var(--qa-accent-subtle);
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
}
.qa-notif-bell.has-unread {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
/* چشمک‌زدن زنگوله هنگام اعلان خوانده‌نشده */
@keyframes qaBellRing {
  0%, 100% { transform: rotate(0deg); }
  10% { transform: rotate(-12deg); }
  20% { transform: rotate(10deg); }
  30% { transform: rotate(-8deg); }
  40% { transform: rotate(6deg); }
  50% { transform: rotate(-4deg); }
  60% { transform: rotate(2deg); }
  70%, 100% { transform: rotate(0deg); }
}
.qa-notif-bell.is-ringing svg {
  transform-origin: top center;
  animation: qaBellRing 1.6s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .qa-notif-bell.is-ringing svg { animation: none; }
}
.qa-notif-bell-badge {
  position: absolute;
  top: -4px;
  inset-inline-end: -4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--qa-err, #dc2626);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 16px;
  text-align: center;
  border: 2px solid var(--qa-bg);
  pointer-events: none;
}
/* popup اعلان‌ها — زیر زنگوله، بالای سایر محتوا
   (۱.۳.۰) سطح شیشه‌ای: اگر پوسته --card-glass داشته باشد (مثل
   Renewal) همان بلور سربرگ پوسته؛ در نبود، سطح توپرِ امن. */
.qa-notif-pop {
  position: absolute;
  top: calc(100% + 8px);
  inset-inline-end: 0;
  width: 320px;
  max-width: calc(100vw - 32px);
  max-height: 420px;
  overflow-y: auto;
  background: var(--card-glass, var(--qa-surface, #FFFFFF));
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  backdrop-filter: blur(18px) saturate(1.5);
  border: 1px solid var(--qa-border-2);
  border-radius: var(--qa-radius-sm);
  box-shadow: var(--shadow-lg, var(--qa-shadow));
  z-index: 50;
  padding: 10px;
  scrollbar-width: thin;
}
[data-theme="dark"] .qa-notif-pop {
  background: var(--card-glass, var(--qa-surface, #1C222C));
}
.qa-notif-pop::-webkit-scrollbar { width: 6px; }
.qa-notif-pop::-webkit-scrollbar-thumb { background: var(--qa-border-2); border-radius: 3px; }
.qa-notif-pop-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--qa-text);
}
.qa-notif-pop-head > span { padding: 2px 4px; }
.qa-notif-pop-empty {
  margin: 16px 8px;
  text-align: center;
  font-size: 12.5px;
  color: var(--qa-text-3);
}
/* موقعیت relative برای ویجت کاربر تا popup نسبت به آن قرار گیرد */
.qa-widget-user { position: relative; }
.qa-wu-head { position: relative; }

/* استایل‌های قدیمی اعلان (۱.۴.۰) — همچنان استفاده می‌شوند در popup */
.qa-widget-notifs .qa-widget-title { gap: 8px; }
.qa-notif-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--qa-err, #dc2626);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  margin-inline-start: 4px;
}
.qa-notif-mark-form { margin: 0; }
.qa-notif-mark-btn {
  background: transparent;
  border: 0;
  color: var(--qa-accent);
  font: inherit;
  font-size: 11.5px;
  font-weight: 700;
  cursor: pointer;
  padding: 2px 6px;
  text-decoration: none;
  border-radius: 4px;
}
.qa-notif-mark-btn:hover { text-decoration: underline; background: var(--qa-accent-subtle); }
.qa-notif-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.qa-notif-item {
  border-radius: var(--qa-radius-xs);
  overflow: hidden;
}
.qa-notif-item.is-unread {
  background: var(--qa-accent-subtle);
}
.qa-notif-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  text-decoration: none;
  color: var(--qa-text);
  border-radius: var(--qa-radius-xs);
  min-width: 0;
}
a.qa-notif-link:hover {
  background: color-mix(in srgb, var(--qa-accent) 8%, transparent);
  text-decoration: none;
}
.qa-notif-icon {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--qa-surface-2);
  color: var(--qa-accent);
}
.qa-notif-item.is-unread .qa-notif-icon { background: var(--qa-accent); color: var(--qa-accent-contrast); }
.qa-notif-text {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.qa-notif-label {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--qa-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-notif-time {
  font-size: 11px;
  color: var(--qa-text-3);
}
.qa-notif-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--qa-accent);
}

/* نوار اعلان مدیر — زرد، برای دیدگاه‌های در انتظار و گزارش‌های تخلف (۱.۴.۱) */
.qa-admin-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  padding: 12px 16px;
  border-radius: var(--qa-radius-sm);
  border: 1px solid color-mix(in srgb, var(--qa-warn) 40%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 12%, transparent);
  color: #92400e;
  font-size: 13.5px;
  font-weight: 700;
}
[data-theme="dark"] .qa-admin-bar {
  color: #fbbf24;
}
.qa-admin-bar > svg {
  flex: 0 0 auto;
  color: var(--qa-warn);
}
.qa-admin-bar-text {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
a.qa-admin-bar-link {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
a.qa-admin-bar-link:hover {
  text-decoration: none;
  opacity: .8;
}
.qa-admin-bar-info {
  font-weight: 600;
}
.qa-admin-bar-sep {
  opacity: .6;
}

/* ---------- ۱۹. صفحهٔ پروفایل ---------- */
.qa-profile {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
  padding: 22px;
  box-shadow: var(--qa-shadow-sm);
}

.qa-profile-head {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--qa-border);
}

/* طرح مدرن: آواتار بالا وسط، نام، نقش، بیو، شبکه‌های اجتماعی، تاریخ */
.qa-profile-id {
  position: relative; /* (۲.۱.۰) برای موقعیت‌دهی دکمه چرخ‌دنده ویرایش پروفایل */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
}
.qa-profile-id .qa-avatar { width: 80px; height: 80px; font-size: 32px; }

.qa-profile-name {
  margin: 4px 0 0;
  font-size: 20px;
  font-weight: 800;
  color: var(--qa-text);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}
.qa-profile-role {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding-inline: 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--qa-accent);
  background: var(--qa-accent-subtle);
}
.qa-profile-bio {
  margin: 6px 0 0;
  font-size: 13.5px;
  line-height: 1.9;
  color: var(--qa-text-2);
  max-width: 480px;
}
.qa-profile-social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 8px;
}
a.qa-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--qa-border);
  background: var(--qa-surface-2);
  color: var(--qa-text-2);
  text-decoration: none;
  transition: background .15s var(--qa-ease), color .15s var(--qa-ease), border-color .15s var(--qa-ease);
}
a.qa-social-link:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
  text-decoration: none;
}
.qa-profile-date {
  margin: 6px 0 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: var(--qa-text-3);
}

.qa-profile-stats {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.qa-pstat {
  flex: 1 1 120px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 12px 10px;
  border-radius: var(--qa-radius-sm);
  background: var(--qa-surface-2);
  color: var(--qa-text);
  text-decoration: none;
  transition: background .15s var(--qa-ease);
}
a.qa-pstat:hover { background: var(--qa-accent-subtle); }
.qa-pstat b { font-size: 19px; font-weight: 800; line-height: 1.4; color: var(--qa-accent); }
.qa-pstat span { font-size: 12px; color: var(--qa-text-3); }

/* ستون امتیاز در پروفایل — برجسته */
.qa-pstat-score { background: var(--qa-accent-subtle); }
.qa-pstat-score b { color: var(--qa-accent); }

/* ستون بهترین‌پاسخ در پروفایل — سبز */
.qa-pstat-best { background: color-mix(in srgb, var(--qa-ok, #16a34a) 12%, transparent); }
.qa-pstat-best b { color: var(--qa-ok, #16a34a); }

/* فرم ویرایش پروفایل (۱.۴.۲) */
.qa-profile-edit {
  margin-top: 22px;
  padding: 20px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  background: var(--qa-surface);
}
.qa-profile-edit-title {
  margin: 0 0 16px;
  font-size: 16px;
  font-weight: 800;
  color: var(--qa-text);
}
.qa-profile-edit-form { gap: 12px; }

/* تب‌های پروفایل — هم‌شکل با qa-sort-bar (۱.۵.۳) */
.qa-profile-tabs-bar {
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: 4px;
  margin-block: 14px 12px;
  border-radius: 999px;
  background: var(--qa-surface-2);
  border: 1px solid var(--qa-border);
}

.qa-profile-list { display: flex; flex-direction: column; gap: 8px; }

.qa-profile-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm);
  background: var(--qa-surface);
  text-decoration: none;
  color: var(--qa-text);
  transition: background .15s var(--qa-ease), border-color .15s var(--qa-ease);
}
.qa-profile-row:hover { background: var(--qa-accent-subtle); border-color: var(--qa-accent-soft); text-decoration: none; }

.qa-pr-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.qa-pr-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
  color: var(--qa-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-pr-title svg { color: var(--qa-accent); flex: 0 0 auto; }
.qa-profile-row:hover .qa-pr-title { color: var(--qa-accent-hov); }
.qa-pr-excerpt {
  font-size: 12.5px;
  color: var(--qa-text-3);
  line-height: 1.8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-pr-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--qa-text-3);
}
.qa-pr-side { flex: 0 0 auto; }

/* ---------- ۲۰. نوار ابزار و شکلک‌ها ---------- */
.qa-toolbar {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  padding: 6px;
  margin-bottom: 8px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface-2);
  position: relative;
}
.qa-toolbar + textarea { margin-top: 0; }

.qa-tb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--qa-text-2);
  cursor: pointer;
  transition: background .15s var(--qa-ease), color .15s var(--qa-ease);
}
.qa-tb-btn:hover { background: var(--qa-accent-soft); color: var(--qa-accent); }
.qa-tb-btn:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: 1px; }
.qa-tb-btn svg { pointer-events: none; }

.qa-tb-emoji.is-open {
  color: var(--qa-accent);
  background: var(--qa-accent-soft);
}

/* (راهنمای ادیتور حذف شد — تمام دکمه‌ها در نوار ابزار موجودند) */

/* نوار شکلک‌ها (۲.۰.۰) — نواری درون‌خطی در همان جعبهٔ نوار ابزار؛
   دو تا سه ردیف شکلک محبوب که همهٔ کامل نمایش داده می‌شوند (بدون
   پیمایش). با کلیک روی هر شکلک بسته نمی‌شود؛ فقط دکمهٔ شکلک
   آن را نشان/مخفی می‌کند تا بتوان چند شکلک پشت‌سرهم درج کرد */
.qa-emoji-bar {
  flex: 0 0 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px dashed var(--qa-border);
}
.qa-emoji-bar[hidden] { display: none; }

.qa-emoji-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  font-size: 21px;
  line-height: 1;
  cursor: pointer;
  transition: background .12s var(--qa-ease), transform .12s var(--qa-ease);
}
.qa-emoji-btn:hover { background: var(--qa-accent-subtle); transform: scale(1.18); }
.qa-emoji-btn:active { transform: scale(.94); }
.qa-emoji-btn:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: 1px; }

/* ---------- ۲۱. کد و نقل قول ---------- */
.qa-code {
  position: relative;
  direction: ltr;
  text-align: start;
  margin: 12px 0;
  padding: 14px 16px;
  border-radius: var(--qa-radius-xs, 10px);
  background: var(--qa-surface-2, #f6f8fa);
  border: 1px solid var(--qa-border, #e1e4e8);
  overflow-x: auto;
  font-family: var(--font-mono, ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace);
  font-size: 13px;
  line-height: 1.75;
  tab-size: 4;
  -webkit-overflow-scrolling: touch;
}
.qa-code code {
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  /* (۲.۱.۰) خطوط طولانی می‌شکنند به‌جای اسکرول افقی؛ اما فاصله‌گذاری حفظ می‌شود */
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  display: block;
}

/* دکمهٔ کپی خودکار روی هر بلوک کد */
.qa-code-copy {
  position: absolute;
  top: 8px;
  inset-inline-end: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 1px solid var(--qa-border);
  border-radius: 8px;
  background: var(--qa-surface);
  color: var(--qa-text-2);
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s var(--qa-ease), background .15s var(--qa-ease),
    color .15s var(--qa-ease), border-color .15s var(--qa-ease);
}
.qa-code:hover .qa-code-copy,
.qa-code-copy:focus-visible { opacity: 1; }
.qa-code-copy:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
.qa-code-copy.is-copied {
  background: var(--qa-ok, #16a34a);
  border-color: var(--qa-ok, #16a34a);
  color: #fff;
  opacity: 1;
}
.qa-code-copy.is-copied::after {
  content: 'کپی شد';
  position: absolute;
  inset-inline-end: 38px;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 700;
  color: var(--qa-ok, #16a34a);
}
@media (hover: none) {
  /* در دستگاه‌های لمسی همیشه دکمهٔ کپی نمایان باشد */
  .qa-code-copy { opacity: 1; }
}

.qa-code-i {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
  padding: 1px 7px;
  border-radius: 6px;
  background: var(--qa-accent-subtle);
  border: 1px solid var(--qa-accent-soft);
  font-family: var(--font-mono, ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace);
  font-size: .88em;
  color: inherit;
}

.qa-quote {
  margin: 12px 0;
  padding: 8px 14px;
  border-inline-start: 3px solid var(--qa-border-2, #cbd5e1);
  background: transparent;
  color: var(--qa-text-2, #6b7280);
}
[data-theme="dark"] .qa-quote {
  border-inline-start-color: var(--qa-border-2, #374151);
}
.qa-quote-head {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--qa-text-3, #9ca3af);
}
.qa-quote-body {
  font-size: 14px;
  line-height: 1.85;
  color: inherit;
}

.qa-img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 10px 0;
  border-radius: var(--qa-radius-xs);
  border: 1px solid var(--qa-border);
}
/* cursor: zoom-in فقط وقتی لایت‌باکس فعال باشد */
.qa-main[data-qa-lightbox="1"] .qa-lightbox-img { cursor: zoom-in; }

/* لایت‌باکس تصاویر (۱.۵.۱) */
.qa-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .85);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
}
.qa-lightbox.is-open {
  opacity: 1;
  pointer-events: auto;
}
.qa-lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, .5);
  transform: scale(.95);
  transition: transform .2s ease;
}
.qa-lightbox.is-open img {
  transform: scale(1);
}
.qa-lightbox-close {
  position: absolute;
  top: 16px;
  inset-inline-end: 16px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .15);
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  transition: background .15s ease;
}
.qa-lightbox-close:hover { background: rgba(255, 255, 255, .3); }

/* ---------- ۲۲. نقل قول سریع ---------- */
.qa-quote-btn { /* همان qa-post-action */ }

/* ---------- ۲۲.۵. نظرسنجی (۱.۶.۰) ---------- */
.qa-poll-field { margin-top: 4px; }
.qa-poll-toggle-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--qa-text-2);
}
.qa-poll-toggle-label input { width: 16px; height: 16px; }
.qa-poll-q {
  width: 100%;
  margin-bottom: 8px;
  padding: 8px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  color: var(--qa-text);
  font: inherit;
  font-size: 13.5px;
}
.qa-poll-options textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  color: var(--qa-text);
  font: inherit;
  font-size: 13.5px;
  resize: vertical;
  min-height: 80px;
}

/* یادداشت هشدار کهربایی — مثلاً حذف نظرسنجی هنگام ویرایش (۲.۰.۰) */
.qa-field-note.qa-field-note--warn { color: var(--qa-warn); }

.qa-poll {
  margin: 16px 0;
  padding: 18px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm);
  background: var(--qa-surface-2);
}
.qa-poll-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 800;
  color: var(--qa-text);
}
.qa-poll-title svg { color: var(--qa-accent); flex: 0 0 auto; }
.qa-poll-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  margin-bottom: 8px;
  cursor: pointer;
  transition: border-color .15s var(--qa-ease), background .15s var(--qa-ease);
}
.qa-poll-option:hover {
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
.qa-poll-option input { width: 18px; height: 18px; flex: 0 0 auto; }
.qa-poll-option-text { font-size: 14px; color: var(--qa-text); }
.qa-poll-vote-btn { margin-top: 4px; }

.qa-poll-results { display: flex; flex-direction: column; gap: 10px; }
.qa-poll-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
  font-size: 13.5px;
  color: var(--qa-text);
}
.qa-poll-result-count { font-weight: 700; color: var(--qa-text-2); font-size: 12.5px; }
.qa-poll-bar {
  height: 8px;
  border-radius: 999px;
  background: var(--qa-surface);
  overflow: hidden;
}
.qa-poll-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: var(--qa-grad);
  transition: width .3s var(--qa-ease);
}
.qa-poll-total {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--qa-text-3);
  text-align: center;
}

/* ---------- ۲۳. پابرگ (قالب مستقل) ---------- */
.qa-footer {
  border-top: 1px solid var(--qa-border);
  padding: 18px 20px 26px;
  text-align: center;
  font-size: 12.5px;
  color: var(--qa-text-3);
}
.qa-footer p { margin: 0; }
.qa-footer a { color: var(--qa-text-2); text-decoration: none; font-weight: 600; }
.qa-footer a:hover { color: var(--qa-accent); }
.qa-footer-sep { margin: 0 8px; opacity: .6; }

/* ---------- ۲۴. واکنش‌گرایی ---------- */
@media (max-width: 860px) {
  .qa-main { padding-inline: 16px; }
  .qa-fhead { padding: 20px 20px 16px; }
  .qa-fhead-title { font-size: 21px; }
  .qa-fhead-row { align-items: flex-start; flex-direction: column; }
  .qa-fhead-user { align-self: stretch; display: flex; justify-content: flex-start; }
  .qa-fhead-search { flex: 1 1 100%; max-width: none; margin-inline-start: 0; }
  .qa-item { gap: 10px; padding: 12px 14px; }
  .qa-item-side { display: none; }
  .qa-profile-id .qa-avatar { width: 56px; height: 56px; font-size: 22px; }
  /* جعبهٔ مرتب‌سازی در موبایل سرریز نکند */
  .qa-stats { gap: 8px; }
  .qa-sort-bar { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .qa-sort-bar::-webkit-scrollbar { display: none; }
  .qa-sort-ask { height: 40px; padding-inline: 14px; }
  .qa-sort-home + a.qa-sort-btn::before { margin-inline-end: 2px; }
}

@media (max-width: 420px) {
  .qa-fhead-title { font-size: 19px; }
  .qa-fhead-mark { width: 44px; height: 44px; border-radius: 13px; }
  .qa-fhead-stat { height: 28px; padding-inline: 10px; font-size: 11.5px; }
  .qa-usermenu-name { max-width: 90px; }
  .qa-form-actions .qa-btn { width: 100%; }
  .qa-wu-stats > a > span,
  .qa-wu-stats > span > span { font-size: 10px; }
}

/* ---------- ۲۵. حرکت کمتر و چاپ ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

@media print {
  .qa-sidebar,
  .qa-emoji-bar,
  .qa-question-tools,
  .qa-answer-actions,
  .qa-question-actions,
  .qa-search,
  .qa-stats,
  .qa-usermenu-pop,
  .qa-pagination { display: none !important; }
  .qa-fhead { background: none; box-shadow: none; border: 1px solid var(--qa-border); color: var(--qa-text); }
  .qa-fhead::before, .qa-fhead::after { display: none; }
  .qa-fhead-title, .qa-fhead-intro, .qa-fhead-stat, .qa-fhead-stat b { color: var(--qa-text); }
  .qa-fhead-mark { background: none; border-color: var(--qa-border); color: var(--qa-text); }
}

/* ===================================================================
   ۱.۵.۰ — قابلیت‌های جدید: «در حال پیگیری»، آیکون نظرسنجی،
   برجسته‌سازی گزارش‌شده، دسته‌بندی‌ها، صفحهٔ مدیریت دسته‌ها
   =================================================================== */

/* ---------- «در حال پیگیری» — نشان آبی، متمایز اما هماهنگ ---------- */
.qa-badge.is-tracked {
  color: var(--qa-info);
  background: color-mix(in srgb, var(--qa-info) 13%, transparent);
}
.qa-track-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  color: var(--qa-info);
  background: color-mix(in srgb, var(--qa-info) 14%, transparent);
  flex: 0 0 auto;
}
.qa-item.is-tracked .qa-item-title-text { color: var(--qa-text); }
.qa-question.is-tracked { border-color: color-mix(in srgb, var(--qa-info) 35%, transparent); }
.qa-question.is-tracked::before {
  background: var(--qa-info);
}
.qa-post-action.is-tracked-btn {
  color: var(--qa-info);
  background: color-mix(in srgb, var(--qa-info) 14%, transparent);
}

/* ---------- نشان نظرسنجی در فهرست پرسش‌ها ---------- */
.qa-poll-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  color: var(--qa-accent);
  background: var(--qa-accent-soft);
  flex: 0 0 auto;
}

/* ---------- نشان «گزارش‌شده» در فهرست + صفحهٔ پرسش ---------- */
.qa-reported-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  color: var(--qa-warn);
  background: color-mix(in srgb, var(--qa-warn) 14%, transparent);
  flex: 0 0 auto;
}

/* برجسته‌سازی زرد ردیف گزارش‌شده — فهرست و صفحهٔ پرسش */
.qa-item.is-reported {
  background: color-mix(in srgb, #FFD54F 22%, transparent) !important;
  border-inline-start: 3px solid var(--qa-warn);
}
.qa-item.is-reported:hover {
  background: color-mix(in srgb, #FFD54F 32%, transparent) !important;
}
.qa-question.is-reported,
.qa-answer.is-reported {
  background: color-mix(in srgb, #FFD54F 14%, transparent);
  border-color: color-mix(in srgb, #FFD54F 60%, transparent);
  border-inline-start: 3px solid var(--qa-warn);
}
/* اگر هم سنجاق است هم گزارش‌شده، سنجاق برجسته‌تر می‌ماند ولی نوار زرد گزارش نشان داده می‌شود */
.qa-item.is-pinned.is-reported {
  background: color-mix(in srgb, #FFD54F 28%, var(--qa-accent-subtle)) !important;
}

/* ---------- دسته‌بندی: نشان کنار عنوان پرسش در فهرست و صفحه ---------- */
.qa-item-cat,
.qa-question-cat {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  padding: 2px 8px;
  border-radius: 999px;
  color: var(--cat-color, var(--qa-accent));
  background: color-mix(in srgb, var(--cat-color, var(--qa-accent)) 12%, transparent);
  white-space: nowrap;
}
.qa-item-cat:hover,
.qa-question-cat:hover {
  background: color-mix(in srgb, var(--cat-color, var(--qa-accent)) 20%, transparent);
  color: var(--cat-color, var(--qa-accent-hov));
  text-decoration: none;
}
.qa-item-cat svg,
.qa-question-cat svg { flex: 0 0 auto; }

/* ---------- فیلد انتخاب دسته در فرم ---------- */
.qa-field-category select {
  font: inherit;
  padding: 8px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  color: var(--qa-text);
  width: 100%;
}
.qa-field-category select:focus {
  outline: 2px solid var(--qa-accent);
  outline-offset: 1px;
  border-color: var(--qa-accent);
}

/* ---------- ویجت دسته‌بندی‌ها در سایدبار ---------- */
.qa-widget-categories { /* مانند سایر ویجت‌ها — فقط برای تمایز ظریف */ }
.qa-widget-title-action {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  color: var(--qa-text-3);
  padding: 4px;
  border-radius: 6px;
  text-decoration: none;
}
.qa-widget-title-action:hover {
  color: var(--qa-accent);
  background: var(--qa-accent-subtle);
}
.qa-cat-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 360px;
  overflow-y: auto;
  /* scrollbar ظریف */
  scrollbar-width: thin;
}
.qa-cat-nav::-webkit-scrollbar { width: 6px; }
.qa-cat-nav::-webkit-scrollbar-thumb { background: var(--qa-border-2); border-radius: 3px; }
.qa-cat-nav li {
  border-radius: var(--qa-radius-xs);
}
.qa-cat-nav li.is-active {
  background: var(--qa-accent-subtle);
}
.qa-cat-nav-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  text-decoration: none;
  color: var(--qa-text-2);
  font-size: 13.5px;
  font-weight: 600;
  border-radius: var(--qa-radius-xs);
}
.qa-cat-nav-link:hover {
  background: var(--qa-surface-2);
  color: var(--qa-text);
  text-decoration: none;
}
.qa-cat-nav li.is-active .qa-cat-nav-link {
  color: var(--cat-color, var(--qa-accent));
}
.qa-cat-nav-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--cat-color, var(--qa-text-3));
  flex: 0 0 auto;
}
.qa-cat-nav li.is-active .qa-cat-nav-icon {
  color: var(--cat-color, var(--qa-accent));
}
.qa-cat-nav-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-cat-nav-count {
  font-size: 11px;
  font-weight: 700;
  color: var(--qa-text-3);
  background: var(--qa-surface-2);
  padding: 1px 8px;
  border-radius: 999px;
  flex: 0 0 auto;
}
.qa-cat-nav li.is-active .qa-cat-nav-count {
  background: color-mix(in srgb, var(--cat-color, var(--qa-accent)) 18%, transparent);
  color: var(--cat-color, var(--qa-accent));
}

/* ---------- صفحهٔ مدیریت دسته‌بندی‌ها ---------- */
.qa-cat-admin {
  margin-top: 26px;
  padding: 22px 22px 22px;
  background: var(--qa-surface);
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
}
.qa-cat-admin-section-title {
  margin: 0 0 16px;
  font-size: 16px;
  font-weight: 700;
  color: var(--qa-text);
  display: flex;
  align-items: center;
  gap: 8px;
}
.qa-cat-admin-section-title svg { color: var(--qa-accent); }
.qa-cat-count {
  font-size: 13px;
  font-weight: 600;
  color: var(--qa-text-3);
}
.qa-cat-form { gap: 12px; }
.qa-cat-form .qa-form-row {
  grid-template-columns: 2fr 1fr 1fr 1fr;
}
.qa-cat-icon-field select,
.qa-cat-order-field input {
  width: 100%;
  font: inherit;
  padding: 8px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  color: var(--qa-text);
}
.qa-cat-color-field input[type="color"] {
  width: 100%;
  height: 38px;
  padding: 2px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  cursor: pointer;
}
.qa-cat-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.qa-cat-item {
  padding: 16px;
  background: var(--qa-bg);
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm);
  border-inline-start: 3px solid var(--cat-color, var(--qa-accent));
}
.qa-cat-item-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.qa-cat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--cat-color, var(--qa-accent)) 14%, transparent);
  color: var(--cat-color, var(--qa-accent));
  flex: 0 0 auto;
}
.qa-cat-name {
  font-weight: 700;
  color: var(--qa-text);
  font-size: 14px;
}
.qa-cat-meta {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.qa-cat-count-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 9px;
  border-radius: 999px;
  background: var(--qa-surface-2);
  color: var(--qa-text-2);
}
.qa-cat-color-dot {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid var(--qa-border-2);
}
.qa-cat-edit-form { gap: 10px; }
.qa-cat-delete-form {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--qa-border);
}
.qa-cat-delete-row {
  grid-template-columns: 1fr auto;
  align-items: end;
}
.qa-cat-reassign-field select {
  width: 100%;
  font: inherit;
  padding: 8px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  color: var(--qa-text);
}
.qa-btn-danger {
  background: var(--qa-err);
  color: #fff;
  border: 1px solid var(--qa-err);
  font: inherit;
  font-weight: 700;
  padding: 9px 16px;
  border-radius: var(--qa-radius-xs);
  cursor: pointer;
}
.qa-btn-danger:hover {
  background: color-mix(in srgb, var(--qa-err) 88%, #000);
}

/* ---------- ریسپانسیو: کاهش ستون‌های فرم دسته در صفحهٔ کوچک ---------- */
@media (max-width: 720px) {
  .qa-cat-form .qa-form-row,
  .qa-cat-edit-form .qa-form-row {
    grid-template-columns: 1fr;
  }
  .qa-cat-delete-row {
    grid-template-columns: 1fr;
  }
}

/* ===================================================================
   ۱.۵.۱ — قابلیت‌های جدید: «پنهان از مهمان»، حذف پرسش/پاسخ،
   اصلاح وضعیت خالی فیلتر خوانده‌نشده
   =================================================================== */

/* ---------- «پنهان از مهمان» — نشان خاکستری/بنفش ملایم ---------- */
.qa-badge.is-hidden {
  color: var(--qa-text-3);
  background: color-mix(in srgb, var(--qa-text-3) 14%, transparent);
}
.qa-hidden-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  color: var(--qa-text-3);
  background: color-mix(in srgb, var(--qa-text-3) 14%, transparent);
  flex: 0 0 auto;
}
.qa-post-action.is-hidden-btn {
  color: var(--qa-text-3);
  background: color-mix(in srgb, var(--qa-text-3) 14%, transparent);
}
/* پرسش پنهان در فهرست — ظاهر کم‌رنگ‌تر برای مدیر */
.qa-item.is-hidden .qa-item-title-text {
  color: var(--qa-text-2);
  opacity: .9;
}
.qa-item.is-hidden {
  border-inline-start: 3px solid var(--qa-text-3);
}

/* ---------- دکمهٔ حذف — رنگ قرمز ملایم ---------- */
.qa-delete-btn {
  color: var(--qa-err);
}
.qa-delete-btn:hover {
  background: color-mix(in srgb, var(--qa-err) 14%, transparent);
  color: var(--qa-err);
}
.qa-delete-form,
.qa-delete-form--answer {
  display: inline-flex;
}



/* ===================================================================
   ۱.۲.۱ — مودال تأیید سفارشی (به‌جای window.confirm)
   ----------------------------------------------------------------
   مودال داخل .qa-main ساخته می‌شود؛ بنابراین متغیرهای رنگی پوسته
   (روشن/تاریک) مستقیماً به آن ارث می‌رسد. برای حالت پشتیبان (نصب
   روی body)، توکن‌ها یک‌بار دیگر با همان فرمول‌های .qa-main روی
   خود .qa-modal هم مشتق می‌شوند. چهار رنگ‌بندی روی data-variant:
   danger | warn | info | ok
   =================================================================== */

/* توکن‌های پشتیبان — فقط در نبود ارث‌بری از .qa-main/.qa-body اثر دارند */
.qa-modal {
  --qa-text: var(--text, var(--text-primary, rgba(0, 0, 0, .87)));
  --qa-text-2: var(--text-2, var(--text-secondary, rgba(127, 127, 127, 1)));
  --qa-accent: var(--accent, var(--accent-color, #7C3AED));
  --qa-border: var(--border, var(--border-color, rgba(127, 127, 127, .24)));
  --qa-surface: var(--surface, var(--bg-secondary, rgba(127, 127, 127, .05)));
  --qa-radius-sm: var(--radius-sm, 8px);
  --qa-ok: #0E9F6E;
  --qa-warn: #B45309;
  --qa-err: #DC2626;
  --qa-info: #2563EB;
}
[data-theme="dark"] .qa-modal {
  --qa-text: var(--text, var(--text-primary, rgba(233, 238, 247, .92)));
  --qa-text-2: var(--text-2, var(--text-secondary, rgba(175, 180, 190, 1)));
}

/* ریشهٔ مودال — لایهٔ تمام‌صفحه */
.qa-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility 0s linear .18s;
}
.qa-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .18s ease;
}

/* پس‌زمینهٔ تیره — کلیک روی آن = لغو */
.qa-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .52);
}
[data-theme="dark"] .qa-modal-backdrop {
  background: rgba(0, 0, 0, .68);
}

/* کارت دیالوگ — پس‌زمینهٔ مات از خود پوسته، در نبودش خنثی روشن/تاریک
   (۱.۳.۰) با پوسته‌های شیشه‌ای (مثل Renewal) همان --card-glass + بلور */
.qa-modal-dialog {
  position: relative;
  width: min(440px, 100%);
  padding: 22px 24px 20px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm, 10px);
  background: var(--card-glass, var(--bg, var(--bg-primary, #FFFFFF)));
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  backdrop-filter: blur(18px) saturate(1.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .14), 0 2px 6px rgba(0, 0, 0, .08);
  transform: translateY(10px) scale(.97);
  transition: transform .18s var(--qa-ease, ease);
}
[data-theme="dark"] .qa-modal-dialog {
  background: var(--card-glass, var(--bg, var(--bg-primary, #1C222C)));
  box-shadow: 0 8px 24px rgba(0, 0, 0, .42), 0 2px 6px rgba(0, 0, 0, .3);
}
.qa-modal.is-open .qa-modal-dialog {
  transform: translateY(0) scale(1);
}

/* آیکون وضعیت — رنگ از variant */
.qa-modal-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  margin-bottom: 12px;
}
.qa-modal[data-variant="danger"] .qa-modal-icon {
  color: var(--qa-err);
  background: color-mix(in srgb, var(--qa-err) 12%, transparent);
}
.qa-modal[data-variant="warn"] .qa-modal-icon {
  color: var(--qa-warn);
  background: color-mix(in srgb, var(--qa-warn) 12%, transparent);
}
.qa-modal[data-variant="info"] .qa-modal-icon {
  color: var(--qa-info);
  background: color-mix(in srgb, var(--qa-info) 12%, transparent);
}
.qa-modal[data-variant="ok"] .qa-modal-icon {
  color: var(--qa-ok);
  background: color-mix(in srgb, var(--qa-ok) 12%, transparent);
}

/* عنوان و متن */
.qa-modal-title {
  margin: 0 0 6px;
  font-size: 16.5px;
  font-weight: 800;
  line-height: 1.7;
  color: var(--qa-text);
}
.qa-modal-desc {
  margin: 0;
  font-size: 13.5px;
  line-height: 2;
  color: var(--qa-text-2);
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: pre-line;
}

/* ردیف دکمه‌ها — ترتیب: تأیید سپس لغو (مطابق الگوی سایر فرم‌های افزونه) */
.qa-modal-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.qa-modal-actions .qa-btn {
  min-width: 96px;
  height: 38px;
  font-size: 13px;
}

/* آیکون داخل دکمه‌های مودال — Lucide، هماهنگ با اکشن‌های انجمن */
.qa-modal-btn-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.qa-modal-btn-ico svg {
  display: block;
  margin-top: -1px;
}

/* حالت اطلاع‌رسانی (تک‌دکمه‌ای) — دکمهٔ لغو پنهان و دکمه در مرکز */
.qa-modal[data-notice="1"] .qa-modal-actions {
  justify-content: center;
}

/* ورودی مودال (حالت prompt) — هم‌خانوادهٔ فیلدهای فرم انجمن */
.qa-modal-input {
  width: 100%;
  margin-top: 12px;
  height: 42px;
  padding-inline: 14px;
  border: 1px solid var(--qa-border);
  border-radius: 999px;
  background: var(--qa-surface);
  color: var(--qa-text);
  font: inherit;
  font-size: 13px;
  direction: ltr;
  text-align: left;
  outline: none;
  transition: border-color .16s var(--qa-ease, ease), box-shadow .16s var(--qa-ease, ease);
}
.qa-modal-input:focus {
  border-color: var(--qa-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--qa-accent) 18%, transparent);
}
.qa-modal-input::placeholder {
  color: var(--qa-text-2);
  opacity: .8;
}

/* در حالت prompt، فاصلهٔ ردیف دکمه‌ها از ورودی */
.qa-modal[data-prompt="1"] .qa-modal-actions {
  margin-top: 14px;
}

/* دکمهٔ تأیید — رنگ بر اساس variant */
.qa-modal-confirm {
  background: var(--qa-warn);
  border-color: var(--qa-warn);
  color: #fff;
}
.qa-modal-confirm:hover {
  filter: brightness(1.06);
  color: #fff;
}
.qa-modal[data-variant="danger"] .qa-modal-confirm {
  background: var(--qa-err);
  border-color: var(--qa-err);
}
.qa-modal[data-variant="info"] .qa-modal-confirm {
  background: var(--qa-info);
  border-color: var(--qa-info);
}
.qa-modal[data-variant="ok"] .qa-modal-confirm {
  background: var(--qa-ok);
  border-color: var(--qa-ok);
}
/* حالت تاریک: رنگ‌های وضعیت کمی روشن‌تر برای خوانایی بهتر */
[data-theme="dark"] .qa-modal[data-variant="warn"] .qa-modal-confirm { background: #D97706; border-color: #D97706; }
[data-theme="dark"] .qa-modal[data-variant="danger"] .qa-modal-confirm { background: #EF4444; border-color: #EF4444; }
[data-theme="dark"] .qa-modal[data-variant="info"] .qa-modal-confirm { background: #3B82F6; border-color: #3B82F6; }
[data-theme="dark"] .qa-modal[data-variant="ok"] .qa-modal-confirm { background: #10B981; border-color: #10B981; }

/* دکمهٔ لغو — شبح‌وار، هماهنگ با پوسته */
.qa-modal-cancel {
  background: transparent;
  border-color: var(--qa-border);
  color: var(--qa-text-2);
}
.qa-modal-cancel:hover {
  background: var(--qa-surface);
  color: var(--qa-text);
}

/* بدون انیمیشن برای کاربرانی که ترد حرکت را کاهش داده‌اند */
@media (prefers-reduced-motion: reduce) {
  .qa-modal,
  .qa-modal-dialog {
    transition: none !important;
  }
}

/* موبایل: دکمه‌ها تمام‌عرض و دیالوگ چسبیده به پایین */
@media (max-width: 480px) {
  .qa-modal {
    padding: 14px;
    align-items: flex-end;
  }
  .qa-modal-dialog {
    padding: 18px 18px 16px;
  }
  .qa-modal-actions {
    flex-direction: column-reverse;
  }
  .qa-modal-actions .qa-btn {
    width: 100%;
    min-width: 0;
  }
  .qa-modal-input {
    height: 46px;
  }
}

/* ====================================================================
   ۲.۱.۰ — ویرایش پروفایل، پیام خصوصی، گالری، مودال گالری
   ==================================================================== */

/* ---------- دکمه مینیمال ویرایش پروفایل داخل qa-profile ---------- */
.qa-profile-edit-icon {
  position: absolute;
  top: 12px;
  inset-inline-end: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  color: var(--qa-text-muted);
  background: transparent;
  border: 1px solid transparent;
  text-decoration: none;
  transition: all .2s ease;
  z-index: 3;
}
.qa-profile-edit-icon:hover {
  background: var(--qa-card);
  color: var(--qa-accent);
  border-color: var(--qa-border-2);
}
/* (رفع ۲.۱.۰) حذف border-bottom اضافی .qa-profile-head */
.qa-profile-head {
  border-bottom: none !important;
}
/* دکمه ارسال پیام خصوصی در پروفایل */
.qa-profile-pm-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 7px 12px;
  font-size: 12.5px;
  border-radius: 8px;
}

/* (قدیمی — نگه‌داشته نشده، صرفاً برای سازگاری) */
.qa-profile-edit-fab {
  position: absolute;
  top: 14px;
  inset-inline-end: 0;
  z-index: 5;
}
.qa-profile-edit-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 4px 12px -4px var(--qa-accent);
}
.qa-profile-edit-btn svg {
  flex-shrink: 0;
}

/* ---------- صفحهٔ ویرایش پروفایل ---------- */
.qa-profile-edit-page {
  position: relative;
  padding-top: 18px;
}
.qa-profile-edit-actions {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  margin-inline-start: auto;
}
.qa-profile-edit-card {
  background: var(--qa-card);
  border: 1px solid var(--qa-border);
  border-radius: 16px;
  padding: 22px;
  margin-bottom: 18px;
  box-shadow: 0 2px 8px -2px rgba(0,0,0,.04);
}
.qa-profile-edit-card .qa-profile-edit-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 18px 0;
  color: var(--qa-text);
}
.qa-profile-edit-card .qa-profile-edit-title svg {
  color: var(--qa-accent);
}
.qa-profile-edit-card .qa-form {
  display: grid;
  gap: 14px;
}
.qa-profile-edit-card .qa-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.qa-profile-edit-card .qa-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.qa-profile-edit-card .qa-field label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--qa-text-muted);
}
.qa-profile-edit-card .qa-field input,
.qa-profile-edit-card .qa-field textarea {
  width: 100%;
  border: 1px solid var(--qa-border-2);
  border-radius: 10px;
  padding: 10px 12px;
  font: inherit;
  font-size: 14px;
  background: var(--qa-input-bg, var(--qa-card));
  color: var(--qa-text);
}
.qa-profile-edit-card .qa-field input:focus,
.qa-profile-edit-card .qa-field textarea:focus {
  outline: none;
  border-color: var(--qa-accent);
  box-shadow: 0 0 0 3px var(--qa-accent-subtle);
}
.qa-profile-edit-card .qa-field-hint {
  font-size: 11.5px;
  color: var(--qa-text-muted);
  margin: 0;
}
.qa-profile-edit-card .qa-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.qa-profile-edit-hint {
  font-size: 12px;
  color: var(--qa-text-muted);
  margin: 10px 0 0 0;
}
@media (max-width: 640px) {
  .qa-profile-edit-card .qa-form-row {
    grid-template-columns: 1fr;
  }
  .qa-profile-edit-actions {
    margin-inline-start: 0;
  }
}

/* ---------- منوی کاربر — بج و آیتم اکسنت ---------- */
.qa-usermenu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  color: var(--qa-text);
  text-decoration: none;
  border-radius: 10px;
  font-size: 13.5px;
  font-weight: 500;
  position: relative;
}
.qa-usermenu-item:hover {
  background: var(--qa-accent-subtle);
}
/* (۲.۱.۰) آیتم فعال — فقط پس‌زمینه ملایم، بدون تغییر رنگ متن/آیکون */
.qa-usermenu-item.is-active {
  background: var(--qa-accent-subtle);
  color: var(--qa-accent);
}
.qa-usermenu-item.is-active svg {
  color: var(--qa-accent);
}
.qa-usermenu-item.is-danger {
  color: var(--qa-danger, #dc2626);
}
.qa-usermenu-item.is-danger:hover {
  background: var(--qa-danger-subtle, rgba(220, 38, 38, .12));
}
/* (۲.۱.۰) آیکون‌ها هم‌رنگ متن در هر دو حالت روشن/تیره —
   چون از currentColor استفاده می‌کنند، در دارک مود سفید و در لایت مود سیاه می‌شوند. */
.qa-usermenu-item svg {
  flex-shrink: 0;
  color: inherit;
}
.qa-usermenu-badge {
  margin-inline-start: auto;
  background: var(--qa-accent);
  color: var(--qa-accent-contrast, #fff);
  border-radius: 10px;
  padding: 2px 8px;
  font-size: 11.5px;
  font-weight: 700;
}

/* ---------- صفحات پیام خصوصی ---------- */
.qa-pm {
  padding: 18px 0;
}
.qa-pm-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.qa-pm-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 700;
  margin: 0;
}
.qa-pm-compose-btn svg { flex-shrink: 0; }
.qa-pm-tabs-bar {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  background: var(--qa-card);
  border: 1px solid var(--qa-border);
  border-radius: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.qa-pm-quota {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--qa-text-muted);
}
.qa-pm-quota b { color: var(--qa-text); font-weight: 700; }
.qa-sort-badge.qa-sort-badge-accent {
  background: var(--qa-accent);
  color: var(--qa-accent-contrast, #fff);
}

/* لیست پیام‌ها */
.qa-pm-list {
  background: var(--qa-card);
  border: 1px solid var(--qa-border);
  border-radius: 14px;
  overflow: hidden;
}
.qa-pm-list-ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.qa-pm-row,
.qa-pm-blocked-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--qa-border);
}
.qa-pm-row:last-child,
.qa-pm-blocked-row:last-child {
  border-bottom: none;
}
.qa-pm-row.is-unread {
  background: var(--qa-accent-subtle);
}
.qa-pm-row-main {
  flex: 1;
  display: grid;
  grid-template-columns: 40px 1fr auto auto;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--qa-text);
  min-width: 0;
}
.qa-pm-row-from {
  display: flex;
  align-items: center;
  justify-content: center;
}
.qa-pm-row-from-name {
  display: none;
}
.qa-pm-row-subject {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--qa-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.qa-pm-row.is-unread .qa-pm-row-subject { color: var(--qa-accent); }
.qa-pm-row-time {
  font-size: 12px;
  color: var(--qa-text-muted);
  white-space: nowrap;
}
.qa-pm-row-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--qa-accent);
  flex-shrink: 0;
}
.qa-pm-row-del {
  background: none;
  border: none;
  color: var(--qa-text-muted);
  cursor: pointer;
  padding: 6px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.qa-pm-row-del:hover {
  background: var(--qa-danger-subtle, rgba(220, 38, 38, .12));
  color: var(--qa-danger, #dc2626);
}
.qa-pm-blocked-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.qa-pm-blocked-avatar {
  flex-shrink: 0;
}
.qa-pm-blocked-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.qa-pm-blocked-name {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--qa-text);
  text-decoration: none;
}
.qa-pm-blocked-name:hover { color: var(--qa-accent); }
.qa-pm-blocked-time {
  font-size: 11.5px;
  color: var(--qa-text-muted);
}
.qa-pm-inline-form {
  margin: 0;
}
.qa-btn-sm {
  padding: 5px 10px;
  font-size: 12px;
  border-radius: 8px;
}

/* compose form */
.qa-pm-compose {
  background: var(--qa-card);
  border: 1px solid var(--qa-border);
  border-radius: 14px;
  padding: 22px;
}
.qa-pm-compose-form {
  display: grid;
  gap: 14px;
}
.qa-pm-field-recipient {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.qa-pm-recipient-fixed {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid var(--qa-border-2);
  border-radius: 10px;
  background: var(--qa-input-bg, var(--qa-card));
}
.qa-pm-recipient-name {
  font-weight: 600;
  color: var(--qa-text);
}
.qa-pm-recipient-clear {
  margin-inline-start: auto;
  color: var(--qa-text-muted);
  text-decoration: none;
  font-size: 16px;
  padding: 0 6px;
  line-height: 1;
}
.qa-pm-recipient-clear:hover { color: var(--qa-danger, #dc2626); }
.qa-pm-body-field .qa-toolbar {
  margin-bottom: 6px;
}
.qa-pm-body-field textarea {
  width: 100%;
  border: 1px solid var(--qa-border-2);
  border-radius: 10px 10px 12px 12px;
  padding: 12px;
  font: inherit;
  font-size: 14px;
  background: var(--qa-input-bg, var(--qa-card));
  color: var(--qa-text);
  min-height: 160px;
  resize: vertical;
}

/* view message */
.qa-pm-view {
  background: var(--qa-card);
  border: 1px solid var(--qa-border);
  border-radius: 14px;
  overflow: hidden;
}
.qa-pm-view-head {
  padding: 18px 22px;
  border-bottom: 1px solid var(--qa-border);
  background: var(--qa-accent-subtle);
}
.qa-pm-view-subject {
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 14px 0;
  color: var(--qa-text);
}
.qa-pm-view-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--qa-text-muted);
}
.qa-pm-view-from {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.qa-pm-from-name {
  font-weight: 600;
  color: var(--qa-text);
  display: block;
}
.qa-pm-from-role {
  font-size: 11px;
  color: var(--qa-text-muted);
  display: block;
}
.qa-pm-view-time {
  margin-inline-start: auto;
  font-size: 12px;
}
.qa-pm-view-body {
  padding: 22px;
  font-size: 14px;
  line-height: 1.8;
  color: var(--qa-text);
}
.qa-pm-view-body .qa-img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 8px 0;
}
.qa-pm-view-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px 22px;
  border-top: 1px solid var(--qa-border);
  background: var(--qa-card);
}
.qa-pm-view-actions .qa-pm-inline-form {
  margin: 0;
}

/* ---------- گالری تصاویر ---------- */
.qa-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin: 14px 0;
}
.qa-gallery.qa-gallery-cols-3 {
  grid-template-columns: repeat(3, 1fr);
}
.qa-gallery-item {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  background: var(--qa-border-2);
  cursor: zoom-in;
  text-decoration: none;
}
.qa-gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}
.qa-gallery-item:hover img {
  transform: scale(1.04);
}
/* نسبت‌های تصویر */
.qa-gallery-ratio-square .qa-gallery-item {
  aspect-ratio: 1 / 1;
}
.qa-gallery-ratio-rectangle .qa-gallery-item {
  aspect-ratio: 4 / 3;
}
.qa-gallery-ratio-portrait .qa-gallery-item {
  aspect-ratio: 3 / 4;
}
@media (max-width: 640px) {
  .qa-gallery,
  .qa-gallery.qa-gallery-cols-3 {
    grid-template-columns: 1fr;
  }
}

/* ---------- لایت‌باکس — دکمه‌های ناوبری ---------- */
.qa-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.92);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.qa-lightbox.is-open {
  display: flex;
}
.qa-lightbox img {
  max-width: 92vw;
  max-height: 88vh;
  object-fit: contain;
  box-shadow: 0 12px 40px -8px rgba(0,0,0,.6);
}
.qa-lightbox-close {
  position: absolute;
  top: 16px;
  inset-inline-end: 16px;
  background: rgba(255,255,255,.12);
  color: #fff;
  border: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  font-size: 22px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .2s;
}
.qa-lightbox-close:hover {
  background: rgba(255,255,255,.2);
}
.qa-lightbox-prev,
.qa-lightbox-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,.12);
  color: #fff;
  border: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .2s;
}
.qa-lightbox-prev:hover,
.qa-lightbox-next:hover {
  background: rgba(255,255,255,.22);
}
.qa-lightbox-prev { left: 16px; right: auto; }
.qa-lightbox-next { right: 16px; left: auto; }
.qa-lightbox-counter {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.5);
  color: #fff;
  font-size: 12px;
  padding: 4px 12px;
  border-radius: 12px;
  font-variant-numeric: tabular-nums;
}

/* ---------- مودال گالری — پنل انتخاب ---------- */
.qa-modal.is-gallery .qa-modal-dialog {
  max-width: 440px;
}
.qa-modal-gallery {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 8px;
}
.qa-modal-ggroup {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.qa-modal-glabel {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--qa-text-muted);
}
.qa-modal-gopts {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.qa-modal-gopt {
  flex: 1;
  min-width: 80px;
  padding: 8px 12px;
  border: 1px solid var(--qa-border-2);
  background: var(--qa-card);
  color: var(--qa-text);
  border-radius: 10px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  transition: all .2s;
}
.qa-modal-gopt:hover {
  border-color: var(--qa-accent);
}
.qa-modal-gopt.is-active {
  background: var(--qa-accent);
  border-color: var(--qa-accent);
  color: var(--qa-accent-contrast, #fff);
}

/* ---------- (۲.۲.۰) دکمه‌های متنی H/B/I و سربرگ‌ها ---------- */
.qa-tb-text-btn {
  min-width: 30px;
  padding: 0 6px;
}
.qa-tb-text-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  font-family: 'Vazirmatn', sans-serif;
  line-height: 1;
}

/* سربرگ‌های درون پست/پاسخ */
.qa-head {
  margin: 18px 0 10px;
  color: var(--qa-text, #1a1d21);
  line-height: 1.4;
  font-weight: 800;
  letter-spacing: -0.01em;
}
h1.qa-head { font-size: 24px; font-weight: 900; }
h2.qa-head {
  font-size: 20px;
  font-weight: 800;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--qa-border-2, #e1e4e8);
}
h3.qa-head { font-size: 17px; font-weight: 700; }
[data-theme="dark"] h1.qa-head,
[data-theme="dark"] h2.qa-head,
[data-theme="dark"] h3.qa-head {
  color: var(--qa-text, #f0f0f0);
}
[data-theme="dark"] h2.qa-head {
  border-bottom-color: var(--qa-border-2, #2d3748);
}
.qa-head:first-child { margin-top: 0; }

/* ---------- (۲.۱.۰) جداکنندهٔ دکمه‌ها، پنل پیش‌نمایش، embed آپارات، لیست، HR ---------- */
.qa-tb-sep {
  display: inline-block;
  width: 1px;
  height: 18px;
  background: var(--qa-border-2);
  margin: 0 4px;
  vertical-align: middle;
}
.qa-tb-btn.is-active {
  background: var(--qa-accent-subtle);
  color: var(--qa-accent);
}

/* پنل پیش‌نمایش */
.qa-preview-panel {
  margin-top: 8px;
  border: 1px solid var(--qa-border-2);
  border-radius: 12px;
  background: var(--qa-card);
  overflow: hidden;
}
.qa-preview-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: var(--qa-accent-subtle);
  color: var(--qa-text);
  font-size: 12.5px;
  font-weight: 600;
}
.qa-preview-body {
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.8;
  color: var(--qa-text);
  max-height: 360px;
  overflow-y: auto;
}
.qa-preview-body .qa-img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 6px 0;
}

/* embed آپارات */
.qa-aparat {
  position: relative;
  width: 100%;
  margin: 14px 0;
  border-radius: 12px;
  overflow: hidden;
  background: #000;
  aspect-ratio: 16 / 9;
}
.qa-aparat iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* خط افقی */
hr.qa-hr {
  border: none;
  height: 1px;
  margin: 20px 0;
  background: linear-gradient(to right, transparent, var(--qa-border-2, #d1d5db), transparent);
}
[data-theme="dark"] hr.qa-hr {
  background: linear-gradient(to right, transparent, var(--qa-border-2, #374151), transparent);
}

/* لیست‌ها */
.qa-list {
  margin: 10px 0 10px 24px;
  padding: 0;
  color: var(--qa-text);
}
.qa-list li { margin: 4px 0; }

/* ---------- (۲.۱.۰) حذف دسته‌جمعی — چک‌باکس‌ها و نوار ابزار ---------- */
.qa-pm-batch-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--qa-card, #fff);
  border: 1px solid var(--qa-border, #e1e4e8);
  border-radius: 10px 10px 0 0;
  border-bottom: none;
  flex-wrap: wrap;
  color: var(--qa-text, #1a1d21);
}
[data-theme="dark"] .qa-pm-batch-bar {
  background: var(--qa-card, #1f2937);
  border-color: var(--qa-border, #374151);
  color: var(--qa-text, #f0f0f0);
}
.qa-pm-select-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--qa-text, #1a1d21);
  cursor: pointer;
  user-select: none;
}
.qa-pm-select-all input {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--qa-accent, #7c3aed);
}
.qa-pm-batch-del {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.qa-pm-batch-del:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.qa-pm-batch-del:not(:disabled) {
  cursor: pointer;
}
.qa-pm-batch-count {
  font-size: 12px;
  color: var(--qa-accent, #7c3aed);
  font-weight: 600;
  margin-inline-start: auto;
}
/* چک‌باکس هر ردیف */
.qa-pm-row-check {
  display: flex;
  align-items: center;
  padding-inline-start: 4px;
  flex-shrink: 0;
}
.qa-pm-row-check input {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--qa-accent, #7c3aed);
}
/* ردیف انتخاب‌شده */
.qa-pm-row.is-selected {
  background: var(--qa-accent-subtle, rgba(124, 58, 237, 0.06));
}
[data-theme="dark"] .qa-pm-row.is-selected {
  background: rgba(124, 58, 237, 0.12);
}
/* وقتی نوار دسته‌جمعی هست، گوشه‌های لیست باید ادامه نوار باشد */
.qa-pm-batch-bar + .qa-pm-list-ul {
  border-radius: 0 0 var(--qa-radius, 14px) var(--qa-radius, 14px);
}

/* ---------- (۲.۳.۰) state خالی با آیکون لو-ساید ---------- */
.qa-empty.qa-empty-pm {
  padding: 48px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.qa-empty-pm .qa-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: var(--qa-accent-subtle, rgba(124, 58, 237, 0.08));
  color: var(--qa-accent, #7c3aed);
  margin-bottom: 4px;
}
[data-theme="dark"] .qa-empty-pm .qa-empty-icon {
  background: var(--qa-accent-subtle, rgba(124, 58, 237, 0.15));
}
.qa-empty-pm .qa-empty-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--qa-text);
  margin: 0;
}
.qa-empty-pm .qa-empty-subtitle {
  font-size: 13px;
  color: var(--qa-text-muted);
  margin: 0;
  max-width: 360px;
}

/* ---------- (۲.۳.۰) dropdown تکمیل خودکار گیرنده — پس‌زمینه غیرشفاف ---------- */
.qa-pm-recipient-autocomplete {
  position: relative;
}
.qa-pm-ac-list {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  inset-inline-end: 0;
  z-index: 50;
  list-style: none;
  margin: 4px 0 0 0;
  padding: 4px;
  /* پس‌زمینه غیرشفاف با رنگ پوسته — هم در لایت و هم در دارک مود */
  background: var(--qa-card, #fff);
  border: 1px solid var(--qa-border-2, #e5e7eb);
  border-radius: 10px;
  box-shadow: 0 12px 28px -8px rgba(0, 0, 0, 0.25);
  max-height: 280px;
  overflow-y: auto;
}
/* اطمینان از غیرشفاف‌بودن در حالت دارک مود */
[data-theme="dark"] .qa-pm-ac-list {
  background: var(--qa-card, #1f2937);
  box-shadow: 0 12px 28px -8px rgba(0, 0, 0, 0.55);
}
.qa-pm-ac-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s ease;
  color: var(--qa-text);
}
.qa-pm-ac-item:hover {
  background: var(--qa-accent-subtle, rgba(124, 58, 237, 0.08));
}
.qa-pm-ac-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--qa-accent, #7c3aed);
  color: var(--qa-accent-contrast, #fff);
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
}
.qa-pm-ac-name {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--qa-text);
}

/* ==========================================================================
   ۲۶. افزوده‌های ۲.۲.۰ — تیکر خبری، نوار بلاک، شمارشگر پست،
       دراپ‌داون چرخ‌دنده، راهنمای مدیر و قفل دسته‌ها
   ========================================================================== */

/* ---------- ۲۶.۱ [حذف شد] تیکر خبری announce-bar در ۲.۲.۰ حذف شد ---------- */
/* (سبک flatbb و حالت قدیمی vertical — هر دو حذف شدند) */

/* ---------- ۲۶.۲ نوار هشدار بلاک اداری ---------- */
.qa-ban-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 10px 14px;
  border: 1px solid color-mix(in srgb, var(--qa-err) 35%, transparent);
  border-radius: var(--qa-radius-sm);
  background: color-mix(in srgb, var(--qa-err) 8%, transparent);
  color: var(--qa-err);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.8;
}
.qa-ban-bar svg { flex: 0 0 auto; }

/* ---------- ۲۶.۳ شمارشگر پست — کلیک = کپی پیوند ---------- */
.qa-post-counter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  min-width: 46px;
  padding-inline: 10px;
  border: 1px dashed var(--qa-border-2);
  border-radius: 999px;
  background: transparent;
  color: var(--qa-text-3);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .3px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .16s var(--qa-ease), border-color .16s var(--qa-ease), background .16s var(--qa-ease);
}
.qa-post-counter:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  border-style: solid;
  background: var(--qa-accent-subtle);
}
.qa-post-counter:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: 1px; }
.qa-post-counter.is-copied {
  color: var(--qa-ok);
  border-color: color-mix(in srgb, var(--qa-ok) 40%, transparent);
  border-style: solid;
  background: color-mix(in srgb, var(--qa-ok) 8%, transparent);
}

/* ---------- ۲۶.۴ دراپ‌داون چرخ‌دندهٔ مدیریت پرسش ---------- */
.qa-gear { position: relative; display: inline-flex; }
.qa-gear-btn.is-open,
.qa-gear-btn:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
.qa-gear-pop {
  position: absolute;
  top: calc(100% + 8px);
  inset-inline-end: 0;
  z-index: 60;
  min-width: 236px;
  padding: 6px;
  border: 1px solid var(--qa-border-2);
  border-radius: var(--qa-radius-sm);
  background: var(--card-glass, var(--qa-surface-solid, #fff));
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  backdrop-filter: blur(18px) saturate(1.5);
  box-shadow: var(--shadow-lg, var(--qa-shadow));
  color: var(--qa-text);
}

/* ۲.۲.۱ — وقتی جاوااسکریپت دراپ‌داون را به <body> منتقل می‌کند،
   z-index بالاتر می‌رود تا روی هر کارت/سطح دیگری بیاید.
   مهم: چون pop دیگر داخل .qa-main نیست، تمام توکن‌های --qa-*
   که از .qa-main ارث می‌رسیدند اینجا دوباره تعریف می‌شوند تا
   ظاهر دراپ‌داون (رنگ تأکیدی، متن، خط، شعاع، سایه) با بقیهٔ
   افزونه یکپارچه بماند. */
.qa-gear-pop.is-ported {
  z-index: 9999;
  /* position و top/left از inline-style تنظیم می‌شوند */

  /* توکن‌های شکل */
  --qa-ease: cubic-bezier(.22, .61, .2, 1);
  --qa-radius: var(--radius-lg, 16px);
  --qa-radius-sm: var(--radius-md, 10px);
  --qa-radius-xs: var(--radius-sm, 8px);
  --qa-header-h: 62px;

  /* رنگ تأکیدی — از پوسته */
  --qa-accent: var(--accent, var(--accent-color, #7C3AED));
  --qa-accent-hov: var(--accent-strong, var(--accent-hover, var(--accent, var(--accent-color, #6D28D9))));
  --qa-accent-contrast: var(--accent-contrast, #FFFFFF);

  /* گرادیان امضای پوسته */
  --qa-grad: var(--grad, var(--accent, var(--accent-color, #7C3AED)));

  /* متن — از پوسته؛ در نبود، خاکستری خنثی (روشن و تاریک) */
  --qa-text: var(--text, var(--text-primary, rgba(0, 0, 0, .87)));
  --qa-text-2: var(--text-2, var(--text-secondary, rgba(127, 127, 127, 1)));
  --qa-text-3: var(--text-3, var(--text-tertiary, rgba(127, 127, 127, .82)));

  /* سطوح و خط */
  --qa-bg: transparent;
  --qa-surface: var(--surface, var(--bg-secondary, rgba(127, 127, 127, .05)));
  --qa-surface-2: var(--surface-2, var(--bg-tertiary, rgba(127, 127, 127, .09)));
  --qa-border: var(--border, var(--border-color, rgba(127, 127, 127, .24)));
  --qa-border-2: var(--border-strong, var(--border-hover, rgba(127, 127, 127, .4)));

  /* سایه */
  --qa-shadow-sm: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, .05), 0 2px 8px rgba(0, 0, 0, .05));
  --qa-shadow: var(--shadow-md, 0 2px 6px rgba(0, 0, 0, .05), 0 12px 32px rgba(0, 0, 0, .09));

  /* تُن‌های وضعیت */
  --qa-ok: #0E9F6E;
  --qa-warn: #B45309;
  --qa-err: #DC2626;
  --qa-info: #2563EB;

  /* لایه‌های شفاف تأکیدی */
  --qa-accent-subtle: rgba(127, 127, 127, .06);
  --qa-accent-soft: rgba(127, 127, 127, .12);
}

@supports (color: color-mix(in srgb, red 10%, transparent)) {
  .qa-gear-pop.is-ported {
    --qa-accent-subtle: color-mix(in srgb, var(--qa-accent) 9%, transparent);
    --qa-accent-soft: color-mix(in srgb, var(--qa-accent) 16%, transparent);
  }
}

/* حالت تاریک — متن روشن‌تر */
[data-theme="dark"] .qa-gear-pop.is-ported {
  --qa-text: var(--text, var(--text-primary, rgba(233, 238, 247, .92)));
  --qa-text-2: var(--text-2, var(--text-secondary, rgba(175, 180, 190, 1)));
  --qa-text-3: var(--text-3, var(--text-tertiary, rgba(150, 155, 165, .9)));
}

.qa-gear-pop[hidden] { display: none; }
[data-theme="dark"] .qa-gear-pop { background: #1c222c; }

.qa-gear-pop-title {
  margin: 0;
  padding: 7px 12px 9px;
  border-bottom: 1px solid var(--qa-border);
  font-size: 11.5px;
  font-weight: 800;
  color: var(--qa-text-3);
}
.qa-gear-item { display: block; }
.qa-gear-item-btn {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 36px;
  padding: 7px 12px;
  border: 0;
  border-radius: var(--qa-radius-xs);
  background: transparent;
  color: var(--qa-text-2);
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  text-align: start;
  cursor: pointer;
  transition: color .14s var(--qa-ease), background .14s var(--qa-ease);
}
.qa-gear-item-btn:hover {
  color: var(--qa-accent);
  background: var(--qa-accent-subtle);
}
.qa-gear-item-btn:focus-visible { outline: 2px solid var(--qa-accent); outline-offset: -2px; }
.qa-gear-item-btn svg { flex: 0 0 auto; }
.qa-gear-item-btn.is-active {
  color: var(--qa-accent);
  background: var(--qa-accent-subtle);
  font-weight: 800;
}
.qa-gear-item-btn.is-active::after {
  content: '●';
  margin-inline-start: auto;
  font-size: 9px;
  color: var(--qa-accent);
}
.qa-gear-item-btn.is-ok { color: var(--qa-ok); }
.qa-gear-item-btn.is-ok:hover {
  color: var(--qa-ok);
  background: color-mix(in srgb, var(--qa-ok) 9%, transparent);
}
.qa-gear-item-btn.is-danger { color: var(--qa-err); }
.qa-gear-item-btn.is-danger:hover {
  color: var(--qa-err);
  background: color-mix(in srgb, var(--qa-err) 8%, transparent);
}
.qa-gear-sep {
  height: 1px;
  margin: 6px 4px;
  background: var(--qa-border);
}
.qa-gear-flagrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  padding: 4px 8px 6px;
}
.qa-gear-flagrow .qa-clear-flags-form { flex: 1 1 auto; }
.qa-gear-flagrow .qa-clear-flags-form .qa-gear-item-btn { min-height: 32px; }

/* ---------- ۲۶.۵ راهنمای مدیر بالای فرم پاسخ ---------- */
.qa-reply-admin-note {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 10px;
  padding: 8px 12px;
  border: 1px solid color-mix(in srgb, var(--qa-warn) 32%, transparent);
  border-radius: var(--qa-radius-xs);
  background: color-mix(in srgb, var(--qa-warn) 7%, transparent);
  color: var(--qa-warn);
  font-size: 12.5px;
  font-weight: 700;
}
.qa-reply-admin-note svg { flex: 0 0 auto; }

/* ---------- ۲۶.۶ قفل دسته‌ها ---------- */
.qa-cat-lock-form { margin: 10px 0 4px; }
.qa-cat-lock-btn { height: 34px; }
.qa-cat-item.is-locked-cat {
  border-color: color-mix(in srgb, var(--qa-warn) 45%, transparent);
  background: color-mix(in srgb, var(--qa-warn) 5%, var(--qa-surface, transparent));
}
.qa-cat-lock-ico {
  margin-inline-start: 4px;
  color: var(--qa-warn);
  vertical-align: -1px;
}

/* ---------- ۲۶.۷ واکنش‌گرایی و حرکت کمتر (افزوده‌های ۲.۲.۰) ---------- */
@media (max-width: 640px) {
  /* پابرگ کارت: دو سطر — چپ و راست */
  .qa-card-foot { flex-direction: column; align-items: flex-start; gap: 8px; }
  .qa-foot-left { margin-inline-start: 0; }
  /* دراپ‌داون چرخ‌دنده در موبایل به لبهٔ راستِ کارت می‌چسبد */
  .qa-gear-pop { inset-inline-end: auto; inset-inline-start: 0; }
}

@media (prefers-reduced-motion: reduce) {
  /* تیکر حذف شد — این بلوک خالی نگه داشته شد تا به ارث‌رسانی CSS خللی نرسد */
}

@media print {
  .qa-ban-bar,
  .qa-gear,
  .qa-post-counter,
  .qa-share-bar { display: none !important; }
  .qa-answer-foot, .qa-question-foot { border-top: 1px solid var(--qa-border); }
}

/* ==========================================================================
   ۲۷. افزوده‌های ۲.۲.۰ — مودال گزارش، بنر گزارش‌های فعال،
       badge «انجام شده»، شمارشگر در هدر، زنگولهٔ هدر
   ========================================================================== */

/* ---------- ۲۷.۱ badge وضعیت «انجام شده» ---------- */
.qa-badge.is-done {
  background: color-mix(in srgb, #0e9f6e 14%, transparent);
  color: #0e9f6e;
  border: 1px solid color-mix(in srgb, #0e9f6e 35%, transparent);
}
.qa-question.is-done,
.qa-answer.is-done {
  border-inline-start: 3px solid color-mix(in srgb, #0e9f6e 60%, var(--qa-border));
  background: color-mix(in srgb, #0e9f6e 4%, var(--qa-surface));
}
[data-theme="dark"] .qa-badge.is-done { color: #38d399; }
[data-theme="dark"] .qa-question.is-done,
[data-theme="dark"] .qa-answer.is-done {
  background: color-mix(in srgb, #0e9f6e 8%, transparent);
}

/* ---------- ۲۷.۲ شمارشگر پست در هدر (سمت چپ) ---------- */
.qa-question-head,
.qa-answer-head {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.qa-post-counter--head {
  margin-inline-start: auto;
  align-self: center;
}
@media (max-width: 640px) {
  .qa-post-counter--head {
    align-self: flex-start;
    margin-top: 2px;
  }
}

/* ---------- ۲۷.۳ زنگولهٔ اعلان‌ها در هدر (وقتی سایدبار پنهان است) ---------- */
.qa-notif-bell--header {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--qa-border-2);
  border-radius: 999px;
  background: var(--qa-surface);
  color: var(--qa-text-2);
  cursor: pointer;
  transition: color .16s var(--qa-ease), border-color .16s var(--qa-ease), background .16s var(--qa-ease);
}
.qa-notif-bell--header:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}
.qa-notif-bell--header.has-unread { color: var(--qa-accent); }
.qa-notif-pop--header {
  position: absolute;
  top: calc(100% + 8px);
  inset-inline-end: 0;
  z-index: 80;
  width: 320px;
  max-width: calc(100vw - 32px);
  padding: 0;
  border: 1px solid var(--qa-border-2);
  border-radius: var(--qa-radius-sm);
  background: var(--card-glass, var(--qa-surface-solid, #fff));
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  backdrop-filter: blur(18px) saturate(1.5);
  box-shadow: var(--shadow-lg, var(--qa-shadow));
  color: var(--qa-text);
  overflow: hidden;
}
[data-theme="dark"] .qa-notif-pop--header { background: #1c222c; }

/* ---------- ۲۷.۴ بنر گزارش‌های فعال زیر qa-admin-bar ---------- */
.qa-flag-banner-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
  margin-bottom: 14px;
}
.qa-flag-banner {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--qa-warn) 35%, transparent);
  border-inline-start: 3px solid var(--qa-warn);
  border-radius: var(--qa-radius-sm);
  background: color-mix(in srgb, var(--qa-warn) 6%, transparent);
}
.qa-flag-banner-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.qa-flag-banner-kind {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--qa-warn) 16%, transparent);
  color: var(--qa-warn);
  font-size: 11px;
  font-weight: 800;
}
.qa-flag-banner-count {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--qa-warn);
  font-size: 12px;
  font-weight: 700;
}
.qa-flag-banner-title {
  flex: 1 1 auto;
  color: var(--qa-text);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-flag-banner-title:hover { color: var(--qa-accent); }
.qa-flag-banner-reasons {
  margin: 0;
  padding-inline-start: 18px;
  list-style: disc;
  color: var(--qa-text-2);
  font-size: 12.5px;
  line-height: 1.7;
}
.qa-flag-banner-reasons li { margin-bottom: 2px; }
.qa-flag-banner-noreason {
  margin: 0;
  color: var(--qa-text-3);
  font-size: 12px;
  font-style: italic;
}
.qa-flag-banner-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.qa-flag-banner-form { display: inline-flex; }
.qa-flag-banner-btn {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  color: var(--qa-text);
  transition: background .16s var(--qa-ease), color .16s var(--qa-ease), border-color .16s var(--qa-ease);
}
.qa-flag-banner-btn.is-reject {
  background: color-mix(in srgb, var(--qa-warn) 14%, transparent);
  border-color: color-mix(in srgb, var(--qa-warn) 40%, transparent);
  color: var(--qa-warn);
}
.qa-flag-banner-btn.is-reject:hover {
  background: color-mix(in srgb, var(--qa-warn) 22%, transparent);
}
.qa-flag-banner-btn.is-view {
  background: var(--qa-surface-2);
  border-color: var(--qa-border-2);
}
.qa-flag-banner-btn.is-view:hover {
  color: var(--qa-accent);
  border-color: var(--qa-accent-soft);
  background: var(--qa-accent-subtle);
}

/* ---------- ۲۷.۵ مودال دلیل گزارش تخلف ---------- */
.qa-flag-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.qa-flag-modal[hidden] { display: none; }
.qa-flag-modal-backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #000 55%, transparent);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.qa-flag-modal-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 460px;
  border-radius: var(--qa-radius, 12px);
  background: var(--qa-surface-solid, #fff);
  box-shadow: var(--shadow-lg, 0 20px 50px -10px rgba(0,0,0,.35));
  overflow: hidden;
  color: var(--qa-text);
  animation: qa-flag-modal-pop .18s var(--qa-ease);
}
[data-theme="dark"] .qa-flag-modal-card { background: #1c222c; }
@keyframes qa-flag-modal-pop {
  from { opacity: 0; transform: translateY(8px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.qa-flag-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--qa-border);
}
.qa-flag-modal-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: var(--qa-warn);
}
.qa-flag-modal-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--qa-text-3);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.qa-flag-modal-close:hover {
  background: var(--qa-surface-2);
  color: var(--qa-text);
}
.qa-flag-modal-body { padding: 14px 16px 16px; }
.qa-flag-modal-intro {
  margin: 0 0 10px;
  color: var(--qa-text-2);
  font-size: 13px;
  line-height: 1.6;
}
.qa-flag-modal-form { display: flex; flex-direction: column; gap: 8px; }
.qa-flag-modal-form textarea {
  resize: vertical;
  min-height: 88px;
  padding: 10px 12px;
  border: 1px solid var(--qa-border-2);
  border-radius: var(--qa-radius-sm);
  background: var(--qa-surface);
  color: var(--qa-text);
  font: inherit;
  font-size: 13.5px;
  line-height: 1.6;
  width: 100%;
}
.qa-flag-modal-form textarea:focus {
  outline: 2px solid var(--qa-accent);
  outline-offset: 1px;
  border-color: var(--qa-accent-soft);
}
.qa-flag-modal-counter {
  display: flex;
  justify-content: flex-end;
  color: var(--qa-text-3);
  font-size: 11.5px;
}
.qa-flag-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}
.qa-flag-modal-hint {
  margin: 0;
  padding: 8px 10px;
  border-radius: var(--qa-radius-sm);
  background: color-mix(in srgb, var(--qa-err) 8%, transparent);
  color: var(--qa-err);
  font-size: 12.5px;
}
.qa-flag-modal-hint.is-ok {
  background: color-mix(in srgb, var(--qa-ok) 10%, transparent);
  color: var(--qa-ok);
}

/* ---------- ۲۷.۶ دکمه‌های پنل: «انجام شده» ---------- */
.fpanel-btn-done,
.fpanel-act-done {
  background: color-mix(in srgb, #0e9f6e 12%, transparent);
  color: #0e9f6e;
  border-color: color-mix(in srgb, #0e9f6e 30%, transparent);
}
.fpanel-btn-done:hover,
.fpanel-act-done:hover {
  background: color-mix(in srgb, #0e9f6e 22%, transparent);
  border-color: color-mix(in srgb, #0e9f6e 50%, transparent);
}
[data-theme="dark"] .fpanel-btn-done,
[data-theme="dark"] .fpanel-act-done { color: #38d399; }


/* ==========================================================================
   ۲.۳.۰ — بهبودهای موبایل، صفحهٔ اعلان‌ها و ایموجی دسته‌ها
   --------------------------------------------------------------------------
   همهٔ قواعد این بخش «افزوده» هستند؛ هیچ قاعدهٔ نسخه‌های قبل حذف یا
   بازنویسی نشده و دسکتاپ دست‌نخورده می‌ماند (قواعد موبایل داخل
   مدیاکوئری هستند). جزئیات هر قاعده در کامنت خودش آمده است.
   ========================================================================== */

/* ---------- ۲۸.۱ زنگولهٔ اعلان‌ها به‌صورت پیوند (۲.۳.۰) ----------
   زنگوله اکنون <a> است و به صفحهٔ /forum/notifications می‌رود؛
   همان استایل دکمهٔ قبلی روی پیوند هم اعمال می‌شود تا ظاهر
   قبلی حفظ شود (استایل‌های .qa-notif-bell عنصر-آگنوستیک‌اند). */
a.qa-notif-bell {
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
a.qa-notif-bell:focus-visible {
  outline: 2px solid var(--qa-accent);
  outline-offset: 2px;
}

/* ---------- ۲۸.۲ ایموجی دسته‌بندی‌ها (۲.۳.۰) ----------
   .qa-cat-emoji همان نویسهٔ ذخیره‌شده است — بدون تبدیل به تصویر/SVG.
   اندازه با inline style (font-size) مطابق سایز آیکون Lucide هم‌ارز
   تنظیم می‌شود؛ فهرست فونت برای پشتیبانی یکسان در همهٔ پلتفرم‌هاست. */
.qa-cat-emoji {
  display: inline-block;
  line-height: 1;
  vertical-align: -0.125em;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji",
               "Twemoji Mozilla", sans-serif;
}
/* فیلد متنی آیکون در مدیریت دسته‌ها (به‌جای select؛ paste ایموجی) */
.qa-cat-icon-field input[type="text"] {
  width: 100%;
  font: inherit;
  padding: 8px 12px;
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-xs);
  background: var(--qa-surface);
  color: var(--qa-text);
}

/* ---------- ۲۸.۳ موبایل — تراز محتوا، منوی کاربر، نوار تب‌ها (۲.۳.۰) ---------- */
@media (max-width: 860px) {
  /* (وظیفهٔ ۱) محتوای انجمن (qa-content → qa-list/qa-stats/سایدبارِ پایین)
     دقیقاً هم‌تراز پدینگ افقی سربرگ (qa-fhead = ۲۰px در همین بریک‌پوینت)
     می‌شود؛ اختلاف ۴px قبلی (۱۶ در برابر ۲۰) از بین می‌رود.
     قالب مستقل (.qa-body) هم برای یکسانی همان ۲۰px را می‌گیرد. */
  .qa-main { padding-inline: 20px; }
  .qa-body .qa-main { padding-inline: 20px; }

  /* (وظیفهٔ ۱ — ریشهٔ مشکل) حاشیهٔ چپِ ۲۴px که از تصادمِ سلکتور عمومی
     .qa-list در بخش پیام خصوصی (۲.۱.۰، خط ~۴۴۰۲) به کارتِ فهرست
     پرسش‌ها هم می‌رسید و آن را نسبت به سربرگ/آمار/سایدبار تورفته
     می‌کرد؛ در موبایل صفر می‌شود. دسکتاپ دست‌نخورده می‌ماند (آن حاشیه
     آن‌جا نقش فاصلهٔ کنار سایدبار را دارد). */
  .qa-list { margin: 10px 0; }

  /* (وظیفهٔ ۲) منوی کاربر در موبایل سمت چپ بماند (مثل دسکتاپ).
     margin-right:auto در هر دو جهتِ RTL و LTR عنصر را به لبهٔ فیزیکی
     چپ می‌راند؛ دسکتاپ تغییری نمی‌کند (این قاعده فقط موبایل است). */
  .qa-fhead-user { justify-content: flex-start; }
  .qa-usermenu { margin-right: auto; }

  /* (وظیفهٔ ۲) کشوی منوی کاربر کامل داخل viewport بماند:
     لبهٔ چپِ کشو به لبهٔ چپ دکمه می‌چسبد و به راست باز می‌شود؛
     سقف عرض با احتساب فاصلهٔ لنگر از لبهٔ صفحه (۲۰ پدینگ سربرگ +
     ۲۰ پدینگ qa-main) و حاشیهٔ راست محاسبه می‌شود (هر جهت RTL/LTR). */
  .qa-usermenu-pop {
    left: 0;
    right: auto;
    max-width: calc(100vw - 56px);
  }

  /* (وظیفهٔ ۳) نوار تب مرتب‌سازی — شامل تب‌های «گزارش‌ها» و
     «در انتظار تأیید» — به‌صورت نوار ناوبری افقیِ تمام‌عرض و
     قابل‌اسکرول، مستقیماً بالای سایر محتوای qa-stats (دکمهٔ پرسش
     جدید / چیپ فیلتر) نمایش داده می‌شود. دسکتاپ دست‌نخورده. */
  .qa-stats {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
  }
  .qa-sort-bar {
    order: -1;
    display: flex;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }
  .qa-sort-bar::-webkit-scrollbar { display: none; }
  .qa-sort-bar .qa-sort-btn {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }
}

/* ---------- ۲۸.۴ صفحهٔ اعلان‌ها (۲.۳.۰) — /forum/notifications ----------
   کلاس‌های qa-np-* فقط در همین صفحه استفاده می‌شوند و با هیچ
   کلاس موجود تداخل ندارند. */
.qa-np-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.qa-np-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  color: var(--qa-text);
}
.qa-np-title svg { color: var(--qa-accent); flex: 0 0 auto; }
.qa-np-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--qa-accent-subtle);
  color: var(--qa-accent);
  font-size: 11.5px;
  font-weight: 800;
}
.qa-np-markall { height: 34px; padding-inline: 14px; }
.qa-np-sub {
  margin: 0 0 12px;
  font-size: 12.5px;
  color: var(--qa-text-3);
}
.qa-np-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  background: var(--qa-surface);
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  overflow: hidden;
  box-shadow: var(--qa-shadow-sm);
}
.qa-np-item + .qa-np-item { border-top: 1px solid var(--qa-border); }
.qa-np-item.is-unread { background: var(--qa-accent-subtle); }
.qa-np-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  text-decoration: none;
  color: var(--qa-text);
  border-radius: 0;
  min-width: 0;
}
a.qa-np-link:hover {
  background: color-mix(in srgb, var(--qa-accent) 7%, transparent);
  text-decoration: none;
}
.qa-np-avatar { flex: 0 0 auto; display: inline-flex; }
.qa-np-avatar .qa-avatar { width: 38px; height: 38px; font-size: 15px; }
.qa-np-body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.qa-np-line {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  min-width: 0;
}
.qa-np-user {
  font-size: 13px;
  font-weight: 800;
  color: var(--qa-text);
}
.qa-np-action {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--qa-text-2);
}
.qa-np-topic {
  font-size: 13px;
  font-weight: 700;
  color: var(--qa-accent);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-np-dot { width: 9px; height: 9px; }

/* موبایل صفحهٔ اعلان‌ها — ردیف‌های جمع‌وجورتر */
@media (max-width: 640px) {
  .qa-np-head { margin-bottom: 2px; }
  .qa-np-title { font-size: 16.5px; }
  .qa-np-link { padding: 11px 12px; gap: 10px; }
  .qa-np-avatar .qa-avatar { width: 34px; height: 34px; font-size: 14px; }
}

/* چاپ صفحهٔ اعلان‌ها — دکمه/بج اکشن معنی ندارد */
@media print {
  .qa-np-markall,
  .qa-np-badge { display: none !important; }
  .qa-np-item.is-unread { background: none; }
}