/* ==========================================================================
   قم املاک — صفحه ی نمایش مطلب وبلاگ و صفحه ی نمایش محله
   --------------------------------------------------------------------------
   هر دو صفحه از یک ویو (site14/frontend/blog/show.blade.php) می آیند ، چون در
   دیتابیس هر دو یک «پست» اند و فقط دسته شان فرق می کند (۹ = محله ، ۱۰ = شهر).
   پس استایلشان هم اینجا کنار هم است.

   قاعده ها فقط با توکن های --qa-* نوشته شده اند ، نه با رنگ خام ؛ dark.css
   همان توکن ها را در حالت شب بازتعریف می کند ، پس این فایل به dark-auto.css
   احتیاجی ندارد و نباید هم رنگ خام بگیرد. عمداً هم به فهرست site_stylesheets()
   در tools/site14-darkgen.php اضافه نشده : تنها رنگ های خامِ اینجا گرادیانِ
   سرمه ای هیروِ محله و متنِ سفیدِ رویش اند ، و ترجمه ی مکانیکیِ همان ها تیتر را
   روی زمینه ی تیره نامرئی می کند. هر رنگ تازه ای هم باید توکن باشد نه کد رنگ.

   یک تله ی سایت ۱۴ : theme14.min.css قاعده ی عنصریِ
   h1..h6 { color:#1f1b2d } دارد. آن قاعده اختصاصیت تقریباً صفر دارد ولی چون
   *اعلام شده* است ، بر ارث بری می چربد. یعنی هر تیتری که روی زمینه ی تیره
   بنشیند باید color را صریح بنویسد ، وگرنه نامرئی می شود (qa-nbhero).
   ========================================================================== */

/* ── چیدمان مشترک : ستون متن + ستون کناریِ چسبان ─────────────────────────── */
.qa-ar__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    align-items: start;
    gap: 34px;
    padding-bottom: 56px;
}

/* بدون ستون کناری ، متن تمام عرض نمی شود : خطِ خیلی بلند خوانده نمی شود ،
   پس همان عرضِ خوانا وسط چین می ماند. */
.qa-ar__grid--solo {
    grid-template-columns: minmax(0, 820px);
    justify-content: center;
}

@media (max-width: 991.98px) {
    .qa-ar__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 26px;
    }
}

.qa-ar__side {
    position: sticky;
    top: calc(var(--qa-header-h) + 16px);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (max-width: 991.98px) {
    .qa-ar__side {
        position: static;
    }
}

/* ── سرِ مطلب ────────────────────────────────────────────────────────────── */
.qa-ar__head {
    padding: 18px 0 22px;
}

.qa-ar__head h1 {
    margin: 0;
    color: var(--qa-ink);
    font-size: clamp(1.35rem, 3vw, 2.1rem);
    font-weight: 900;
    line-height: 1.75;
    letter-spacing: -.4px;
}

.qa-ar__lead {
    max-width: 760px;
    margin: 14px 0 0;
    color: var(--qa-muted);
    font-size: .87rem;
    line-height: 2.1;
}

.qa-ar__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 18px;
    margin-top: 16px;
    color: var(--qa-muted);
    font-size: .74rem;
}

.qa-ar__meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.qa-ar__meta i {
    color: var(--qa-faint);
    font-size: .82rem;
}

/* ── عکس شاخص ────────────────────────────────────────────────────────────
   کلاس rounded-3 اینجا عمداً به کار نرفته : در theme14.min.css همان کلاس به
   یک کادرِ ۴۵۰ پیکسلیِ مشکی بازتعریف شده و عکس را کش می آورد. */
.qa-ar__cover {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 8;
    margin-bottom: 8px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: var(--qa-soft);
    object-fit: cover;
}

@media (max-width: 575.98px) {
    .qa-ar__cover {
        aspect-ratio: 16 / 10;
        border-radius: var(--qa-r);
    }
}

