/* ═══════════════════════════════════════════════════════════════════════════
   چسبِ قالبِ lebasino — فقط جایی که دادهٔ بک‌اند شکلی دارد که قالب برایش
   طرحی نداشت. بقیهٔ ظاهر از CSS ِ دست‌نخوردهٔ قالب می‌آید (_Styles.cshtml).
   هر قاعده زیرِ .lebasino-page یا با پیشوندِ .lb- است.
   ═══════════════════════════════════════════════════════════════════════════ */

/* لوگو: قالب SVG ِ درون‌خطیِ ۱۹۰×۴۴ داشت؛ لوگوی آپلودی هر اندازه‌ای دارد */
.lebasino-page .lb-logo img { display: block; max-height: 44px; width: auto; }
.lebasino-page .elementor-element-c550bec img { max-height: 44px; width: auto; }

/* اعلان‌های نوارِ بالا (جای «شانست رو امتحان کن!») */
.lebasino-page .lb-ann-item[hidden] { display: none; }

/* مگامنو: تیترِ گروه‌ها در قالب span بود؛ اینجا پیوند است و رنگِ تیتر را نگه می‌دارد */
.lebasino-page .mega-menu .elementor-icon-box-title a { color: inherit; }
.lebasino-page .mega-menu .elementor-icon-box-title a:hover { color: var(--lebasino-primary-color); }
/* منوی دوسطحی (elementor-3073): تیتر فقط در ستونِ اول؛ بقیهٔ ستون‌ها جای خالیِ هم‌قد دارند تا فهرست‌ها هم‌تراز بمانند */
.lebasino-page .mega-menu .lb-mm-spacer { visibility: hidden; }
/* مگامنوی چهارسطحی (elementor-222): widget-nested-tabs تا JS ِ المنتور ‎.e-activated‎ نگذارد پنلِ اول را
   به‌زور نشان می‌دهد؛ اینجا آن init اجرا نمی‌شود و فقط ‎e-active‎ جابه‌جا می‌شود ⇒ پنلِ اول می‌ماند و پنلِ
   تازه کنارش بیرونِ کادر می‌افتاد. فقط پنلِ e-active (سرور اولی را e-active رندر می‌کند). */
.lebasino-page .mega-menu .elementor-widget-n-tabs .e-n-tabs .e-n-tabs-content > .e-con:not(.e-active) { display: none; }
.lebasino-page .mega-menu .elementor-widget-n-tabs .e-n-tabs .e-n-tabs-content > .e-con.e-active { display: flex; }
/* ستون‌ها در قالب با محتوای پهنِ خودِ دمو تمام‌عرض می‌شدند؛ با چند آیتمِ کوتاه به عرضِ تیتر جمع می‌شدند و تیتر می‌شکست */
.lebasino-page .elementor-3073 .elementor-element-25076217 > .e-con { flex: 1 1 0; min-width: 0; }
.lebasino-page .elementor-3073 .elementor-icon-box-title { white-space: nowrap; }
/* style.css «li:hover a { color: … !important }» هر پیوندِ زیرِ آیتمِ hover را قرمز می‌کند؛ در قالب
   تیترِ مگامنو span است و نمی‌گیرد، اینجا پیوند است — پس همان !important لازم است. تیترِ قالب سرمه‌ای است. */
