/* ══════════════════════════════════════════════════════════════════
   Overrideهای ریز وردپرسی — کلبه لفور (بعد از site.css لود می‌شود)

   ⚠️ این فایل فقط سازگاری وردپرس است — هیچ استایل طراحی/تایپوگرافی
   اینجا نوشته نمی‌شود (منبع واحد ظاهر: assets/tailwind/source.css
   که به assets/css/site.css کامپایل می‌شود — پاریتی با پروژه مرجع).
   ══════════════════════════════════════════════════════════════════ */

/* ─── نوار مدیریت وردپرس (وقتی کاربر لاگین است) ─── */
body.admin-bar [data-site-header] {
        top: 32px;
}

@media (max-width: 782px) {
        body.admin-bar [data-site-header] {
                top: 46px;
        }
}

/* ─── کلاس‌های هسته وردپرس (a11y و ترازها) ─── */
.screen-reader-text {
        border: 0;
        clip: rect(1px, 1px, 1px, 1px);
        clip-path: inset(50%);
        height: 1px;
        width: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        word-wrap: normal !important;
}

.screen-reader-text:focus {
        clip: auto !important;
        clip-path: none;
        background-color: var(--card);
        border-radius: var(--radius);
        box-shadow: 0 0 3px 3px rgb(16 43 33 / 0.25);
        color: var(--foreground);
        display: block;
        font-weight: 700;
        height: auto;
        width: auto;
        z-index: 100000;
        line-height: normal;
        padding: 1rem 1.5rem;
        text-decoration: none;
        top: 1rem;
        inset-inline-start: 1rem;
}

.alignleft {
        float: left;
        margin-inline-end: 1.5rem;
}

.alignright {
        float: right;
        margin-inline-start: 1.5rem;
}

.aligncenter {
        clear: both;
        display: block;
        margin-inline: auto;
}

.wp-caption {
        max-width: 100%;
}

.wp-caption-text {
        font-size: 0.8125rem;
        color: var(--muted-foreground);
        text-align: center;
        padding: 0.5rem;
}

/* ─── فرم جستجوی کلاسیک وردپرس (searchform.php در صورت استفاده) ─── */
.search-form .search-submit {
        cursor: pointer;
}

/* ─── گالری و امبدهای وردپرس ─── */
.gallery {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 0.75rem;
}

.gallery-item {
        margin: 0;
}

.gallery-caption {
        font-size: 0.75rem;
        color: var(--muted-foreground);
}

embed,
iframe,
object {
        max-width: 100%;
}

/* ─── استیک روی «موبایل: منوی پایین» — پشت نوار ادمین نیاید ─── */
body.admin-bar [data-bottom-tab-bar] {
        bottom: 46px;
}

/* ─── حالت چاپ — ناوبری/زرهای تعاملی حذف ─── */
@media print {
        [data-site-header],
        [data-bottom-tab-bar],
        [data-scroll-top],
        [data-support-fab],
        [data-carousel-prev],
        [data-carousel-next] {
                display: none !important;
        }

        body {
                background: #fff !important;
        }
}

/* ══════════════════════════════════════════════════════════════════
   مقالهٔ مجله — فاز ۳ آیتم ۳۵ (چیدمان برند‌دار single.php پست‌ها)

   قانون طلایی فاز ۳: هیچ تغییر بصری خارج از محدودهٔ مجله — همهٔ قواعد
   این بلوک با پیشوند lafour-article- دامنه‌دارند و فقط صفحهٔ مقالهٔ
   پست را استایل می‌کنند (هدر/متا/تگ‌ها با utilityهای کامپایل‌شده‌اند).
   پالت: forest-950 #081f17 · forest-700 #275746 · forest-600 #356e58 ·
   forest-100 #dcece5 · honey-600 #bf8440 · ring #d9a25e — هم‌ارز
   توکن‌های site.css (توکن‌های عمومی با var() مصرف می‌شوند).
   ══════════════════════════════════════════════════════════════════ */

/* ─── تصویر شاخص hero (figure.lafour-article-hero) ─── */
.lafour-article-hero {
        max-width: 64rem;
}

.lafour-article-hero__img {
        display: block;
        width: 100%;
        aspect-ratio: 16 / 9;
        object-fit: cover;
        background-color: #dcece5;
}

/* ─── ستون خوانش بدنهٔ مقاله (div.lafour-article-body) ─── */
.lafour-article-body {
        max-width: 48rem;
        font-size: 1rem;
        line-height: 2.1;
        color: var(--foreground);
}

.lafour-article-body > *:first-child {
        margin-top: 0;
}

.lafour-article-body p {
        margin: 0 0 1.25rem;
}

.lafour-article-body h2 {
        margin: 2.25rem 0 1rem;
        font-size: 1.375rem;
        font-weight: 900;
        line-height: 2.25rem;
        color: #081f17;
}

.lafour-article-body h3 {
        margin: 2rem 0 0.875rem;
        font-size: 1.1875rem;
        font-weight: 800;
        line-height: 2rem;
        color: #081f17;
}

.lafour-article-body h4 {
        margin: 1.75rem 0 0.75rem;
        font-size: 1.0625rem;
        font-weight: 800;
        line-height: 1.875rem;
        color: #275746;
}

.lafour-article-body a {
        color: #275746;
        font-weight: 700;
        text-decoration: underline;
        text-decoration-color: #d9a25e;
        text-decoration-thickness: 2px;
        text-underline-offset: 4px;
        transition: color 0.2s ease;
}

.lafour-article-body a:hover {
        color: #356e58;
}

.lafour-article-body ul,
.lafour-article-body ol {
        margin: 0 0 1.25rem;
        padding-inline-start: 1.5rem;
}

.lafour-article-body ul {
        list-style: disc;
}

.lafour-article-body ol {
        list-style: decimal;
}

.lafour-article-body li {
        margin: 0 0 0.5rem;
}

.lafour-article-body li::marker {
        color: #bf8440;
}

.lafour-article-body figure {
        margin: 2rem 0;
}

.lafour-article-body figure img,
.lafour-article-body img {
        max-width: 100%;
        height: auto;
        border-radius: 0.875rem;
}

.lafour-article-body figcaption,
.lafour-article-body .wp-caption-text {
        margin-top: 0.5rem;
        font-size: 0.8125rem;
        font-weight: 500;
        color: var(--muted-foreground);
        text-align: center;
}

.lafour-article-body blockquote {
        margin: 2rem 0;
        padding: 1.25rem 1.5rem;
        border-inline-start: 4px solid #d9a25e;
        border-radius: 0.75rem;
        background-color: #f0f7f4;
        color: #275746;
        font-weight: 600;
}

.lafour-article-body blockquote p:last-child {
        margin-bottom: 0;
}

.lafour-article-body blockquote cite {
        display: block;
        margin-top: 0.5rem;
        font-size: 0.8125rem;
        font-style: normal;
        font-weight: 500;
        color: var(--muted-foreground);
}

.lafour-article-body hr {
        margin: 2.5rem 0;
        border: 0;
        border-top: 1px solid var(--border);
}

.lafour-article-body table {
        width: 100%;
        margin: 0 0 1.5rem;
        border-collapse: collapse;
        font-size: 0.9375rem;
}

.lafour-article-body th {
        background-color: #f0f7f4;
        color: #081f17;
        font-weight: 800;
        text-align: start;
}