/* ── متن مطلب ────────────────────────────────────────────────────────────── */
.qa-ar__body {
    color: var(--qa-body);
    font-size: .95rem;
    line-height: 2.3;
    text-align: justify;
    word-break: break-word;
}

.qa-ar__body > :first-child {
    margin-top: 0;
}

.qa-ar__body p {
    margin: 0 0 18px;
    color: inherit;
    font-size: inherit;
    line-height: inherit;
    text-align: justify;
}

.qa-ar__body h2,
.qa-ar__body h3,
.qa-ar__body h4,
.qa-ar__body h5 {
    margin: 34px 0 12px;
    color: var(--qa-ink);
    font-weight: 900;
    line-height: 1.9;
}

.qa-ar__body h2,
.qa-ar__body h2 * {
    padding-inline-start: 13px;
    border-inline-start: 4px solid var(--qa-orange);
    color: var(--qa-ink);
    font-size: 1.12rem !important;
}

.qa-ar__body h3,
.qa-ar__body h3 * {
    color: var(--qa-navy);
    font-size: 1rem !important;
}

.qa-ar__body h4,
.qa-ar__body h4 * {
    font-size: .92rem !important;
}

.qa-ar__body a {
    color: var(--qa-trust);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid var(--qa-trust-line);
}

.qa-ar__body a:hover {
    color: var(--qa-orange);
    border-bottom-color: var(--qa-orange);
}

.qa-ar__body img {
    max-width: 100%;
    height: auto;
    margin: 8px auto;
    border-radius: var(--qa-r);
}

.qa-ar__body ul,
.qa-ar__body ol {
    margin: 0 0 18px;
    padding-inline-start: 22px;
}

.qa-ar__body li {
    margin-bottom: 8px;
}

.qa-ar__body blockquote {
    margin: 22px 0;
    padding: 16px 18px;
    border: 0;
    border-inline-start: 4px solid var(--qa-orange);
    border-radius: var(--qa-r);
    background: var(--qa-orange-soft);
    color: var(--qa-ink);
    font-size: .9rem;
}

/* عمداً display:block + overflow-x نیست : با display:block خودِ جدول یک بلوکِ
   تمام عرض می شود ولی ردیف هایش یک جعبه ی جدولِ ناشناس می سازند که عرضش
   shrink-to-fit است ، پس جدول در RTL می چسبد به راست و نصف ستون خالی می ماند.
   عرضِ ۱۰۰٪ روی خودِ جدول به علاوه ی شکستنِ کلمه ها همان کار را بدون آن عارضه
   می کند. */
.qa-ar__body table {
    display: table;
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
    border-collapse: collapse;
    font-size: .82rem;
}

.qa-ar__body table td,
.qa-ar__body table th {
    padding: 9px 11px;
    border: 1px solid var(--qa-line);
}

.qa-ar__body table th {
    background: var(--qa-soft);
    font-weight: 800;
}

.qa-ar__body iframe,
.qa-ar__body video {
    max-width: 100%;
    border-radius: var(--qa-r);
}

/* ── ویدیوی مطلب ─────────────────────────────────────────────────────────── */
.qa-ar__video {
    margin: 26px 0 8px;
}

.qa-ar__video video {
    width: 100%;
    max-height: 520px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: #0e1526;
}

.qa-ar__embed {
    position: relative;
    padding-top: calc(57% + 65px);
    overflow: hidden;
    border-radius: var(--qa-r-lg);
}

.qa-ar__embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ── برچسب ها ────────────────────────────────────────────────────────────── */
.qa-ar__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 30px;
    padding-top: 22px;
    border-top: 1px solid var(--qa-line);
}

.qa-artag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid var(--qa-line);
    border-radius: 999px;
    background: var(--qa-surface);
    color: var(--qa-body);
    font-size: .73rem;
    font-weight: 700;
    transition: .18s;
}

.qa-artag:hover {
    border-color: var(--qa-orange);
    background: var(--qa-orange-soft);
    color: var(--qa-orange);
}

.qa-artag i {
    color: var(--qa-faint);
    font-size: .8rem;
}