.lebasino-page .main-navigation .mega-menu .elementor-icon-box-title a { color: #242B3D !important; }
.lebasino-page .main-navigation .mega-menu .elementor-icon-box-title a:hover { color: var(--lebasino-primary-color) !important; }

/* علاقه‌مندی: favorites.js کلاسِ is-fav را می‌گذارد؛ قالب قلبِ fal (نازک) دارد */
.lebasino-page .lebasino-wishlist-btn.is-fav i { font-weight: 900; color: var(--lebasino-primary-color); }

/* «تماس بگیرید» / «به زودی» / «ناموجود» جای قیمت */
.lebasino-page .lb-price-note { color: var(--lebasino-text-color); font-size: 14px; }

/* پیشنهادِ زندهٔ جستجو: قالب جعبه را با ای‌جکسِ خودش باز می‌کرد */
.lebasino-page .ajax-search-result:empty { display: none; }
.lebasino-page .lb-search-empty { padding: 12px 16px; color: var(--lebasino-text-color); }
/* استایلِ جعبه در خروجیِ HTML ِ قالب نبود (در CSS ِ افزونهٔ وردپرس بود) ⇒ جعبه static و بی‌پس‌زمینه
   وسطِ هدر باز می‌شد و هدر را ۲۰۰۰px پایین می‌برد. اینجا: کشوی شناور زیرِ فیلد. */
.lebasino-page .site-search .widget_product_search { position: relative; }
.lebasino-page .site-search .ajax-search-result {
    position: absolute; top: calc(100% + 6px); right: 0; left: 0; z-index: 1000;
    max-height: min(420px, 70vh); overflow-y: auto; padding: 6px 0;
    background: #fff; border: 1px solid rgba(36, 43, 61, .1); border-radius: 8px;
    box-shadow: 0 8px 24px rgba(36, 43, 61, .12); text-align: right;
}
.lebasino-page .ajax-search-result .product-link { display: flex; align-items: center; gap: 12px; padding: 8px 14px; color: var(--lebasino-text-color); }
.lebasino-page .ajax-search-result .product-link:hover { background: #f6f6f8; }
.lebasino-page .ajax-search-result .product-link img { flex: 0 0 48px; width: 48px; height: 48px; object-fit: cover; border-radius: 6px; background: #f3f3f5; font-size: 0; }
.lebasino-page .ajax-search-result .product-content { min-width: 0; }
.lebasino-page .ajax-search-result .product-title {
    margin: 0; font-size: 14px; font-weight: 500; line-height: 1.6; color: #242B3D;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.lebasino-page .ajax-search-result .price { display: block; font-size: 12px; color: var(--lebasino-primary-color); }

/* هدرِ تبلت (۷۶۸–۱۰۲۴): قالب هم‌مارکاپِ موبایل را می‌گذاشت — ستونِ ۱۶٪ با همبرگر/لوگو/حساب/سبد
   روی هم، و کنارش گروهِ کاملِ علاقه‌مندی/حساب/سبد که در ۲۸۲px جا نمی‌شد و ۱۲۲px از صفحه بیرون
   می‌زد (اسکرولِ افقی؛ در خودِ قالب هم هست). اینجا یک ردیف: همبرگر+لوگو · جستجو · آیکن‌ها. */
@media (min-width: 768px) and (max-width: 1024px) {
    .lebasino-page .elementor-1771 .elementor-element-bdc9288 { --flex-direction: row; --width: auto; --gap: 16px; --align-items: center; }
    .lebasino-page .elementor-1771 .elementor-element-551d911 { display: none; }
    .lebasino-page .elementor-1771 .elementor-element-ca2728b { --width: auto; flex: 1 1 auto; min-width: 0; }
    .lebasino-page .elementor-1771 .elementor-element-0eadcd7 { --width: auto; flex: 0 0 auto; }
    .lebasino-page .elementor-1771 .elementor-element-b600eb8 .site-header-wishlist .label,
    .lebasino-page .elementor-1771 .elementor-element-b600eb8 .site-header-account .label { display: none; }
}
/* نوارِ منوی دسکتاپ زیرِ ۱۰۲۴: style.css زیرمنوها را فقط در (min-width: 1024px) absolute و پنهان
   می‌کند ⇒ در ۷۶۸–۱۰۲۳ همهٔ مگامنوها باز و static زیرِ هم می‌ریختند (نوار ۱۱۵۶px). اینجا همبرگر
   هست و کشوی موبایل همان منو را دارد؛ نوار فقط در دسکتاپ. */
@media (max-width: 1023px) {
    .lebasino-page .elementor-1771 .elementor-element-22d3f61 { display: none; }
}
/* ردیفِ دسکتاپ (۱۰۲۵–~۱۲۰۰): لوگو ۱۵٪ و جستجو ۴۹٪ هر دو flex-shrink: 0 بودند ⇒ گروهِ
   علاقه‌مندی/حساب/سبد جا نمی‌شد و سبد ۵۵px از صفحه بیرون می‌زد. جستجو جمع می‌شود، نه آیکن‌ها. */
@media (min-width: 1025px) {
    .lebasino-page .elementor-1771 .elementor-element-fee2889.e-con { --flex-shrink: 1; min-width: 0; }
    .lebasino-page .elementor-1771 .elementor-element-b0d7bad { --width: auto; flex: 0 0 auto; }
}

/* مودالِ استوری: iframe ِ آپارات/یوتیوب جای <video> ِ قالب */
.lebasino-page .story-modal .lb-story-frame { width: 100%; height: 100%; border: 0; display: block; }
.lebasino-page .story-modal .lb-story-link {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 8px;
    background: var(--lebasino-primary-color);
    color: #fff;
}

/* فوتر: پس‌زمینه footer-bg.svg (۱۴۴۰×۵۸۰) با background-size: contain است، پس
   شکلِ تیره از ارتفاعِ کادر پیروی می‌کند. ارتفاعِ فوترِ قالب را محتوا می‌سازد
   — نوارِ اپلیکیشن ۸۰px و ستونِ وسط با دو کادرِ آمار ۳۹۴px — و در هر عرضی
   از ۱۴۴۰ به بالا ۵۸۶px است. آن دو بخش اینجا حذف شده‌اند، پس جایشان با همان
   ارتفاع نگه داشته می‌شود؛ وگرنه کادر کوتاه‌تر و شکلِ تیره باریک‌تر می‌شد.
   (aspect-ratio اشتباه بود: در صفحهٔ پهن کادر را بلندتر از قالب می‌کرد.) */
@media (min-width: 1025px) {
    .lebasino-page .elementor-1774 .elementor-element-c9eee05 { min-height: 80px; }
    .lebasino-page .elementor-1774 .elementor-element-6782edc { min-height: 394px; }
}

/* سایتِ بی‌لوگو: نامِ سایت به‌جای SVGِ «LEBASINO» ِ قالب — همان حس با فونتِ قالب */
.lebasino-page .lb-logo-text {
    display: inline-block;
    font: 700 26px/44px var(--lebasino-main-font), sans-serif;
    color: var(--lebasino-text-color);
    white-space: nowrap;
}
.lebasino-page .lb-logo-text--light { color: #fff; }

/* فوترِ دسکتاپ: در قالب نمادها زیرِ دو کادرِ آمار و هم‌ترازِ پایینِ ستون‌اند؛
   کادرهای آمار (عددِ ساختگی) حذف شدند، پس نمادها به پایینِ همان ستون می‌روند. */
@media (min-width: 1025px) {
    .lebasino-page .elementor-1774 .elementor-element-2154252 { margin-top: auto; }
}

/* لوگوی فوتر: قالب به img هم width:100% و هم height:42px داده (post-1774)، پس
   لوگوی مربع یا عمودیِ مشتری کش می‌آمد و در موبایل width:40% آن را غول می‌کرد.
   ارتفاعِ ثابت + عرضِ خودکار نسبتِ هر لوگویی را نگه می‌دارد. */
.lebasino-page .elementor-1774 .elementor-element-c127d85 img {
    width: auto;
    height: 56px;
    max-width: 100%;
    object-fit: contain;
}
.lebasino-page .elementor-1774 .elementor-element-7823210 img {
    width: auto;
    height: 64px;
    max-width: 60%;
    object-fit: contain;
}

/* فوترِ تبلت (۷۶۸ تا ۱۰۲۴): قالب برای این بازه هیچ قاعده‌ای ندارد، پس ستون‌های
   ۴۵/۲۰/۲۰/۲۰ٔ دسکتاپ در عرضِ کم له می‌شدند و متن از شکلِ تیرهٔ footer-bg.svg
   (contain، ارتفاعش تابعِ عرض) بیرون می‌ریخت — آدرس و تلفن سفید روی سفید.
   اینجا مثلِ موبایل چیده می‌شود: معرفی تمام‌عرض، دو منو کنارِ هم، و کادرِ تیره
   رنگِ ساده با گوشهٔ گرد به‌جای SVG تا با ارتفاعِ محتوا بزرگ شود. */
@media (min-width: 768px) and (max-width: 1024px) {
    /* همان :not ِ post-1774 لازم است، وگرنه specificity ِ آن برنده می‌شود */
    .lebasino-page .elementor-1774 .elementor-element.elementor-element-c2c4e5b:not(.elementor-motion-effects-element-type-background) { background-image: none; }
    .lebasino-page .elementor-1774 .elementor-element-c2c4e5b { --padding-left: 16px; --padding-right: 16px; }
    .lebasino-page .elementor-1774 .elementor-element-8a9a3a2 {
        --flex-wrap: wrap;
        --gap: 0px 0px;
        --row-gap: 0px;
        --column-gap: 0px;
        background-color: #242B3D;
        border-radius: 16px;
        padding: 24px 8px;
    }
    .lebasino-page .elementor-1774 .elementor-element-73c5ac3,
    .lebasino-page .elementor-1774 .elementor-element-6782edc { --width: 100%; }
    .lebasino-page .elementor-1774 .elementor-element-313bdce,
    .lebasino-page .elementor-1774 .elementor-element-241afe6 { --width: 50%; }
    .lebasino-page .elementor-1774 .elementor-element-7823210 { text-align: start; }
}

/* ═══ صفحهٔ کالا — فقط چیزهایی که قالب طرحی برایشان نداشت ═══════════════════ */
.lebasino-page .lb-admin-edit { display: inline-flex; gap: 6px; align-items: center; margin: 4px 0 8px; font-size: 13px; color: var(--lebasino-primary-color); }
.lebasino-page .lb-name-en { margin: 0 0 10px; color: #8a8f9c; font-size: 14px; }
.lebasino-page .lb-summary { margin-top: 16px; font-size: 14px; line-height: 1.9; color: var(--lebasino-text-color); }
.lebasino-page .lebasino-compare .compare-btn { background: none; border: 0; padding: 0; color: inherit; cursor: pointer; }
.lebasino-page .lb-selected-name { font-weight: 500; margin-inline-start: 6px; color: var(--lebasino-primary-color); }
.lebasino-page .lb-price-note { margin: 0 0 12px; font-weight: 700; }
.lebasino-page .lb-price-note--out { color: var(--lebasino-error-color); }
/* تنوعِ ناممکن (disabled) و تمام‌شده (out-of-stock) — کلاس‌های اسکریپتِ صفحه */
.lebasino-page .swatch-btn:disabled { opacity: .3; cursor: not-allowed; }
.lebasino-page .swatch-btn.out-of-stock { opacity: .55; position: relative; }
.lebasino-page .swatch-btn.out-of-stock::before {
    content: ""; position: absolute; inset: 50% 2px auto; height: 1px;
    background: currentColor; transform: rotate(-20deg);
}
.lebasino-page .single_add_to_cart_button:disabled { background-color: #b9bcc4 !important; border-color: #b9bcc4 !important; cursor: not-allowed; }

/* ستونِ وسط: قالب space-between دارد چون فقط «عنوان» و «ویژگی‌ها» را داشت؛ نامِ
   انگلیسی سومین فرزند است و وسطِ جای خالی معلق می‌ماند. عنوان و نام بالا، ویژگی‌ها پایین. */
.lebasino-page .summary.entry-summary { justify-content: flex-start; }
.lebasino-page .summary.entry-summary .product-params-special { margin-top: auto; }

/* جعبهٔ دیدگاه/علاقه‌مندی/مقایسه: ۰٫۳ ِ قالب کنارِ کارت‌های سفید تیره و کم‌کنتراست است */
.lebasino-page .lebasino-rating-col { background: rgba(var(--border-color-rgb), .06); }
.lebasino-page .lebasino-rating-col .rating-item { white-space: nowrap; }

/* کارتِ خرید ۳۰۰px است و قالب برچسبِ تنوع را در ستونِ ۱fr کنارِ سایزها می‌گذارد:
   سایزها در ۱۸۵px می‌شکنند و نامِ سایزِ انتخاب‌شده زیرِ برچسب می‌افتد. برچسب بالا، سایزها تمام‌عرض. */
.lebasino-page .product-add-to-cart-section .variation-row { grid-template-columns: 1fr; }

/* دکمهٔ سبد کنارِ شمارنده جا نمی‌شد و دوخطی می‌شد؛ حالا یک‌خطی، و اگر جا نشد به ردیفِ بعد با تمام‌عرض */
.lebasino-page .variations_button { flex-wrap: wrap; gap: 8px; }
.lebasino-page .variations_button .single_add_to_cart_button { flex: 1 1 150px; white-space: nowrap; justify-content: center; }


/* شمارشِ معکوسِ پیشنهاد — همان جعبه‌های lebasino-countdown ِ قالب، روی زمینهٔ روشن */
.lebasino-page .lb-offer-timer { margin: 4px 0 16px; }
.lebasino-page .lb-offer-label { display: block; margin-bottom: 8px; font-size: 13px; color: var(--lebasino-primary-color); }
.lebasino-page .lb-offer-timer .elementor-lebasino-countdown { display: flex; gap: 8px; }
.lebasino-page .lb-offer-timer .elementor-countdown-item {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 8px; background: rgba(var(--lebasino-primary-color-rgb), .08);
}
.lebasino-page .lb-offer-timer .elementor-countdown-digits { font-weight: 700; font-size: 14px; color: var(--lebasino-primary-color); }
.lebasino-page .lb-offer-timer .elementor-countdown-label { font-size: 10px; color: var(--lebasino-text-color); }

/* «موجود شد خبرم کن»، «سوالی دارید؟»، برچسب‌ها */
.lebasino-page .lb-notify, .lebasino-page .lb-ask { margin-top: 16px; padding: 16px; border-radius: 16px; background: #f7f7f9; }
.lebasino-page .lb-notify-title { margin: 0 0 4px; font-weight: 700; }
.lebasino-page .lb-notify-text, .lebasino-page .lb-ask-hint, .lebasino-page .lb-form-hint { margin: 0 0 10px; font-size: 13px; color: #8a8f9c; }
.lebasino-page .lb-notify-form, .lebasino-page .lb-ask-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.lebasino-page .lb-notify-form .form-control { flex: 1 1 160px; }
.lebasino-page .lb-ask-form textarea { flex: 1 1 100%; }
.lebasino-page .lb-notify-msg, .lebasino-page .lb-form-msg { margin-top: 8px; font-size: 13px; }
.lebasino-page .lb-notify-msg.ok, .lebasino-page .lb-form-msg.ok { color: var(--lebasino-success-color); }
.lebasino-page .lb-notify-msg.err, .lebasino-page .lb-form-msg.err { color: var(--lebasino-error-color); }
.lebasino-page .lb-faq-by { margin: 4px 0 0; font-size: 12px; color: #8a8f9c; }
.lebasino-page .lb-tags { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 24px 0; }
.lebasino-page .lb-tag { padding: 4px 12px; border-radius: 30px; background: rgba(var(--lebasino-primary-color-rgb), .08); color: var(--lebasino-primary-color); font-size: 13px; }
.lebasino-page .lb-recent { margin: 40px 0; }

/* دیدگاه‌ها: آواتارِ پیش‌فرض (کاربر تصویرِ پروفایل ندارد) و «در پاسخ به» */
.lebasino-page .lb-avatar {
    display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%;
    background: #eceef2; color: #9aa0ad; font-size: 24px;
}
.lebasino-page .lb-replying { display: flex; gap: 8px; align-items: center; margin-bottom: 12px; font-size: 13px; }
.lebasino-page .lb-cancel-reply { border: 0; background: none; color: var(--lebasino-primary-color); cursor: pointer; }

/* لایت‌باکسِ گالری */
.lebasino-page .lb-lightbox {
    position: fixed; inset: 0; z-index: 100000; display: none; align-items: center; justify-content: center;
    background: rgba(15, 18, 28, .92);
}
.lebasino-page .lb-lightbox.open { display: flex; }
.lebasino-page .lb-lightbox img { max-width: 92vw; max-height: 88vh; border-radius: 12px; }
.lebasino-page .lb-lightbox .lb-close,
.lebasino-page .lb-lightbox .lb-nav {
    position: absolute; border: 0; background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer;
    width: 48px; height: 48px; border-radius: 50%; font-size: 28px; line-height: 1;
}
.lebasino-page .lb-lightbox .lb-close { top: 20px; left: 20px; }
.lebasino-page .lb-lightbox .lb-prev { right: 20px; top: 50%; transform: translateY(-50%); }
.lebasino-page .lb-lightbox .lb-next { left: 20px; top: 50%; transform: translateY(-50%); }
.lebasino-page .lb-lightbox .lb-counter { position: absolute; bottom: 20px; color: #fff; font-size: 14px; }
/* دکمه‌های ثانویهٔ صفحهٔ کالا («ثبت درخواست»، «ثبت سوال») — رنگِ قالب، نه بنفشِ
   پیش‌فرضِ ووکامرس (.button.alt). کلاسِ single_add_to_cart_button عمداً نیست:
   theme.js رویش ای‌جکسِ سبد می‌زند. */
.lebasino-page .lb-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    padding: 10px 20px; border: 0; border-radius: 8px; cursor: pointer;
    background: var(--lebasino-primary-color); color: #fff; font: inherit; font-size: 14px;
}
.lebasino-page .lb-btn:hover { background: var(--lebasino-primary-dark); color: #fff; }
.lebasino-page .lb-btn:disabled { opacity: .6; cursor: default; }

/* post-62.css (صفحهٔ اصلیِ المنتور) روی :root عنوانِ صفحه را پنهان می‌کند
   (--page-title-display: none) و قالب آن را فقط در صفحهٔ اصلی لود می‌کند. اینجا
   همه‌جا لود می‌شود چون بخش‌های «کالاهای مشابه» همان استایل را لازم دارند؛
   بی‌این، h1.entry-title ِ صفحهٔ کالا و مقاله ناپدید می‌شد. */
body.lebasino-page:not(.home) { --page-title-display: block; }

/* ═══ وبلاگ ═══════════════════════════════════════════════════════════════ */
.lebasino-page .lb-blog-count { margin: 6px 0 0; font-size: 13px; color: #8a8f9c; }
.lebasino-page .lb-blog-tag-text { margin-top: 8px; font-size: 14px; line-height: 1.9; }
.lebasino-page .lb-empty { padding: 60px 20px; text-align: center; color: #8a8f9c; }
.lebasino-page .lb-post-audio, .lebasino-page .lb-post-pdf { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px 16px; border-radius: 12px; background: #f7f7f9; }
.lebasino-page .lb-post-audio audio { width: 100%; }

/* ==================================
   FAQ Accordion | Zaria Theme
   Primary: #c72444
================================== */

.lb-post-faq {
    --faq-primary: #c72444;
    --faq-primary-dark: #a51d39;
    --faq-soft: #fff5f7;
    --faq-border: #ece4e6;
    --faq-text: #34343a;
    --faq-muted: #65656e;

    direction: rtl;
    width: 100%;
    margin: 2.5rem 0;
    padding: 1.5rem;
    background: #fff;
    border: 1px solid var(--faq-border);
    border-radius: 16px;
    box-shadow: 0 5px 22px rgba(45, 20, 28, 0.045);
    font-family: inherit;
}

/* Section heading */
.lb-post-faq .lb-post-faq-title {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0 0 1.4rem;
    padding: 0 0 1rem;
    color: var(--faq-text);
    font-family: inherit;
    font-size: clamp(1.25rem, 2.5vw, 1.55rem);
    font-weight: 800;
    line-height: 1.8;
    border-bottom: 1px solid var(--faq-border);
}

.lb-post-faq .lb-post-faq-title::before {
    content: "";
    flex: 0 0 4px;
    align-self: stretch;
    min-height: 1.5rem;
    background: var(--faq-primary);
    border-radius: 5px;
}

/* Individual FAQ item */
.lb-post-faq .lb-faq-item {
    margin: 0 0 0.75rem;
    padding: 0;
    background: #fff;
    border: 1px solid var(--faq-border);
    border-radius: 11px;
    overflow: hidden;
    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}

.lb-post-faq .lb-faq-item:last-child {
    margin-bottom: 0;
}

/* Question */
.lb-post-faq .lb-faq-item summary {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 60px;
    padding: 1rem 1.1rem 1rem 3.2rem;
    color: var(--faq-text);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.9;
    list-style: none;
    cursor: pointer;
    transition:
        color 0.2s ease,
        background-color 0.2s ease;
}

/* Hide default browser marker */
.lb-post-faq .lb-faq-item summary::-webkit-details-marker {
    display: none;
}

.lb-post-faq .lb-faq-item summary::marker {
    content: "";
}

/* Plus / minus indicator */
.lb-post-faq .lb-faq-item summary::after {
    content: "+";
    position: absolute;
    left: 1rem;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    transform: translateY(-50%);
    color: var(--faq-primary);
    background: var(--faq-soft);
    border: 1px solid #f1d6dd;
    border-radius: 8px;
    font-family: Arial, sans-serif;
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1;
    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        transform 0.2s ease;
}

/* Open state */
.lb-post-faq .lb-faq-item[open] {
    border-color: #e5a4b1;
    background: var(--faq-soft);
    box-shadow: 0 3px 12px rgba(199, 36, 68, 0.055);
}

.lb-post-faq .lb-faq-item[open] summary {
    color: var(--faq-primary-dark);
    background: var(--faq-soft);
}

.lb-post-faq .lb-faq-item[open] summary::after {
    content: "\2212";
}

/* Hover and keyboard accessibility */
.lb-post-faq .lb-faq-item summary:hover {
    color: var(--faq-primary);
    background-color: #fff9fa;
}

.lb-post-faq .lb-faq-item summary:focus-visible {
    outline: 2px solid var(--faq-primary);
    outline-offset: -3px;
    border-radius: 8px;
}

/* Answer */
.lb-post-faq .lb-faq-answer {
    padding: 0.2rem 1.1rem 1.15rem;
    color: var(--faq-muted);
    font-family: inherit;
    font-size: 0.96rem;
    font-weight: 400;
    line-height: 2.15;
    text-align: right;
    overflow-wrap: anywhere;
    animation: faq-answer-in 0.22s ease both;
}

@keyframes faq-answer-in {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile */
@media (max-width: 576px) {
    .lb-post-faq {
        margin: 1.75rem 0;
        padding: 1rem;
        border-radius: 12px;
    }

    .lb-post-faq .lb-post-faq-title {
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
    }

    .lb-post-faq .lb-faq-item {
        margin-bottom: 0.65rem;
        border-radius: 9px;
    }

    .lb-post-faq .lb-faq-item summary {
        min-height: 54px;
        padding: 0.85rem 0.85rem 0.85rem 2.9rem;
        font-size: 0.94rem;
        line-height: 1.9;
    }

    .lb-post-faq .lb-faq-item summary::after {
        left: 0.75rem;
        width: 26px;
        height: 26px;
        font-size: 1.2rem;
    }

    .lb-post-faq .lb-faq-answer {
        padding: 0.15rem 0.85rem 1rem;
        font-size: 0.9rem;
        line-height: 2;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .lb-post-faq *,
    .lb-post-faq *::before,
    .lb-post-faq *::after {
        animation: none !important;
        transition: none !important;
    }
}

.lebasino-page .comment-vote.voted { color: var(--lebasino-primary-color); }

/* ═══ فروشگاه ═════════════════════════════════════════════════════════════ */
/* درختِ دسته‌ها (ابزارکِ دسته‌های وبلاگِ قالب): زیرشاخه‌ها تو رفته، شاخهٔ فعال پررنگ */
.lebasino-page .lb-shop-cats .children { margin: 10px 0 0; padding-inline-start: 14px; border-inline-start: 1px solid rgba(var(--lebasino-text-color-rgb), .1); }
.lebasino-page .lb-shop-cats .cat-item.current-cat > a .category-name { color: var(--lebasino-primary-color); font-weight: 700; }
.lebasino-page .lb-shop-count { margin: 4px 0 0; font-size: 13px; color: #8a8f9c; }
/* فیلترِ برند radio است (یک برند در کوئری)؛ advanced-filter.css فقط checkbox ِ .filter-item را پنهان
   می‌کند، پس دایرهٔ خامِ مرورگر کنارِ checkmark ِ قالب می‌ماند. همان قاعده برای radio: */
.lebasino-page .filter-item input[type="radio"] { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
.lebasino-page .lb-filter-count { margin-inline-start: auto; font-size: 12px; color: #8a8f9c; }
.lebasino-page .lb-clear-filters { width: 100%; margin-top: 12px; }
.lebasino-page .lb-cm { display: grid; gap: 6px; margin-top: 14px; font-size: 13px; }
.lebasino-page .lb-cm input { padding: 8px 12px; border: 1px solid rgba(var(--lebasino-text-color-rgb), .2); border-radius: 8px; }
.lebasino-page .lb-cm small { color: #8a8f9c; }
.lebasino-page .lb-cm .lb-cm-empty { color: var(--lebasino-error-color); }
.lebasino-page .lb-shop-seo, .lebasino-page .lb-shop-faq { margin-top: 32px; line-height: 1.9; }
/* همان قواعدِ .blog-sidebar .widget_categories ِ style.css، برای درختِ دستهٔ فروشگاه */
.lebasino-page .lb-shop-cats ul { list-style: none; padding: 0; margin: 0; }
.lebasino-page .lb-shop-cats li { margin-bottom: .75rem; padding: 0; }
.lebasino-page .lb-shop-cats li:last-child { margin-bottom: 0; }
.lebasino-page .lb-shop-cats a { display: flex; justify-content: space-between; align-items: center; color: rgba(var(--text-color-rgb), .8); text-decoration: none; border-radius: 8px; transition: all .3s ease; }
.lebasino-page .lb-shop-cats a:hover { color: var(--primary-color, #c83b3b); }
.lebasino-page .lb-shop-cats a .category-name { flex: 1; }
.lebasino-page .lb-shop-cats a .count { background: rgba(var(--text-color-rgb), .1); color: var(--text-color); border-radius: 8px; font-size: 16px; font-weight: 500; transition: all .3s ease; min-width: 24px; min-height: 24px; text-align: center; }
.lebasino-page .lb-shop-cats a:hover .count { background: var(--primary-color, #c83b3b); color: #fff; }

/* ═══ استایل پیشنهادی (lb-style-guide.js) — فقط چیزهایی که ویجتِ قالب نداشت ═══════════ */
/* پله‌های تخفیف: قالب یک «تا ۲۵٪» ِ ثابت داشت؛ اینجا هر پله یک چیپ و پلهٔ فعلی پررنگ */
.lebasino-page .lb-sg-tiers { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 4px 0 8px; }
.lebasino-page .lb-sg-tiers span { padding: 3px 10px; border-radius: 30px; font-size: 12px; color: #8a8f9c; background: #f4f5f7; }
.lebasino-page .lb-sg-tiers span.active { color: #fff; background: var(--lebasino-primary-color); }
.lebasino-page .lb-sg-discount-row[hidden] { display: none; }
.lebasino-page .lb-sg-discount-row { margin-top: -10px; }
.lebasino-page .lb-sg-discount-row .total-label, .lebasino-page .lb-sg-discount { color: var(--lebasino-primary-color); font-size: 15px; }
.lebasino-page .lb-sg-note { margin: 0 0 12px; font-size: 13px; color: #8a8f9c; min-height: 1em; }
/* total-label ِ قالب قرمزِ ۱۰٪ است (عملاً نامرئی) — «مجموع قیمت» باید خوانا باشد */
.lebasino-page .style-guide-widget .quick-shop-total .total-label { color: var(--lebasino-text-color); }
.lebasino-page .style-guide-widget .size-option.lb-sg-off { opacity: .35; cursor: not-allowed; }
.lebasino-page .style-guide-widget .lb-sg-na { color: var(--lebasino-error-color); font-size: 13px; }
.lebasino-page .style-guide-widget .quick-shop-add-all-btn:disabled { opacity: .5; cursor: default; }
.lebasino-page .style-guide-widget + .style-guide-widget { margin-top: 60px; }
/* موبایل: قالب رنگ/سایز را آکاردئونی پنهان می‌کند — لمسِ ردیف (‎.active‎) بازش می‌کند */
/* موبایل: قالب ردیف را با style-guide.js به «سرتیتر + محتوا» بازسازی می‌کرد و تیک را absolute
   می‌گذاشت؛ بی آن JS، تیک روی قیمت می‌افتاد و عکسِ ۱۵۰px تمام‌عرض می‌شد. اینجا: یک ردیفِ
   تیک · نام · قیمت، و رنگ/سایز آکاردئونی — لمسِ ردیف (‎.active‎) بازش می‌کند. */
@media (max-width: 768px) {
    .lebasino-page .style-guide-widget .quick-shop-product-item .product-image { display: none !important; }
    .lebasino-page .style-guide-widget .quick-shop-product-item .product-main-info { display: flex; align-items: center; gap: 10px; padding: 14px; margin: 0; cursor: pointer; }
    .lebasino-page .style-guide-widget .quick-shop-product-item .quick-shop-toggle-icon { position: relative; left: auto; bottom: auto; flex: none; }
    /* قالب در موبایل تیک را با ‎.active‎ (آکاردئونِ باز) سبز می‌کرد، نه با «در سبد» — تیک باید انتخاب را نشان دهد */
    .lebasino-page .style-guide-widget .quick-shop-product-item.active .quick-shop-toggle-icon { background: #fff; }
    .lebasino-page .style-guide-widget .quick-shop-product-item.selected-for-cart .quick-shop-toggle-icon { background: #09AE87; border-color: #09AE87; }
    .lebasino-page .style-guide-widget .quick-shop-product-item.selected-for-cart .quick-shop-toggle-icon::after {
        content: '\f00c'; font-family: "Font Awesome 6 Pro"; font-weight: 400; position: absolute; left: 50%; top: 50%;
        transform: translate(-50%, -50%); color: #fff; font-size: 12px;
    }
    .lebasino-page .style-guide-widget .quick-shop-product-item .product-name { flex: 1 1 auto; min-width: 0; white-space: normal; font-size: 14px; }
    .lebasino-page .style-guide-widget .quick-shop-product-item .product-price { flex: none; white-space: nowrap; font-size: 13px; }
    .lebasino-page .style-guide-widget .quick-shop-product-item .product-variations { display: none; padding: 0 14px 14px; }
    .lebasino-page .style-guide-widget .quick-shop-product-item.active .product-variations { display: flex; }
}

/* بنرِ JPG (کلِ بنرِ طراحی‌شده، نه PNG ِ دوربری‌شدهٔ کارتِ قالب) — BannerZones/Default.cshtml */
.lebasino-page .lb-bz-full { display: block; flex: 1 1 0; min-width: 0; border-radius: 24px; overflow: hidden; }
.lebasino-page .lb-bz-full img { display: block; width: 100%; height: auto; }
@media (max-width: 767px) {
    .lebasino-page .lb-bz-full { flex: 0 0 100%; }
}