.lafour-article-body th,
.lafour-article-body td {
        padding: 0.625rem 0.875rem;
        border: 1px solid var(--border);
}

.lafour-article-body code {
        direction: ltr;
        unicode-bidi: embed;
        font-size: 0.9em;
        background-color: #eef6f1;
        border-radius: 0.375rem;
        padding: 0.125rem 0.375rem;
}

.lafour-article-body pre {
        direction: ltr;
        text-align: start;
        overflow-x: auto;
        margin: 0 0 1.5rem;
        padding: 1rem 1.25rem;
        border-radius: 0.875rem;
        background-color: #081f17;
        color: #e8f1ec;
        font-size: 0.875rem;
        line-height: 1.8;
}

.lafour-article-body pre code {
        background: none;
        padding: 0;
        color: inherit;
        font-size: inherit;
}

/* گوتنبرگ — بلوک تصویر/نقل‌قول و عرض عریض */
.lafour-article-body .alignwide {
        width: min(100%, 60rem);
}

.lafour-article-body .wp-block-image img {
        border-radius: 0.875rem;
}

/* صفحه‌بندی مطالعه (wp_link_pages) */
.lafour-article-body .post-pages-links {
        margin: 2rem 0 0;
        font-size: 0.875rem;
        font-weight: 700;
        color: var(--muted-foreground);
}

.lafour-article-body .post-pages-links a {
        color: #275746;
        text-decoration: none;
}

/* ─── تگ‌های مقاله (div.lafour-article-tags) ─── */
/* v1.6.1: جداکنندهٔ بالای تگ‌ها به ردیف اشتراک‌گذاری منتقل شد؛ فاصله هم‌قامت mt-4 */
.lafour-article-tags {
        margin-top: 1rem;
}

.lafour-article-tags svg {
        flex-shrink: 0;
}

/* ═══ v1.5.1 — هات‌فیکس کاربردی‌های Tailwind غایب از باندل کامپایل‌شده ═══
   پس‌زمینه: site.css آخرین‌بار ۱۴۰۴/۰۷/۲۱ (پیش از فازهای A–F) با Tailwind v4.3.3
   کامپایل شد و هرگز بازسازی نشد؛ کاربردی‌های معرفی‌شده در آن فاز‌ها (که در
   قالب‌های PHP به کار رفته‌اند) قاعدهٔ CSS ندارند و بی‌اثرند. این بلوک دقیقاً
   همان قواعد را دست‌نویس بازتولید می‌کند (theme.css بعد از site.css لود می‌شود
   و قواعد لایه‌نشده بر @layer غلبه می‌کنند). با اولین بازسازی رسمی Tailwind
   می‌توان این بلوک را حذف کرد.

   قربانیان اصلی روی سایت زنده:
   ۱) چیپ اینماد فوتر (h-[92px] w-[76px] sm:h-[100px] sm:w-[84px] + max-h-full)
      → ۱۶×۱۶ پیکسل فرومی‌ریخت و تصویر اینماد ۰×۰ (lazy-deadlock) بود؛
   ۲) گالری صفحهٔ اقامتگاه (lg:max-h-[70vh]) → ۹۵٪ ارتفاع ویوپورت؛
   ۳) پدینگ safe-area نوار پایانی فوتر و جزئیات ریز دیگر. */

/* — اینماد: اندازهٔ چیپ (دقیقاً مطابق footer.php kolbeh_enamad_chip_class) — */
.h-\[92px\] { height: 92px; }
.w-\[76px\] { width: 76px; }
@media (min-width: 640px) {
        .sm\:h-\[100px\] { height: 100px; }
        .sm\:w-\[84px\] { width: 84px; }
}

/* — تصویر داخل چیپ/بج‌ها (محدود به کانتینر) — */
.max-h-full { max-height: 100%; }
.max-w-full { max-width: 100%; }

/* — گالری صفحهٔ اقامتگاه: قاعدهٔ ۷۰vh در v1.9.0 حذف شد (موزاییک جایگزین) —
   (باگ v1.8.2: تعامل aspect-16/10 با max-height عرض را به ۸۶۰–۱۰۰۸px
   می‌کاست و کادر چسبیده به راست، ۲۰۸–۳۵۶px فضای مرده می‌گذاشت.) */

/* — نوار پایانی فوتر: فاصله و پدینگ safe-area (فاز B) — */
@media (min-width: 640px) {
        .sm\:gap-3\.5 { gap: calc(var(--spacing) * 3.5); }
        .sm\:pb-\[calc\(env\(safe-area-inset-bottom\)\+1\.25rem\)\] {
                padding-bottom: calc(env(safe-area-inset-bottom) + 1.25rem);
        }
}
.pb-\[calc\(env\(safe-area-inset-bottom\)\+1\.5rem\)\] {
        padding-bottom: calc(env(safe-area-inset-bottom) + 1.5rem);
}

/* — آیکون‌های ۵.۵ اسپیسینگ فوتر — */
.h-5\.5 { height: calc(var(--spacing) * 5.5); }
.w-5\.5 { width: calc(var(--spacing) * 5.5); }

/* ══════════════════════════════════════════════════════════════════
   v1.6.0 — صفحات فوتر (قوانین / لغو رزرو / سوالات متداول) + تکمیل
   کاربردی‌های Tailwind غایب از باندل (ادامهٔ الگوی بلوک v1.5.1 بالا؛
   با اولین بازسازی رسمی Tailwind این بلوک هم حذف‌شدنی است).

   ۱) .from-forest-200 — گرادیان میلهٔ لهجهٔ تیترها (صفحه اصلی FAQ هم از
      آن استفاده می‌کرد ولی کامپایل نشده بود → میلهٔ سمت راست به شفاف
      می‌ریخت؛ پالت مطابق site.css: forest-200 #bcd9cc).
   ۲) حالت open آکاردئون‌ها — کلاس‌های data-[state=open]:* (پس‌زمینهٔ
      ظریف + چرخش شورون) در PHPها هستند ولی در باندل نیستند؛ این قواعد
      صفحهٔ اصلی FAQ، آکاردئون موبایل فوتر و صفحهٔ /faq را یکجا سالم
      می‌کنند (رفتار باز/بسته با theme.js است — فقط ظاهر).
   ۳) تایپوگرافی محتوای برگه‌های کلاسیک (.lafour-main .entry-content) —
      آینهٔ مقادیر lafour-article-body (فاز ۳): تیترها/لیست/جدول/لینک.
   ۴) .lafour-inline-link / .lafour-cta-box — اجزای مشترک قالب‌های
      /rules /cancellation /faq.
   ══════════════════════════════════════════════════════════════════ */

/* ─── ۱) گرادیان لهجه (مطابق فرمت from-* باندل) ─── */
.from-forest-200 {
        --tw-gradient-from: #bcd9cc;
        --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}

/* ─── ۲) حالت open آکاردئون (کلاس‌های data-state مرده در باندل) ─── */
[data-accordion-item][data-state="open"] {
        background-color: rgba(220, 236, 229, 0.4); /* bg-forest-50/40 */
}

[data-accordion-trigger][data-state="open"] > svg {
        transform: rotate(180deg);
        color: #4a8871; /* forest-500 */
}

[data-accordion-trigger] > svg {
        transition: transform 0.2s ease, color 0.2s ease;
}

