/* ─────────────────────────────────────────────────────────────────────────────
   استایلِ محتوای غنیِ صفحاتِ دسته‌بندی و مقاله.

   چرا دستی نوشته شده: تمپلیت از کلاس‌های prose-* تیلویند استفاده می‌کرد، ولی
   افزونهٔ @tailwindcss/typography نه نصب است و نه در tailwind.config ثبت شده —
   یعنی صفر قاعدهٔ .prose در CSS کامپایل‌شده وجود دارد و آن یازده خط کلاس هیچ
   کاری نمی‌کردند. محتوا کاملاً بی‌استایل رندر می‌شد.

   نصبِ افزونه گزینه نبود چون سرور ایران به npm دسترسی ندارد؛ پس همان چیزی که
   لازم است اینجا نوشته شده، هماهنگ با پالتِ واقعی سایت.
   ───────────────────────────────────────────────────────────────────────────── */

.nsw-rich {
    --nsw-primary: #2b6cee;
    --nsw-surface: #1c212b;
    --nsw-bg: #111318;
    --nsw-border: #282e39;
    --nsw-text: #d5dbe6;
    --nsw-muted: #93a0b4;

    color: var(--nsw-text);
    font-size: 15.5px;
    line-height: 2.05;
    word-break: break-word;
}

/* ── سرفصل‌ها ───────────────────────────────────────────────────────────── */
.nsw-rich h1,
.nsw-rich h2,
.nsw-rich h3,
.nsw-rich h4 {
    color: #fff;
    font-weight: 800;
    line-height: 1.65;
    scroll-margin-top: 90px;
}

.nsw-rich h2 {
    font-size: 22px;
    margin: 2.2em 0 0.9em;
    padding-inline-start: 14px;
    border-inline-start: 4px solid var(--nsw-primary);
}

.nsw-rich h3 {
    font-size: 18.5px;
    margin: 1.8em 0 0.7em;
    color: #e8edf6;
}

.nsw-rich h4 {
    font-size: 16.5px;
    margin: 1.5em 0 0.6em;
    color: #cfd8e6;
}

.nsw-rich h2:first-child,
.nsw-rich h3:first-child { margin-top: 0; }

/* ── متن ────────────────────────────────────────────────────────────────── */
.nsw-rich p { margin: 0 0 1.15em; }
.nsw-rich p:last-child { margin-bottom: 0; }

.nsw-rich strong,
.nsw-rich b { color: #fff; font-weight: 700; }

.nsw-rich a {
    color: #6ea0ff;
    text-decoration: none;
    border-bottom: 1px solid rgba(110, 160, 255, .35);
    transition: border-color .2s ease, color .2s ease;
}
.nsw-rich a:hover { color: #9dbcff; border-bottom-color: #9dbcff; }

/* محتوای ادیتور پر از <br>های پشت‌سرهم است که فاصله‌های عجیب می‌سازد.
   اولی نگه داشته می‌شود، بقیه خنثی. */
.nsw-rich br + br { display: none; }

/* ── فهرست‌ها ───────────────────────────────────────────────────────────── */
.nsw-rich ul,
.nsw-rich ol { margin: 0 0 1.2em; padding-inline-start: 1.4em; }
.nsw-rich li { margin-bottom: .5em; }
.nsw-rich ul > li::marker { color: var(--nsw-primary); }
.nsw-rich ol > li::marker { color: var(--nsw-primary); font-weight: 700; }

/* ── جدول ───────────────────────────────────────────────────────────────
   بیشترین بی‌نظمی از همین‌جا می‌آمد: جدول‌ها هیچ استایلی نداشتند و
   سلول‌ها روی هم می‌ریختند. روی موبایل هم افقی اسکرول می‌شوند تا صفحه
   از عرض بیرون نزند. */
.nsw-rich .nsw-table-wrap {
    overflow-x: auto;
    margin: 1.6em 0;
    border: 1px solid var(--nsw-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, .02);
    -webkit-overflow-scrolling: touch;
}

.nsw-rich table {
    width: 100%;
    min-width: 480px;
    border-collapse: collapse;
    font-size: 14.5px;
}

.nsw-rich thead th,
.nsw-rich tr:first-child td strong:only-child {
    background: rgba(43, 108, 238, .13);
    color: #fff;
    font-weight: 800;
}

.nsw-rich th,
.nsw-rich td {
    padding: 12px 15px;
    text-align: start;
    border-bottom: 1px solid var(--nsw-border);
    vertical-align: top;
    line-height: 1.85;
}

.nsw-rich th { color: #fff; font-weight: 800; }
.nsw-rich tbody tr:nth-child(even) { background: rgba(255, 255, 255, .022); }
.nsw-rich tbody tr:hover { background: rgba(43, 108, 238, .06); }
.nsw-rich tbody tr:last-child td { border-bottom: 0; }

/* ── نقل‌قول و کد ──────────────────────────────────────────────────────── */
.nsw-rich blockquote {
    margin: 1.5em 0;
    padding: 14px 18px;
    border-inline-start: 4px solid var(--nsw-primary);
    background: rgba(43, 108, 238, .07);
    border-radius: 0 12px 12px 0;
    color: #c3cfe2;
}
.nsw-rich blockquote p:last-child { margin-bottom: 0; }

.nsw-rich code {
    background: var(--nsw-bg);
    border: 1px solid var(--nsw-border);
    padding: 2px 7px;
    border-radius: 6px;
    font-size: .9em;
    direction: ltr;
    display: inline-block;
}

.nsw-rich pre {
    background: var(--nsw-bg);
    border: 1px solid var(--nsw-border);
    border-radius: 12px;
    padding: 16px;
    overflow-x: auto;
    margin: 1.4em 0;
    direction: ltr;
}
.nsw-rich pre code { background: none; border: 0; padding: 0; }

/* ── رسانه ──────────────────────────────────────────────────────────────── */
.nsw-rich img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    margin: 1.4em auto;
    display: block;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .4);
}

.nsw-rich iframe {
    max-width: 100%;
    border-radius: 14px;
    border: 1px solid var(--nsw-border);
    margin: 1.4em 0;
}

.nsw-rich hr {
    border: 0;
    height: 1px;
    background: var(--nsw-border);
    margin: 2em 0;
}

/* ── موبایل ─────────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .nsw-rich { font-size: 15px; line-height: 1.95; }
    .nsw-rich h2 { font-size: 19.5px; }
    .nsw-rich h3 { font-size: 17px; }
    .nsw-rich th,
    .nsw-rich td { padding: 10px 12px; font-size: 13.5px; }
}