/*
 * هدرِ موبایل و نوار پایین موبایل (HaghaniTheme 1.53.0). بارشده از hg_mbar_enqueue() بعد از hg-chrome.css.
 * کلاس‌های body از inc/theme-settings.php: hg-mbar-on · hg-mbar-has-{home|search|menu|cart|wishlist|account} · hg-subpage.
 * بریک‌پوینتِ ۹۹۲ عمداً همانِ هدرِ جدید و افزونهٔ مگامنو است (homepage-new-design-header.css).
 */

/* دکمهٔ برگشت فقط در موبایل/تبلت. */
#hnd-header .hg-back-btn { display: none; }

/* نوار در دسکتاپ نیست. */
.hg-mbar { display: none; }

@media (max-width: 992px) {

    /* ---------- دکمهٔ همبرگرِ تکراری: نوارِ منوی افزونه زیرِ ۹۹۲ فقط همبرگرِ خودش را نشان می‌دهد و همان کشوِ
       همبرگرِ هدر را باز می‌کند؛ ردیفِ داخلی پنهان می‌شود، خودِ کشو (.hnd-nav-drawer، هم‌سطحِ آن) می‌ماند. */
    #hnd-header .hnd-navrow > .hnd-nav-inner { display: none; }

    /* ---------- آیتم‌های هدرِ موبایل طبقِ تنظیمات (1.54.0، hg_mh_items): هرچه کلاسِ hg-mh-show-{کلید} ندارد پنهان.
       دکمهٔ پنهانِ هدر در DOM می‌ماند تا نوارِ پایین بتواند کلیک را به آن بدهد. */
    body.hg-mh-on:not(.hg-mh-show-menu) #hnd-header .hnd-burger-btn,
    body.hg-mh-on:not(.hg-mh-show-search) #hnd-header .hnd-mobile-search-btn,
    body.hg-mh-on:not(.hg-mh-show-cart) #hnd-header .hnd-slot-cart,
    body.hg-mh-on:not(.hg-mh-show-wishlist) #hnd-header .hnd-wishlist-btn,
    body.hg-mh-on:not(.hg-mh-show-account) #hnd-header .hnd-slot-account { display: none; }

    /* ---------- صفحه‌های غیرِ صفحهٔ اصلی: راست = برگشت + لوگو، چپ = منو و آیتم‌های باقی‌مانده.
       ⚠ ترتیبِ دیداری با order عوض می‌شود چون DOMِ هدر برای چیدمانِ دسکتاپ (جست‌وجو | لوگو | آیکن‌ها) است. */
    body.hg-subpage #hnd-header .hnd-topbar {
        display: flex;
        align-items: center;
        gap: 8px; /* همان فاصلهٔ بینِ آیکن‌ها (hg-chrome.css) */
    }
    body.hg-subpage #hnd-header .hnd-logo { order: -1; gap: 4px; }
    body.hg-subpage #hnd-header .hnd-topbar-end { margin-inline-start: auto; gap: 8px; }
    body.hg-subpage #hnd-header .hnd-logo img { height: 40px; }
    #hnd-header .hg-back-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        background: var(--c-bg-soft, #f7f2f4);
        border: 1px solid var(--c-line, #ece4e8);
        color: var(--c-ink, #2a2226);
        transition: background-color .2s ease, border-color .2s ease;
    }
    #hnd-header .hg-back-btn:hover,
    #hnd-header .hg-back-btn:focus-visible { background: var(--c-gold-soft, #f1dde6); border-color: var(--c-gold-soft, #f1dde6); }
    #hnd-header .hg-back-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

    /* ---------- نوار پایین */
    .hg-mbar {
        display: block;
        position: fixed;
        inset-inline: 0;
        inset-block-end: 0;
        z-index: 90;
        direction: rtl;
        background: var(--c-surface, #fff);
        border-block-start: 1px solid var(--c-line, #ece4e8);
        box-shadow: 0 -6px 20px rgba(42, 34, 38, .06);
        padding-block-end: env(safe-area-inset-bottom, 0);
        font-family: var(--font-body, inherit);
    }
    .hg-mbar__list { display: flex; margin: 0; padding: 0; list-style: none; }
    .hg-mbar__item { flex: 1 1 0; min-width: 0; }
    .hg-mbar__btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-height: 58px;
        padding: 6px 2px;
        color: var(--c-ink-soft, #5d5459);
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
    }
    .hg-mbar__btn:hover, .hg-mbar__btn:focus-visible { color: var(--c-gold-deep, #6f1242); }
    .hg-mbar__btn:focus-visible { outline: 2px solid var(--c-gold, #911a56); outline-offset: -4px; border-radius: 8px; }
    .hg-mbar__btn.is-active { color: var(--c-gold, #911a56); }
    .hg-mbar__icon { position: relative; display: inline-flex; }
    .hg-mbar__icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
    .hg-mbar__label { font-size: 11px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
    .hg-mbar__badge {
        position: absolute;
        inset-block-start: -6px;
        inset-inline-end: -9px;
        min-width: 17px;
        height: 17px;
        padding: 0 4px;
        border-radius: 999px;
        background: var(--c-gold, #911a56);
        color: #fff;
        font-size: 10px;
        line-height: 17px;
        text-align: center;
    }
    .hg-mbar__badge[hidden] { display: none; }

    /* جای نوار در انتهای صفحه، تا آخرین خطِ فوتر زیرش نماند. */
    body.hg-mbar-on { padding-block-end: calc(58px + env(safe-area-inset-bottom, 0px)); }
}