/* ─── ۳) تایپوگرافی برگه‌های محتوایی (صفحات /rules /cancellation و مشابه) ─── */
.lafour-main .entry-content > h2 {
        margin: 2.25rem 0 1rem;
        font-size: 1.375rem;
        font-weight: 900;
        line-height: 2.25rem;
        color: #081f17;
}

.lafour-main .entry-content > h3 {
        margin: 2rem 0 0.875rem;
        font-size: 1.1875rem;
        font-weight: 800;
        line-height: 2rem;
        color: #081f17;
}

.lafour-main .entry-content > p {
        margin: 0 0 1.25rem;
}

.lafour-main .entry-content a {
        color: #275746;
        font-weight: 700;
        text-decoration: underline;
        text-decoration-color: #e3bc82;
        text-decoration-thickness: 2px;
        text-underline-offset: 4px;
        transition: color 0.2s ease;
}

.lafour-main .entry-content a:hover {
        color: #356e58;
}

.lafour-main .entry-content ul,
.lafour-main .entry-content ol {
        margin: 0 0 1.25rem;
        padding-inline-start: 1.5rem;
}

.lafour-main .entry-content ul {
        list-style: disc;
}

.lafour-main .entry-content ol {
        list-style: decimal;
}

.lafour-main .entry-content li {
        margin: 0 0 0.5rem;
}

.lafour-main .entry-content li::marker {
        color: #bf8440;
}

.lafour-main .entry-content table {
        width: 100%;
        margin: 0 0 1.5rem;
        border-collapse: collapse;
        font-size: 0.9375rem;
        line-height: 1.9;
}

.lafour-main .entry-content th {
        background-color: #f0f7f4;
        color: #081f17;
        font-weight: 800;
        text-align: start;
}

.lafour-main .entry-content th,
.lafour-main .entry-content td {
        padding: 0.625rem 0.875rem;
        border: 1px solid var(--border);
}

/* ─── ۴) اجزای مشترک قالب‌های فوتر ─── */

/* لینک درون‌متنی برنددار (هم‌ارز a داخل lafour-article-body) */
.lafour-inline-link {
        color: #275746;
        font-weight: 700;
        text-decoration: underline;
        text-decoration-color: #e3bc82;
        text-decoration-thickness: 2px;
        text-underline-offset: 4px;
        transition: color 0.2s ease;
}

.lafour-inline-link:hover {
        color: #356e58;
}

/* جعبهٔ CTA انتهای صفحات — ریست مارجین پاراگراف‌های entry-content */
.lafour-cta-box {
        margin-top: 2.5rem;
}

.lafour-cta-box p {
        margin: 0;
}

.lafour-cta-box p + p {
        margin-top: 0.25rem;
}

/* ══════════════════════════════════════════════════════════════════
   v1.6.1 — مقالهٔ مجله: ستون خوانش + نویسنده/اشتراک + دیدگاه‌های
   برند‌دار + رفع اسکرول افقی.

   ریشهٔ سرریز افقی موبایل (مطابق اندازه‌گیری زنده): textarea هستهٔ
   وردپرس با cols="45" → عرض ذاتی ۴۲۳px در ویوپورت ۳۹۰px. اصل در
   comments.php حل شد (textarea بدون cols + عرض ۱۰۰٪)؛ لایه‌های زیر
   بیمهٔ محتوای آیندهٔ کاربر (تصویر/امبد/جدول/لینک بلند) هستند.

   پالت (آینهٔ site.css): forest-950 #081f17 · forest-700 #275746 ·
   forest-600 #356e58 · forest-500 #4a8871 · forest-200 #bcd9cc ·
   forest-100 #dcece5 · forest-50 #f0f7f4 · honey-600 #bf8440 ·
   honey-ring #d9a25e.
   ══════════════════════════════════════════════════════════════════ */

/* ─── ۰) شبکهٔ ایمنی افقی (clip: بدون ایجاد scroll container؛
   چسبان‌ها و fixed بی‌اثر می‌مانند) — فول‌بک hidden برای مرورگرهای
   قدیمی‌تر از پشتیبانی clip ─── */
html {
        overflow-x: clip;
}

@supports not (overflow: clip) {
        html {
                overflow-x: hidden;
        }
}

/* ─── ۱) ستون خوانش مرکزی — محور ثابت مقاله (الگوی مجلات) ─── */
.lafour-article-col {
        width: 100%;
        max-width: 48rem;
        margin-inline: auto;
}

.lafour-article-hero {
        max-width: 64rem;
        margin-inline: auto; /* v1.6.1: پهن‌تر از ستون ولی هم‌محور */
}

/* ─── ۲) تایپوگرافی بدنه — پولیش v1.6.1 ─── */
.lafour-article-body {
        font-size: 1.0625rem; /* ۱۷px — خوانش راحت‌تر متن فارسی بلند */
        overflow-wrap: break-word; /* لینک/کلمهٔ نشکن */
}

/* گارد تصویر/امبد — هر محتوای user-generated */
.lafour-article-body :where(img, video, iframe, embed, object) {
        max-width: 100%;
}

/* جدول‌های پهن: اسکرول داخلی به‌جای سرریز صفحه */
.lafour-article-body table {
        display: block;
        overflow-x: auto;
}

/* میلهٔ عسلی زیر H2 — امضای editorial مقاله */
.lafour-article-body h2::after {
        content: "";
        display: block;
        width: 2.75rem;
        height: 0.25rem;
        margin-top: 0.625rem;
        border-radius: 999px;
        background: linear-gradient(90deg, #bf8440, #d9a25e);
}

.lafour-article-body ::selection {
        background-color: #bcd9cc;
        color: #081f17;
}

/* تیترها برای لینک لنگری زیر هدر ثابت ۴rem */
.lafour-article-body :where(h2, h3, h4) {
        scroll-margin-top: 5rem;
}

/* مسیر برگه‌های کلاسیک — همان گاردها */
.lafour-main .entry-content {
        overflow-wrap: break-word;
}

.lafour-main .entry-content :where(img, video, iframe, embed, object) {
        max-width: 100%;
}

.lafour-main .entry-content table {
        display: block;
        overflow-x: auto;
}

/* ─── ۳) نوار پیشرفت مطالعه — چسبان زیر هدر ثابت (h-16 = 4rem) ─── */
.lafour-reading-progress {
        position: sticky;
        top: 4rem;
        z-index: 40;
        display: block;
        height: 0.1875rem;
        margin-bottom: 1rem;
        border-radius: 999px;
        background-color: #e3eeea;
}

.lafour-reading-progress__bar {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #356e58 0%, #4a8871 45%, #bf8440 80%, #d9a25e 100%);
        transform: scaleX(0);
        transform-origin: 100% 50%; /* پر شدن از راست (RTL) */
        transition: transform 0.1s linear;
}

@media (prefers-reduced-motion: reduce) {
        .lafour-reading-progress__bar {
                transition: none;
        }
}

/* ─── ۴) ردیف اشتراک‌گذاری ─── */
.lafour-article-share {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem 1rem;
}

.lafour-article-share__label {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.8125rem;
        font-weight: 800;
        color: #081f17;
}

.lafour-article-share__label svg {
        width: 1rem;
        height: 1rem;
        color: #bf8440;
}

.lafour-article-share__btns {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.5rem;
}

.lafour-share-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.875rem;
        border: 1px solid #dcece5;
        border-radius: 0.875rem;
        background-color: #fff;
        color: #275746;
        font-size: 0.75rem;
        font-weight: 700;
        line-height: 1;
        box-shadow: 0 1px 2px rgba(8, 31, 23, 0.05);
        cursor: pointer;
        transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, transform 0.12s ease;
}