.qa-artag:hover i {
    color: var(--qa-orange);
}

/* ── کارت های ستون کناری ─────────────────────────────────────────────────── */
.qa-arcard {
    padding: 18px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: var(--qa-surface);
    box-shadow: var(--qa-shadow);
}

.qa-arcard__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    color: var(--qa-ink);
    font-size: .88rem;
    font-weight: 900;
}

.qa-arcard__title i {
    color: var(--qa-orange);
    font-size: .95rem;
}

/* فهرست مطلب های دیگر : عکسِ کوچک + عنوان دو خطی */
.qa-mini {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 11px 0;
    border-bottom: 1px solid var(--qa-line-soft);
    color: inherit;
}

.qa-mini:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.qa-mini:first-of-type {
    padding-top: 0;
}

.qa-mini__img {
    flex: none;
    width: 64px;
    height: 64px;
    overflow: hidden;
    border-radius: 10px;
    background: var(--qa-soft);
}

.qa-mini__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.qa-mini__txt {
    min-width: 0;
}

.qa-mini b {
    display: -webkit-box;
    overflow: hidden;
    color: var(--qa-ink);
    font-size: .78rem;
    font-weight: 800;
    line-height: 1.9;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    transition: color .18s;
}

.qa-mini:hover b {
    color: var(--qa-orange);
}

.qa-mini small {
    display: block;
    margin-top: 5px;
    color: var(--qa-faint);
    font-size: .68rem;
}

/* کارتِ اقدام (ثبت ملک / جستجو) ته ستون کناری */
.qa-cta {
    padding: 20px 18px;
    border: 1px solid var(--qa-orange-soft);
    border-radius: var(--qa-r-lg);
    background: var(--qa-orange-soft);
}

.qa-cta h3 {
    margin: 0 0 6px;
    color: var(--qa-ink);
    font-size: .9rem;
    font-weight: 900;
    line-height: 1.9;
}

.qa-cta p {
    margin: 0 0 14px;
    color: var(--qa-muted);
    font-size: .74rem;
    line-height: 2;
}

.qa-cta__row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* داخل کارت کناری دو دکمه با هم عرض کارت را پر می کنند */
.qa-cta .qa-cta__row .qa-abtn {
    flex: 1 1 120px;
}

/* ── دکمه های صفحه ──────────────────────────────────────────────────────── */
.qa-abtn {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 11px 18px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 800;
    white-space: nowrap;
    transition: .18s;
}

.qa-abtn--fill {
    background: var(--qa-orange);
    color: #fff;
}

.qa-abtn--fill:hover {
    background: var(--qa-orange-deep);
    color: #fff;
}

.qa-abtn--ghost {
    border-color: var(--qa-line);
    background: var(--qa-surface);
    color: var(--qa-ink);
}

.qa-abtn--ghost:hover {
    border-color: var(--qa-orange);
    color: var(--qa-orange);
}

/* روی خودِ هیروِ محله (زمینه ی تیره) دکمه ی روشن لازم است */
.qa-abtn--on-dark {
    border-color: rgba(255, 255, 255, .32);
    background: rgba(255, 255, 255, .1);
    color: #fff;
}

.qa-abtn--on-dark:hover {
    border-color: #fff;
    background: #fff;
    color: var(--qa-ink);
}

/* ==========================================================================
   صفحه ی محله
   ========================================================================== */

/* ── هیرو ────────────────────────────────────────────────────────────────── */
.qa-nbhero {
    position: relative;
    overflow: hidden;
    margin-top: 14px;
    padding: 40px 34px;
    border-radius: 22px;
    background: linear-gradient(115deg, #16305F 0%, #1D4C9E 62%, #2E63BE 100%);
    color: #fff;
    isolation: isolate;
}

/* وقتی پستِ محله عکس دارد ، همان عکس زمینه می شود و یک پرده ی سرمه ای رویش
   می نشیند تا متن بخواند. بدون عکس ، فقط گرادیان می ماند. */
.qa-nbhero--photo:before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image: inherit;
    background-position: center;
    background-size: cover;
    content: "";
}

.qa-nbhero--photo:after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(105deg, rgba(11, 26, 51, .93) 0%, rgba(16, 48, 95, .82) 55%, rgba(22, 60, 118, .62) 100%);
    content: "";
}

@media (max-width: 767.98px) {
    .qa-nbhero {
        padding: 26px 20px;
        border-radius: 18px;
    }
}

.qa-nbhero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 12px;
    padding: 6px 14px;
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: .71rem;
    font-weight: 800;
}

/* رنگ صریح : قاعده ی عنصریِ h1 در theme14.min.css وگرنه تیره اش می کند */
.qa-nbhero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.5rem, 3.6vw, 2.4rem);
    font-weight: 900;
    line-height: 1.7;
    letter-spacing: -.5px;
}

.qa-nbhero__sub {
    max-width: 640px;
    margin: 12px 0 0;
    color: rgba(255, 255, 255, .84);
    font-size: .84rem;
    line-height: 2.1;
}

.qa-nbhero__acts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.qa-nbhero__acts .qa-abtn {
    flex: 0 0 auto;
}

/* ── نوار آمار ───────────────────────────────────────────────────────────── */
/* flex و نه grid : با grid ی چهارستونه ، محله ای که فقط یک آمار دارد یک
   کارتِ تمام عرض می گرفت. اینجا هر کارت پایه ی ۱۸۰ پیکسلی و سقف ۲۸۰ دارد ،
   پس یک کارت هم اندازه ی کارت است نه اندازه ی صفحه. */
.qa-nbstats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: -34px;
    padding: 0 22px;
}

.qa-nbstats > .qa-nbstat {
    flex: 1 1 180px;
    max-width: 280px;
}

@media (max-width: 479.98px) {
    .qa-nbstats > .qa-nbstat {
        max-width: none;
    }
}

@media (max-width: 991.98px) {
    .qa-nbstats {
        margin-top: 16px;
        padding: 0;
    }
}

.qa-nbstat {
    padding: 15px 16px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: var(--qa-surface);
    box-shadow: var(--qa-shadow);
}

.qa-nbstat small {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--qa-muted);
    font-size: .7rem;
    font-weight: 700;
}

.qa-nbstat small i {
    color: var(--qa-orange);
    font-size: .84rem;
}

.qa-nbstat b {
    display: block;
    margin-top: 7px;
    color: var(--qa-ink);
    font-size: .96rem;
    font-weight: 900;
    line-height: 1.7;
}

.qa-nbstat span {
    color: var(--qa-faint);
    font-size: .72rem;
    font-weight: 700;
}

/* ── محله های مجاور ──────────────────────────────────────────────────────── */
.qa-nbchips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.qa-nbchip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid var(--qa-navy-line);
    border-radius: 999px;
    background: var(--qa-navy-soft);
    color: var(--qa-navy);
    font-size: .74rem;
    font-weight: 700;
    transition: .18s;
}

.qa-nbchip:hover {
    border-color: var(--qa-orange);
    background: var(--qa-orange-soft);
    color: var(--qa-orange);
}

.qa-nbchip--plain {
    background: var(--qa-soft);
    border-color: var(--qa-line);
    color: var(--qa-muted);
    cursor: default;
}

.qa-nbchip--plain:hover {
    border-color: var(--qa-line);
    background: var(--qa-soft);
    color: var(--qa-muted);
}

/* ── نقشه ────────────────────────────────────────────────────────────────── */
.qa-nbmap {
    height: 320px;
    overflow: hidden;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
}

/* ── جدول قیمت ───────────────────────────────────────────────────────────── */
.qa-nbprice {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

@media (max-width: 575.98px) {
    .qa-nbprice {
        grid-template-columns: minmax(0, 1fr);
    }
}

.qa-nbprice__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r);
    background: var(--qa-surface);
}

.qa-nbprice__row small {
    color: var(--qa-muted);
    font-size: .75rem;
    font-weight: 700;
}