.lafour-share-btn:hover {
        border-color: #356e58;
        background-color: #f0f7f4;
        color: #081f17;
        text-decoration: none;
}

.lafour-share-btn:active {
        transform: scale(0.96);
}

.lafour-share-btn svg {
        width: 1rem;
        height: 1rem;
        flex-shrink: 0;
}

/* برچسب متنی دکمه‌ها فقط ≥640px (موبایل: فقط آیکون) */
.lafour-share-btn__text {
        display: none;
}

@media (min-width: 640px) {
        .lafour-share-btn__text {
                display: inline;
        }
}

/* ─── ۵) کارت نویسنده ─── */
.lafour-author-card {
        display: flex;
        align-items: flex-start;
        gap: 1rem;
        padding: 1.125rem 1.25rem;
        border: 1px solid #dcece5;
        border-radius: 1.25rem;
        background: linear-gradient(135deg, #f0f7f4 0%, #ffffff 60%);
}

.lafour-author-card__label {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        font-size: 0.6875rem;
        font-weight: 800;
        color: #4a8871;
        letter-spacing: 0.02em;
}

.lafour-author-card__label svg {
        width: 0.875rem;
        height: 0.875rem;
        flex-shrink: 0;
}

.lafour-author-card__name {
        display: inline-block;
        margin-top: 0.25rem;
        font-size: 0.9375rem;
        font-weight: 900;
        color: #081f17;
}

a.lafour-author-card__name:hover {
        color: #356e58;
}

.lafour-author-card__bio {
        margin: 0.375rem 0 0;
        font-size: 0.8125rem;
        line-height: 1.9;
        color: #356e58;
}

.lafour-author-card__link {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        margin-top: 0.5rem;
        font-size: 0.75rem;
        font-weight: 800;
        color: #bf8440;
        transition: color 0.15s ease;
}

.lafour-author-card__link:hover {
        color: #a06a2e;
}

.lafour-author-card__link svg {
        width: 0.875rem;
        height: 0.875rem;
        flex-shrink: 0;
}

/* ─── ۶) آواتار حروف‌اول برند (kolbeh_initial_avatar) ─── */
.lafour-initial-avatar {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 2.75rem;
        height: 2.75rem;
        border-radius: 999px;
        color: #fff;
        font-size: 1.125rem;
        font-weight: 800;
        line-height: 1;
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.28);
}

.lafour-initial-avatar--sm {
        width: 1.375rem;
        height: 1.375rem;
        font-size: 0.6875rem;
        box-shadow: none;
}

.lafour-initial-avatar--lg {
        width: 3.25rem;
        height: 3.25rem;
        font-size: 1.25rem;
}

.lafour-initial-avatar--forest {
        background: linear-gradient(135deg, #275746, #081f17);
}

.lafour-initial-avatar--moss {
        background: linear-gradient(135deg, #356e58, #275746);
}

.lafour-initial-avatar--olive {
        background: linear-gradient(135deg, #4a8871, #356e58);
}

.lafour-initial-avatar--honey {
        background: linear-gradient(135deg, #d9a25e, #bf8440);
}

.lafour-initial-avatar--cedar {
        background: linear-gradient(135deg, #6fae86, #4a8871);
}

/* ─── ۷) فهرست دیدگاه‌ها ─── */
.lafour-comments {
        margin-top: 3rem;
        width: 100%;
        max-width: 48rem; /* هم‌محور ستون خوانش */
        margin-inline: auto;
}

.lafour-comments__head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.75rem;
}

.lafour-comments__count {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        border-radius: 999px;
        background-color: #dcece5;
        color: #081f17;
        font-size: 0.75rem;
        font-weight: 800;
}

.lafour-comments__count svg {
        width: 0.75rem;
        height: 0.75rem;
        flex-shrink: 0;
}

.lafour-comments__list {
        margin: 1.5rem 0 0;
        padding: 0;
        list-style: none;
}

.lafour-comments__list > .comment {
        margin: 0;
}

/* کارت یک دیدگاه */
.lafour-comment__card {
        display: flex;
        gap: 0.875rem;
        padding: 1rem 1.125rem;
        border: 1px solid #e3eeea;
        border-radius: 1.25rem;
        background: linear-gradient(180deg, #ffffff, #f8fcfa);
}

.lafour-comment__avatar-img {
        width: 2.75rem;
        height: 2.75rem;
        flex-shrink: 0;
        border-radius: 999px;
        object-fit: cover;
}

.lafour-comment__body {
        flex: 1 1 auto;
        min-width: 0; /* فرزندان بلند را نمی‌گذارد کارت را پهن کند */
}

.lafour-comment__head {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0.375rem 0.625rem;
}

.lafour-comment__author,
.lafour-comment__author-link {
        font-size: 0.875rem;
        font-weight: 800;
        color: #081f17;
}

.lafour-comment__author-link:hover {
        color: #356e58;
        text-decoration: none;
}

.lafour-comment__badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.1875rem 0.5rem;
        border: 1px solid #bcd9cc;
        border-radius: 999px;
        background-color: #f0f7f4;
        color: #275746;
        font-size: 0.625rem;
        font-weight: 800;
}

.lafour-comment__badge svg {
        width: 0.625rem;
        height: 0.625rem;
        flex-shrink: 0;
}

.lafour-comment__meta {
        font-size: 0.6875rem;
        font-weight: 600;
        color: #7d9489;
}

.lafour-comment__content {
        margin-top: 0.375rem;
        font-size: 0.875rem;
        line-height: 2;
        color: var(--foreground, #1f342b);
        overflow-wrap: anywhere; /* لینک‌های بلند داخل متن دیدگاه */
}

.lafour-comment__content p {
        margin: 0.25rem 0 0;
}

.lafour-comment__content p:first-child {
        margin-top: 0;
}

.lafour-comment__content a {
        color: #275746;
        font-weight: 700;
        text-decoration: underline;
        text-decoration-color: #d9a25e;
        text-underline-offset: 3px;
}

.lafour-comment__pending {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-top: 0.5rem;
        padding: 0.5rem 0.75rem;
        border: 1px dashed #d9a25e;
        border-radius: 0.75rem;
        background-color: #fdf6ec;
        color: #8a6a33;
        font-size: 0.75rem;
        font-weight: 700;
}

.lafour-comment__pending svg {
        width: 0.75rem;
        height: 0.75rem;
        flex-shrink: 0;
}

.lafour-comment__reply {
        margin-top: 0.5rem;
}

.comment-reply-link {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        border: 1px solid #dcece5;
        border-radius: 0.875rem;
        background-color: #fff;
        font-size: 0.6875rem;
        font-weight: 800;
        color: #275746;
        transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.comment-reply-link:hover {
        border-color: #356e58;
        background-color: #f0f7f4;
        color: #081f17;
        text-decoration: none;
}

/* زنجیرهٔ پاسخ‌ها — خط راهنما هم‌راستای شروع متن (RTL) */
.lafour-comments .children {
        list-style: none;
        margin: 0.5rem 0 0;
        padding-inline-start: 1.75rem;
        border-inline-start: 2px solid #dcece5;
}

.lafour-comments .children .lafour-comment__card {
        background: linear-gradient(180deg, #fbfdfc, #f4faf7);
}

/* پیگ‌بک/ترک‌بک — فشرده */
.lafour-ping__row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.375rem 0.5rem;
        margin: 0;
        padding: 0.5rem 0.75rem;
        border: 1px dashed #dcece5;
        border-radius: 0.875rem;
        font-size: 0.75rem;
        color: #356e58;
}

.lafour-ping__row a {
        font-weight: 800;
        color: #275746;
}

.lafour-ping__row svg {
        width: 0.75rem;
        height: 0.75rem;
        color: #bf8440;
        flex-shrink: 0;
}

/* صفحه‌بندی */
.lafour-comments__pagination {
        margin-top: 1.25rem;
}

.lafour-comments__pagination .page-numbers {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 2.25rem;
        height: 2.25rem;
        margin: 0 0.1875rem;
        padding: 0 0.5rem;
        border: 1px solid #dcece5;
        border-radius: 0.875rem;
        font-size: 0.75rem;
        font-weight: 800;
        color: #275746;
        transition: border-color 0.15s ease, background-color 0.15s ease;
}

.lafour-comments__pagination a.page-numbers:hover {
        border-color: #356e58;
        background-color: #f0f7f4;
        text-decoration: none;
}

.lafour-comments__pagination .page-numbers.current {
        border-color: #081f17;
        background-color: #081f17;
        color: #fff;
}

/* حالت خالی */
.lafour-comments__empty {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-top: 1.5rem;
        padding: 1.25rem 1.375rem;
        border: 1.5px dashed #dcece5;
        border-radius: 1.25rem;
        background-color: #fbfdfc;
}

.lafour-comments__empty-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2.75rem;
        height: 2.75rem;
        flex-shrink: 0;
        border-radius: 999px;
        background-color: #f0f7f4;
        color: #356e58;
}

.lafour-comments__empty-title {
        margin: 0;
        font-size: 0.875rem;
        font-weight: 800;
        color: #081f17;
}

.lafour-comments__empty-text {
        margin: 0.25rem 0 0;
        font-size: 0.75rem;
        line-height: 1.8;
        color: #7d9489;
}

/* بسته بودن دیدگاه‌ها */
.lafour-comments__closed {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-top: 1.5rem;
        padding: 0.625rem 0.875rem;
        border: 1px solid #dcece5;
        border-radius: 0.875rem;
        background-color: #f0f7f4;
        color: #356e58;
        font-size: 0.75rem;
        font-weight: 700;
}

.lafour-comments__closed svg {
        width: 0.875rem;
        height: 0.875rem;
        flex-shrink: 0;
}

/* ─── ۸) فرم دیدگاه — شبکه‌ای، بدون سرریز ─── */
.lafour-comments__form-title {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.5rem;
        margin: 2.5rem 0 0;
        font-size: 1rem;
        font-weight: 900;
        color: #081f17;
}

.lafour-comments__form-title svg {
        width: 1rem;
        height: 1rem;
        color: #bf8440;
        flex-shrink: 0;
}

.lafour-cancel-reply {
        font-size: 0.6875rem;
        font-weight: 700;
}

.lafour-cancel-reply a {
        color: #bf8440;
}

/* شبکهٔ فرم — موبایل تک‌ستونه، ≥640px دو ستونه برای نام/ایمیل */
#commentform {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1.125rem;
        margin-top: 1.25rem;
}

#commentform p {
        margin: 0;
}

@media (min-width: 640px) {
        #commentform {
                grid-template-columns: 1fr 1fr;
        }

        #commentform p.comment-form-comment,
        #commentform p.comment-form-url,
        #commentform p.comment-form-cookies-consent,
        #commentform p.form-submit,
        #commentform p.comment-notes,
        #commentform p.logged-in-as,
        #commentform p.must-log-in {
                grid-column: 1 / -1;
        }
}

.lafour-field label {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        margin-bottom: 0.5rem;
        font-size: 0.75rem;
        font-weight: 800;
        color: #275746;
}

.lafour-field label svg {
        width: 0.875rem;
        height: 0.875rem;
        color: #bf8440;
        flex-shrink: 0;
}

.lafour-field label b {
        color: #bf8440;
}

.lafour-field label small {
        font-size: 0.625rem;
        font-weight: 600;
        color: #7d9489;
}

/* ← ریشهٔ اسکرول افقی: عرض ۱۰۰٪ برای همهٔ ورودی‌ها (cols=45 حذف شد) */
#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"],
#commentform textarea {
        width: 100%;
        max-width: 100%;
        padding: 0.75rem 1rem;
        border: 1.5px solid #dcece5;
        border-radius: 0.875rem;
        background-color: #fff;
        color: #081f17;
        font-family: inherit;
        font-size: 0.875rem;
        line-height: 1.9;
        transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#commentform textarea {
        min-height: 9rem;
        resize: vertical;
}

#commentform input:focus,
#commentform textarea:focus {
        outline: none;
        border-color: #356e58;
        box-shadow: 0 0 0 3px rgba(53, 110, 88, 0.13);
}

#commentform ::placeholder {
        color: #a3b5ac;
}

.lafour-comment-form__notes {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.6875rem;
        font-weight: 600;
        line-height: 1.7;
        color: #7d9489;
}

.lafour-comment-form__notes svg {
        width: 0.75rem;
        height: 0.75rem;
        color: #bf8440;
        flex-shrink: 0;
}

/* رضایت کوکی */
#commentform p.comment-form-cookies-consent {
        display: flex;
        align-items: flex-start;
        gap: 0.625rem;
}

#commentform p.comment-form-cookies-consent input[type="checkbox"] {
        width: 1.125rem;
        height: 1.125rem;
        margin: 0.2rem 0 0;
        accent-color: #356e58;
        flex-shrink: 0;
        cursor: pointer;
}

#commentform p.comment-form-cookies-consent label {
        font-size: 0.75rem;
        font-weight: 600;
        line-height: 1.7;
        color: #7d9489;
        cursor: pointer;
}

/* دکمهٔ ارسال */
p.form-submit {
        display: flex;
}

.lafour-comment-form__submit {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.8rem 1.5rem;
        border: 0;
        border-radius: 1rem;
        background: linear-gradient(135deg, #275746, #081f17);
        color: #fff;
        font-family: inherit;
        font-size: 0.8125rem;
        font-weight: 800;
        cursor: pointer;
        box-shadow: 0 10px 24px -10px rgba(8, 31, 23, 0.45);
        transition: transform 0.12s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.lafour-comment-form__submit:hover {
        filter: brightness(1.15);
        box-shadow: 0 12px 28px -10px rgba(8, 31, 23, 0.55);
}

.lafour-comment-form__submit:active {
        transform: scale(0.97);
}

/* هواپیمای کاغذی در RTL جهت درست بگیرد */
.lafour-comment-form__submit svg {
        width: 1rem;
        height: 1rem;
        flex-shrink: 0;
        transform: scaleX(-1);
}

/* حالت ورود (logged-in-as) */
#commentform p.logged-in-as {
        font-size: 0.75rem;
        font-weight: 600;
        color: #7d9489;
}

#commentform p.logged-in-as a {
        color: #275746;
        font-weight: 800;
}