.qa-nbprice__row b {
    color: var(--qa-orange);
    font-size: .84rem;
    font-weight: 900;
    white-space: nowrap;
}

/* ── بازه ی قیمتِ امروز ───────────────────────────────────────────────────── */
.qa-nbrange {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-bottom: 16px;
    padding: 16px 18px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: var(--qa-soft);
}

.qa-nbrange__main small {
    display: block;
    margin-bottom: 4px;
    color: var(--qa-muted);
    font-size: .75rem;
    font-weight: 700;
}

.qa-nbrange__main b {
    color: var(--qa-ink);
    font-size: 1.12rem;
    font-weight: 900;
}

.qa-nbrange__to {
    margin: 0 4px;
    color: var(--qa-muted);
    font-size: .82rem;
    font-weight: 700;
}

.qa-nbrange__at {
    color: var(--qa-muted);
    font-size: .72rem;
    font-weight: 700;
}

/* ── نمودار تاریخچه ی قیمت ────────────────────────────────────────────────
   دو رنگِ نمودار از پالتِ خودِ سایت بیرون اند و عمدی است : نارنجیِ برند رنگِ
   «اقدام» است ( دکمه ها ) و اگر روی خطِ نمودار هم بنشیند دیگر معنی اش را از
   دست می دهد. آبی و سبزآبیِ زیر با معیارهای کوررنگی سنجیده شده اند ( جدایی
   ΔE ~۲۵ در دوترانوپی ) و در هر دو حالت روز و شب کنتراستِ لازم را روی
   زمینه ی خودشان دارند.

   شب مقدارِ روشن ترِ همان دو رنگ را می گیرد ، نه وارونه ی خودکارِ dark-auto :
   وارونه کردنِ یک رنگِ نمودار آن را از پالتِ سنجیده شده بیرون می برد. برای
   همین اینجا با data-theme هم نوشته شده اند تا لایه ی خودکار رویشان ننشیند.
   ------------------------------------------------------------------------ */
.qa-nbchart {
    --nb-max: #1D4C9E;
    --nb-min: #0E9F8E;
    --nb-band: rgba(29, 76, 158, .10);
    margin: 0 0 16px;
    padding: 14px 14px 6px;
    border: 1px solid var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: var(--qa-surface);
}

.qa-nbchart__cap {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 8px;
    color: var(--qa-body);
    font-size: .74rem;
    font-weight: 700;
}