/* فرم جابه‌جاشده زیر دیدگاه (comment-reply.js) */
.lafour-comments .lafour-comments .comment-respond {
        margin-top: 1rem;
}

/* ══════════════════════════════════════════════════════════════════════════
   v1.7.0 — فوتر «طرح C: دونوتی ادیتوریال» (تأیید کارفرما؛ الگوی jajiga.com)
   چیدمان: نوار اپ (چیدمان v1.4.4 دست‌نخورده) → ردیف اصلی → ردیف سئو →
   نوار اعتماد تیره → نوار پایانی. پوست: بالای کِرِمِ گرم + پایین جنگل تیره.
   همهٔ استایل‌ها زیر فضای‌نام klf- — بدون نیاز به بازسازی Tailwind.
   پالت: forest-950 #081f17 · forest-700 #275746 · honey-500 #d9a25e
   متن روی کرم: #2a352e / #75806f · کِرِم: #f8f5ee · خط کِرِم: #e8e1d2
   ══════════════════════════════════════════════════════════════════════════ */

/* ریشهٔ فوتر — بدنهٔ روشن گرم (بال) + نواری تیره (پایین) */
.klf-root {
        background: #f8f5ee;
        color: #2a352e;
        font-family: inherit;
}

/* ─── ۱) نوار اپ — چیدمان دست‌نخورده، فقط هم‌پوست ─── */
.klf-app {
        border-bottom: 1px solid #e8e1d2;
}

.klf-app-title {
        color: #081f17;
}

.klf-app-sub {
        color: #75806f;
}

/* ─── ۲) ردیف اصلی — ۳ ستون دسکتاپ (1.5fr / 1.55fr / 1.1fr)؛ موبایل تک‌ستونه ─── */
@media (min-width: 1024px) {
        .klf-main {
                grid-template-columns: 1.5fr 1.55fr 1.1fr;
        }
}

/* تیتر بخش‌ها — با خط تأکیدی طلایی (امضای ادیتوریال طرح C) */
.klf-sec-title {
        font-size: 0.875rem;
        font-weight: 800;
        color: #081f17;
        margin-bottom: 0.875rem;
        display: flex;
        align-items: center;
        gap: 0.625rem;
}

.klf-sec-title::after {
        content: "";
        flex: 0 0 auto;
        width: 2.125rem;
        height: 3px;
        border-radius: 99px;
        background: linear-gradient(90deg, #d9a25e, #ecd4a8);
}

/* — ستون برند — */
.klf-brand-logo {
        display: block;
        margin-bottom: 0.625rem;
}

.klf-brand-subline {
        color: #9aa394;
}

.klf-brand-about {
        color: #75806f;
        line-height: 2.1;
        max-width: 36ch;
}

.klf-contact-row {
        font-size: 0.8125rem;
        font-weight: 700;
        color: #275746;
        transition: color 0.2s ease;
}

a.klf-contact-row:hover {
        color: #bf8440;
}

.klf-contact-row--muted {
        font-weight: 500;
        color: #75806f;
}

.klf-contact-ic {
        background: #fff;
        border: 1px solid #e8e1d2;
        box-shadow: 0 1px 2px rgba(8, 31, 23, 0.05);
        color: #bf8440;
}

.klf-contact-hours {
        color: #9aa394;
}

/* — لینک‌های دسترسی: دو زیرستون همیشه‌باز (بدون آکاردئون) — */
.klf-links-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem 1.75rem;
}

.klf-links ul {
        list-style: none;
        margin: 0;
        padding: 0;
}

.klf-links li {
        margin: 0;
        padding: 0;
}

.klf-links a {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding-block: 0.53rem;
        font-size: 0.8125rem;
        font-weight: 600;
        line-height: 1.5;
        color: #275746;
        transition: color 0.2s ease;
}

.klf-links a::before {
        content: "";
        width: 5px;
        height: 5px;
        border-radius: 99px;
        background: #e3bc82;
        flex: 0 0 auto;
        transition: background 0.2s ease;
}

.klf-links a:hover {
        color: #bf8440;
}

.klf-links a:hover::before {
        background: #d9a25e;
}

/* بج اختیاری لینک (مثلاً «جدید» مجله) */
.klf-badge {
        font-size: 0.625rem;
        font-weight: 800;
        color: #fff;
        background: #d9a25e;
        border-radius: 99px;
        padding: 1.5px 8px;
        line-height: 1.7;
        flex: 0 0 auto;
}

/* — با ما همراه شوید — دکمه‌های بزرگ جاجیگا-گونه + چیپ‌ها — */
.klf-social-btn {
        display: flex;
        align-items: center;
        gap: 0.625rem;
        border-radius: 12px;
        padding: 0.625rem 0.875rem;
        font-size: 0.84375rem;
        font-weight: 700;
        margin-bottom: 0.625rem;
        color: #fff;
        transition: transform 0.2s ease, box-shadow 0.2s ease;
        box-shadow: 0 2px 10px rgba(8, 31, 23, 0.1);
}

.klf-social-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(8, 31, 23, 0.18);
}

.klf-social-btn--instagram {
        background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.klf-social-btn--telegram {
        background: #279fd9;
}

.klf-social-ic {
        width: 1.25rem;
        height: 1.25rem;
        flex-shrink: 0;
}

.klf-social-grow {
        flex: 1;
        text-align: right;
}

.klf-social-count {
        font-size: 0.71875rem;
        font-weight: 800;
        background: rgba(255, 255, 255, 0.25);
        border-radius: 99px;
        padding: 3px 11px;
}

.klf-social-chips {
        display: flex;
        gap: 0.5rem;
        margin-top: 0.75rem;
}

.klf-chip {
        display: flex;
        height: 2.5rem;
        min-width: 0;
        flex: 1;
        align-items: center;
        justify-content: center;
        gap: 0.375rem;
        background: #fff;
        border: 1px solid #e8e1d2;
        border-radius: 11px;
        font-size: 0.71875rem;
        font-weight: 700;
        color: #275746;
        transition: border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.klf-chip:hover {
        border-color: #d9a25e;
        color: #bf8440;
        transform: translateY(-1px);
}

.klf-chip-ic {
        width: 1rem;
        height: 1rem;
        flex-shrink: 0;
}

/* ─── ۳) ردیف سئو — مقاصد و دسته‌ها (۲/۳/۵ ستونه) ─── */
.klf-seo {
        border-top: 1px solid #e8e1d2;
        background: #f3efe5;
}

.klf-seo-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 1.375rem;
        padding-block: 1.125rem;
}

@media (min-width: 640px) {
        .klf-seo-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
        }
}

@media (min-width: 1024px) {
        .klf-seo-grid {
                grid-template-columns: repeat(5, minmax(0, 1fr));
        }
}

.klf-seo-link {
        font-size: 0.75rem;
        font-weight: 500;
        color: #75806f;
        padding-block: 0.44rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        transition: color 0.2s ease;
}

.klf-seo-link:hover {
        color: #bf8440;
}

/* ─── ۴) نوار اعتماد — تیرهٔ جنگل؛ نشان‌ها ستارهٔ صحنه ─── */
.klf-trust {
        background: #081f17;
        color: #dcece5;
}

.klf-trust-inner {
        padding-block: 1.625rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
}

@media (min-width: 1024px) {
        .klf-trust-inner {
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                gap: 1.5rem;
                padding-block: 1.875rem;
        }
}