.qa-nbchart__lg {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* سوییچِ لِجند : خطِ کوچکی هم شکلِ خطِ خودش در نمودار ( ممتد / خط چین ) */
.qa-nbchart__lg i {
    width: 18px;
    height: 0;
    border-top: 2px solid var(--nb-max);
}

.qa-nbchart__lg i.is-min {
    border-top-style: dashed;
    border-top-color: var(--nb-min);
}

.qa-nbchart__svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

.qa-nbchart__grid {
    stroke: var(--qa-line);
    stroke-width: 1;
}

.qa-nbchart__band {
    fill: var(--nb-band);
    stroke: none;
}

.qa-nbchart__line {
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.qa-nbchart__line.is-max { stroke: var(--nb-max); }
.qa-nbchart__line.is-min { stroke: var(--nb-min); stroke-dasharray: 6 4; }

/* حلقه ی هم رنگِ زمینه ، تا نقطه های روی هم افتاده از هم جدا دیده شوند */
.qa-nbchart__dot {
    stroke: var(--qa-surface);
    stroke-width: 2;
}

.qa-nbchart__dot.is-max { fill: var(--nb-max); }
.qa-nbchart__dot.is-min { fill: var(--nb-min); }

/* هدفِ نگه داشتنِ ماوس ، بزرگ تر از خودِ نقطه. <title> داخلِ گروه راهنمای
   بومیِ مرورگر است ، پس بدون یک خطِ جاوااسکریپت هم کار می کند. */
.qa-nbchart__hit {
    fill: transparent;
}

.qa-nbchart__pt:hover .qa-nbchart__hit {
    fill: var(--qa-line-soft);
    opacity: .55;
}

.qa-nbchart__pt:hover .qa-nbchart__dot {
    r: 6;
}

.qa-nbchart__ylab,
.qa-nbchart__xlab {
    fill: var(--qa-muted);
    font-family: inherit;
    font-size: 11px;
    font-weight: 700;
}

.qa-nbchart__xlab { text-anchor: middle; }

.qa-nbchart__tag {
    font-family: inherit;
    font-size: 11px;
    font-weight: 800;
}

.qa-nbchart__tag.is-max { fill: var(--nb-max); }
.qa-nbchart__tag.is-min { fill: var(--nb-min); }

.qa-nbchart__tbl {
    margin-top: 6px;
    border-top: 1px solid var(--qa-line-soft);
    padding-top: 8px;
}

.qa-nbchart__tbl > summary {
    color: var(--qa-muted);
    font-size: .74rem;
    font-weight: 700;
    cursor: pointer;
}

.qa-nbchart__tbl table {
    width: 100%;
    margin-top: 8px;
    border-collapse: collapse;
    font-size: .76rem;
}

.qa-nbchart__tbl th,
.qa-nbchart__tbl td {
    padding: 6px 8px;
    border-bottom: 1px solid var(--qa-line-soft);
    text-align: start;
}

.qa-nbchart__tbl th {
    color: var(--qa-muted);
    font-weight: 700;
}

.qa-nbchart__tbl td {
    color: var(--qa-body);
    font-weight: 700;
}

/* حالتِ شب : همان دو خانواده ی رنگ ، یک پله روشن تر ، سنجیده شده روی
   زمینه ی #151F33.

   فقط با data-theme نوشته شده ، نه با prefers-color-scheme : کلِ شبِ سایت ۱۴
   با همین صفت کار می کند ( اسکریپتِ appnew_v2 آن را روی <html> می گذارد ) و
   یک قاعده ی سیستمیِ اضافه ، نمودار را در حالتِ روزِ دستی هم تیره می کرد. */
html[data-theme="dark"] .qa-nbchart {
    --nb-max: #3D7BE0;
    --nb-min: #0E9484;
    --nb-band: rgba(61, 123, 224, .16);
}

/* ── حالت خالی ───────────────────────────────────────────────────────────── */
.qa-arempty {
    padding: 34px 20px;
    border: 1px dashed var(--qa-line);
    border-radius: var(--qa-r-lg);
    background: var(--qa-soft);
    color: var(--qa-muted);
    font-size: .8rem;
    text-align: center;
}

.qa-arempty i {
    display: block;
    margin-bottom: 10px;
    color: var(--qa-faint);
    font-size: 1.5rem;
}

/* ── فاصله ی بخش ها ─────────────────────────────────────────────────────── */
.qa-ar__sec {
    margin-top: 34px;
}

.qa-ar__sec > h2 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 16px;
    color: var(--qa-ink);
    font-size: 1.05rem;
    font-weight: 900;
    line-height: 1.9;
}

.qa-ar__sec > h2 i {
    color: var(--qa-orange);
    font-size: 1.05rem;
}

/* ── کارت های ملک داخل ستون متن ──────────────────────────────────────────
   گرید کارت ها (estate-grid ، تعریفش داخل estate/card_unified است) برای عرضِ
   کاملِ صفحه ی جستجو چهار ستونه است. اینجا کنارش یک ستون ۳۲۰ پیکسلی نشسته ،
   پس چهار ستون یعنی کارتِ ۲۲۵ پیکسلی و عنوانِ بریده. */
@media (min-width: 992px) {
    .qa-ar__grid .estate-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* روی عرض کم ، justify بینِ کلمه ها «رودخانه» می سازد ( خطِ ۶–۷ کلمه ای با
   فاصله های کشیده ) و متن فارسی را بدخوان می کند. */
@media (max-width: 575.98px) {
    .qa-ar__body,
    .qa-ar__body p {
        text-align: start;
    }
}