.klf-trust-copy {
        text-align: center;
}

@media (min-width: 1024px) {
        .klf-trust-copy {
                text-align: right;
        }
}

.klf-trust-title {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        font-size: 0.90625rem;
        font-weight: 800;
        color: #fff;
}

@media (min-width: 1024px) {
        .klf-trust-title {
                justify-content: flex-start;
        }
}

.klf-trust-ic {
        width: 1.1875rem;
        height: 1.1875rem;
        color: #e3bc82;
        flex-shrink: 0;
}

.klf-trust-sub {
        font-size: 0.6875rem;
        font-weight: 500;
        color: #94bfae;
        margin-top: 0.44rem;
        line-height: 1.9;
}

/* کارت‌های نشان — سفید ۸۴×۹۰، گوشهٔ ۱۶، سایهٔ نرم (اندازهٔ مرجع جاجیگا) */
.klf-seals {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: center;
        gap: 0.875rem;
}

.klf-seal {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.44rem;
        flex: 0 0 auto;
}

.klf-seal-card {
        display: flex;
        height: 90px;
        width: 84px;
        align-items: center;
        justify-content: center;
        background: #fff;
        border-radius: 16px;
        padding: 9px;
        border: 1px solid rgba(255, 255, 255, 0.08);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
}

a.klf-seal:hover .klf-seal-card {
        transform: translateY(-3px);
        box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45);
}

/* حالت تکه‌کد رسمی اینماد — اسنیپت اندازهٔ خودش را دارد */
.klf-seal-card--raw {
        width: auto;
        min-width: 84px;
        max-width: 120px;
}

.klf-seal-img {
        max-height: 100%;
        max-width: 100%;
        width: auto;
        height: auto;
        object-fit: contain;
}

.klf-seal-card img {
        max-height: 100%;
        max-width: 100%;
        object-fit: contain;
}

.klf-seal-heritage {
        height: 100%;
        width: 100%;
}

.klf-seal-cap {
        font-size: 0.65625rem;
        font-weight: 600;
        color: #94bfae;
        line-height: 1.6;
        text-align: center;
}

.klf-seal-code {
        font-size: 0.625rem;
        font-weight: 600;
        color: #6aa48e;
        direction: ltr;
}

/* ─── ۵) نوار پایانی — تیره؛ کپی‌رایت + امضا ─── */
.klf-bottom {
        background: #081f17;
        border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.klf-copyright {
        color: #6aa48e;
}

.klf-signature {
        color: #6aa48e;
}

.klf-signature-brand {
        color: #bcd9cc;
}

.klf-signature-brand:hover {
        color: #e3bc82;
}

/* ─── موبایل — بدون آکاردئون: برند وسط‌چین، ستون‌ها ۲تایی، بدون سرریز ─── */
@media (max-width: 1023px) {
        .klf-brand {
                text-align: center;
        }

        .klf-brand-logo {
                margin-inline: auto;
        }

        .klf-brand-about {
                margin-inline: auto;
        }

        .klf-contact {
                align-items: center;
        }

        .klf-contact-row {
                justify-content: center;
        }
}

@media (max-width: 400px) {
        .klf-links-grid {
                gap: 0.5rem 0.875rem;
        }

        .klf-seo-grid {
                gap: 0 1rem;
        }
}

/* ══════════════════════════════════════════════════════════════════════════
   v1.7.1 — اصلاحیهٔ فوتر پس از بازخورد کارفرما (دموی option-c-v2)
   ۱) بله → سومین دکمهٔ بزرگ سوشال با سبزِ رسمی پیام‌رسان بله (#00C090؛
      نمونه‌برداری از لوگوی رسمی CC0 — Wikimedia Commons؛ hover: #00A87C).
   ۲) رفع باگ رنگ دکمه‌های دانلود/نصب اپ: bg-forest-900/90 در build تیلویند
      تعریف نشده بود و دکمه‌ها بی‌زمینه (متن سفیدِ نامرئی) رندر می‌شدند.
      پوست توپر به klf-store-btn منتقل شد — مستقل از بازسازی تیلویند.
   ══════════════════════════════════════════════════════════════════════════ */

/* بله — سومین دکمهٔ بزرگ (هم‌سبک اینستاگرام/تلگرام) */
.klf-social-btn--bale {
        background: #00c090;
}

.klf-social-btn--bale:hover {
        background: #00a87c;
}

/* پوست دکمه‌های استور/PWA — زمینهٔ توپر جنگل‌تیره + رینگ داخلی ظریف + hover عسلی */
.klf-store-btn {
        background: #081f17;
        color: #fff;
        border: 1px solid transparent;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
        transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.klf-store-btn:hover {
        background: #1a4033;
        border-color: #d9a25e;
        transform: translateY(-1px);
}

/* ══════════════════════════════════════════════════════════════════
   بلوک v1.9.0 — گالری صفحهٔ اقامتگاه (بنچمارک جاجیگا room/3153239)
   موزاییک دسکتاپ (klf-mosaic) + فلش‌های ≥۶۴۰px (klf-gallery-arrow) +
   لایت‌باکس فول‌اسکرین (klf-lightbox — markup در theme.js ساخته می‌شود).
   مستقل از بیلد Tailwind (فضای‌نام klf-*) — با بازسازی رسمی Tailwind
   موزاییک می‌تواند به utilityها منتقل شود اما لایت‌باکس JS-ساخت باقی می‌ماند.
   پالت: forest-950 #081f17 / forest-800 #1a4033 / honey-400 #e3bc82. */

/* ——— ۱) موبایل/تبلت: کاروسل — فلش‌ها فقط ≥۶۴۰px (جاجیگا: سوایپ خالص) ——— */
.klf-gallery-arrow {
        display: none;
}

@media (min-width: 640px) {
        .klf-gallery-arrow {
                display: flex;
        }
}

/* ——— ۲) موزاییک دسکتاپ (lg+) — تمام‌عرض، متقارن، ~۳۸vh ———
   degrade خودکار با data-count:
   1=تمام‌نما / 2=نیم‌نیم / 3=بزرگ+۲عمودی / 4=۲×۲ / 5=بزرگ+۲×۲ (پیش‌فرض)
   گرید RTL: ستون ۱ (inline-start) = راست → خانهٔ بزرگ سمت راست، عین جاجیگا. */
.klf-mosaic {
        display: none;
}

.klf-mosaic__tile {
        position: relative;
        overflow: hidden;
        padding: 0;
        border: 0;
        margin: 0;
        border-radius: 14px;
        cursor: pointer;
        background: #081f17;
        box-shadow: none;
}

.klf-mosaic__tile img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s ease;
}

@media (hover: hover) {
        .klf-mosaic__tile:hover img {
                transform: scale(1.03);
        }
}

.klf-mosaic__tile:focus-visible {
        outline: 2px solid #e3bc82;
        outline-offset: 2px;
}

/* نشان «نمایش همهٔ تصاویر» — تزئینی (pointer-events:none) روی خانهٔ آخر */
.klf-mosaic__more {
        position: absolute;
        bottom: 12px;
        left: 50%;
        transform: translateX(-50%);
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 9px 14px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.96);
        color: #102b21;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap;
        box-shadow: 0 4px 14px rgba(8, 31, 23, 0.22);
        pointer-events: none;
}

.klf-mosaic__more svg {
        width: 14px;
        height: 14px;
        flex: 0 0 auto;
}

@media (min-width: 1024px) {
        .klf-mosaic {
                display: grid;
                grid-template-columns: 2fr 1fr 1fr;
                grid-template-rows: 1fr 1fr;
                gap: 10px;
                height: clamp(300px, 38vh, 460px); /* جاجیگا: ۳۳۸px در 1440 — عنوان/قیمت بالای فولد */
                width: 100%; /* رفع باگ v1.8.2: دیگر هرگز کادرِ ناتقارن چسبیده به راست */
        }

        /* در دسکتاپ کاروسل موبایل مخفی (و بالعکس در <lg موزاییک مخفی) */
        .klf-gallery-carousel {
                display: none;
        }

        .klf-mosaic__hero {
                grid-column: 1;
                grid-row: 1 / span 2;
        }

        /* degrade: ۱=تمام‌نما */
        .klf-mosaic[data-count="1"] {
                grid-template-columns: 1fr;
                grid-template-rows: 1fr;
        }

        .klf-mosaic[data-count="1"] .klf-mosaic__hero {
                grid-column: 1;
                grid-row: 1;
        }

        /* degrade: ۲=نیم‌نیم (خانهٔ بزرگ عرض کامل ردیف — نیم‌نیم واقعی) */
        .klf-mosaic[data-count="2"] {
                grid-template-columns: 1fr 1fr;
                grid-template-rows: 1fr;
        }

        .klf-mosaic[data-count="2"] .klf-mosaic__hero {
                grid-column: 1;
                grid-row: 1;
        }

        /* degrade: ۳=بزرگ + ۲ عمودی */
        .klf-mosaic[data-count="3"] {
                grid-template-columns: 2fr 1fr;
        }

        /* degrade: ۴=۲×۲ مساوی (بدون خانهٔ بزرگ — متعادل‌ترین چیدمان برای ۴) */
        .klf-mosaic[data-count="4"] {
                grid-template-columns: 1fr 1fr;
        }

        .klf-mosaic[data-count="4"] .klf-mosaic__hero {
                grid-column: 1;
                grid-row: 1;
        }
}

/* ——— ۳) لایت‌باکس (مثل جاجیگا: بستن+عنوان+قلب/اشتراک بالا، تصویر contain،
   شمارنده + نوار بندانگشتی پایین) ——— */
.klf-lightbox {
        position: fixed;
        inset: 0;
        z-index: 9990;
        display: flex;
        flex-direction: column;
        background: rgba(8, 31, 23, 0.94); /* forest-950/94 */
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.2s ease, visibility 0.2s ease;
}

.klf-lightbox[hidden] {
        display: none !important;
}

.klf-lightbox.is-open {
        opacity: 1;
        visibility: visible;
}

.klf-lightbox__top {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        min-height: 60px;
        order: 1;
}

.klf-lightbox__title {
        flex: 1;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center;
        color: rgba(255, 255, 255, 0.92);
        font-size: 13px;
        font-weight: 700;
}

.klf-lightbox__actions {
        display: flex;
        gap: 8px;
}

.klf-lightbox__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        padding: 0;
        border: 0;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.08);
        color: #fff;
        cursor: pointer;
        transition: background 0.2s ease, transform 0.15s ease;
        -webkit-tap-highlight-color: transparent;
}

.klf-lightbox__btn:hover {
        background: rgba(255, 255, 255, 0.18);
}

.klf-lightbox__btn:active {
        transform: scale(0.92);
}

.klf-lightbox__btn:focus-visible {
        outline: 2px solid #e3bc82;
        outline-offset: 2px;
}

.klf-lightbox__btn[disabled] {
        opacity: 0.3;
        cursor: default;
        pointer-events: none;
}

.klf-lightbox__btn.is-active {
        color: #e3bc82;
}

.klf-lightbox__btn.is-active svg {
        fill: currentColor;
}

.klf-lightbox__svg {
        width: 20px;
        height: 20px;
}

.klf-lightbox__stage {
        position: relative;
        flex: 1;
        min-height: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 8px 64px; /* جای فلش‌های کناری (جاجیگا: فلش ۳۲px لبه‌ای) */
        order: 2;
        cursor: zoom-out; /* کلیک بک‌دراپ = بستن */
}

.klf-lightbox__figure {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        max-width: 100%;
        max-height: 100%;
        margin: 0;
        cursor: default;
}

.klf-lightbox__img {
        display: block;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        object-fit: contain; /* عین جاجیگا: تصویر کامل، بدون برش */
        border-radius: 8px;
        transition: opacity 0.25s ease;
        -webkit-user-drag: none;
        user-select: none;
}

.klf-lightbox__img.is-loading {
        opacity: 0.35;
}

.klf-lightbox__spinner {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 34px;
        height: 34px;
        margin: -17px 0 0 -17px;
        border: 3px solid rgba(255, 255, 255, 0.18);
        border-top-color: #e3bc82;
        border-radius: 50%;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease;
}

.klf-lightbox__spinner.is-on {
        opacity: 1;
        animation: klf-spin 0.7s linear infinite;
}

@keyframes klf-spin {
        to {
                transform: rotate(360deg);
        }
}

.klf-lightbox__arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
}

/* RTL — قبلی: راست / بعدی: چپ (عین چیدمان فلش‌های جاجیگا) */
.klf-lightbox__arrow--prev {
        right: 14px;
}

.klf-lightbox__arrow--next {
        left: 14px;
}

.klf-lightbox__bottom {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        padding: 10px 16px 14px;
        order: 3;
}

.klf-lightbox__counter {
        color: rgba(255, 255, 255, 0.88);
        font-size: 12.5px;
        font-weight: 700;
        line-height: 1;
}

.klf-lightbox__thumbs {
        display: flex;
        gap: 8px;
        max-width: 100%;
        padding: 2px;
        overflow-x: auto;
        scrollbar-width: none;
        overscroll-behavior-x: contain;
}

.klf-lightbox__thumbs::-webkit-scrollbar {
        display: none;
}

.klf-lightbox__thumb {
        flex: 0 0 auto;
        width: 96px;
        height: 66px;
        padding: 0;
        border: 0;
        border-radius: 8px;
        overflow: hidden;
        opacity: 0.55;
        cursor: pointer;
        transition: opacity 0.2s ease, box-shadow 0.2s ease;
        background: rgba(255, 255, 255, 0.06);
        -webkit-tap-highlight-color: transparent;
}

.klf-lightbox__thumb img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
}

.klf-lightbox__thumb:hover {
        opacity: 0.9;
}

.klf-lightbox__thumb.is-active {
        opacity: 1;
        box-shadow: 0 0 0 2px #e3bc82;
}

.klf-lightbox__thumb:focus-visible {
        outline: 2px solid #e3bc82;
        outline-offset: 1px;
}

/* موبایل: فلش‌های لایت‌باکس کوچک‌تر و نزدیک‌تر + استیج بدون پدینگ فلش */
@media (max-width: 639px) {
        .klf-lightbox__stage {
                padding: 8px 10px;
        }

        .klf-lightbox__arrow {
                width: 36px;
                height: 36px;
                border-radius: 9px;
        }

        .klf-lightbox__arrow--prev {
                right: 8px;
        }

        .klf-lightbox__arrow--next {
                left: 8px;
        }

        .klf-lightbox__thumb {
                width: 78px;
                height: 54px;
        }
}
