/*
 * هدر و فوترِ طراحی جدید روی صفحه‌های عادی (HaghaniTheme 1.51.0). بارشده از hg_chrome_enqueue().
 * در قالب «صفحه اصلی جدید» این هدر/فوتر سه چیز را از جای دیگر می‌گیرند که روی بقیهٔ صفحه‌ها نیست:
 * (۱) قواعدِ body.hnd-front-page در homepage-new-design-base.css، (۲) دو قاعدهٔ هدر/فوتر که در
 * homepage-new-design-front.css (استایلِ خودِ صفحهٔ اصلی) نشسته‌اند، (۳) نبودنِ بوت‌استرپ. همین سه این‌جا جبران
 * می‌شوند، فقط زیرِ #hnd-header و #hnd-footer. سنجش: مقایسهٔ استایلِ محاسبه‌شدهٔ ۱۷۰ عنصر با صفحهٔ مرجع.
 */

/* (۱) معادلِ body.hnd-front-page — رنگِ متن (فوتر رنگِ سفیدِ خودش را دارد)، تصویرِ block، فونتِ دکمه از والد. */
#hnd-header {
    color: var(--c-ink);
}
#hnd-header img,
#hnd-footer img {
    max-width: 100%;
    display: block;
}
#hnd-header button,
#hnd-footer button {
    font-family: inherit;
}

/* (۱٫۵) 1.51.2: استایلِ سه قالبِ صفحه (front-page.css = صفحهٔ اصلیِ زنده، redesigned-front.css، low-paying-cat.css)
   روی تگِ خامِ footer «display:flex; justify-content:center» دارد که برای فوترِ قدیمی نوشته شده بود؛ روی فوترِ
   جدید همهٔ بخش‌ها را کنارِ هم در ستون‌های باریک می‌چپاند. شناسه بر تگ می‌برد، پس یک‌جا برای همه خنثی می‌شود. */
#hnd-footer {
    display: block;
    justify-content: normal;
    /* 1.56.0: فوتر لایهٔ خودش را دارد (isolation + z-index:0). کلِ محتوای صفحه در ظرفِ
       #theme-main > .container-fluid.z-1 (header.php) در لایهٔ ۱ است، پس نوارهای چسبانِ داخلش (دکمهٔ «افزودن به
       سبد» با z-index:99999) هم در عمل لایهٔ ۱‌اند؛ پیوندهای فوتر با z-index:2 و بی‌لایه رویشان می‌آمدند. */
    position: relative;
    z-index: 0;
    isolation: isolate;
}

/* (۱٫۶) 1.53.1: اندازهٔ یکسانِ آیکن‌های هدر در موبایل و دسکتاپ. پیش از این هر آیکن اندازهٔ خودش را داشت
   (منو ۲۴، جست‌وجو و علاقه‌مندی ۲۰ در قابِ ۳۴، ورود ۲۲ در قابِ ۴۲، سبد ۲۷ بی‌قاب). حالا همه قابِ ۴۰ و آیکنِ ۲۲؛
   وقتی هدر هنگامِ اسکرول جمع می‌شود، همه با هم ۳۶ و ۲۰. دکمه‌های ورود و سبد از افزونه‌اند و فقط اندازه‌شان این‌جا
   تعیین می‌شود.
   ⚠ 1.55.2: فقط دکمهٔ خودِ هدر، نه هرچه داخلِ فهرستِ کشویی است (:not(li *)). منوی کشوییِ حساب در افزونهٔ dm-login
   پیوندها و دکمهٔ «بستن» را داخلِ همین جایگاه و در <li> دارد؛ قاعدهٔ 1.53.1 هر کدام را در قابِ ۴۰×۴۰ می‌چپاند
   و متنِ گزینه‌ها می‌شکست. */
#hnd-header .hnd-topbar .hnd-icon-btn,
#hnd-header .hnd-topbar .hnd-burger-btn,
#hnd-header .hnd-topbar .hg-back-btn,
#hnd-header .hnd-slot-account :is(button, a):not(li *),
#hnd-header .hnd-slot-cart :is(button, a):not(li *) {
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;
    align-items: center;
    justify-content: center;
}
#hnd-header .hnd-topbar .hnd-icon-btn svg,
#hnd-header .hnd-topbar .hnd-burger-btn svg,
#hnd-header .hnd-topbar .hg-back-btn svg,
#hnd-header .hnd-slot-account :is(button, a):not(li *) :is(svg, img),
#hnd-header .hnd-slot-cart :is(button, a):not(li *) :is(svg, img) {
    width: 22px;
    height: 22px;
}
#hnd-header.hnd-scrolled .hnd-topbar .hnd-icon-btn,
#hnd-header.hnd-scrolled .hnd-topbar .hnd-burger-btn,
#hnd-header.hnd-scrolled .hnd-topbar .hg-back-btn,
#hnd-header.hnd-scrolled .hnd-slot-account :is(button, a):not(li *),
#hnd-header.hnd-scrolled .hnd-slot-cart :is(button, a):not(li *) {
    width: 36px;
    height: 36px;
    min-width: 36px;
}
#hnd-header.hnd-scrolled .hnd-topbar :is(.hnd-icon-btn, .hnd-burger-btn, .hg-back-btn) svg,
#hnd-header.hnd-scrolled .hnd-slot-account :is(button, a):not(li *) :is(svg, img),
#hnd-header.hnd-scrolled .hnd-slot-cart :is(button, a):not(li *) :is(svg, img) {
    width: 20px;
    height: 20px;
}

/* 1.55.1: قابِ یکسان کافی نبود، چون «جوهرِ» هر آیکن سهمِ متفاوتی از جعبه‌اش است (اندازه‌گیری روی سایتِ زنده:
   منو ۱۶×۱۰ در ۲۴، حساب ۱۷×۲۲ در ۲۲، علاقه‌مندی ۱۸ در ۲۰، سبد تصویرِ ۳۲تایی که ۹۴٪ را پر می‌کند). اندازهٔ هر
   آیکن جدا تنظیم شده تا بخشِ دیده‌شده‌اش حدودِ ۱۸ پیکسل شود. */
#hnd-header .hnd-topbar .hnd-burger-btn svg { width: 28px; height: 28px; }
#hnd-header .hnd-topbar .hnd-mobile-search-btn svg { width: 26px; height: 26px; }
#hnd-header .hnd-slot-account :is(button, a):not(li *) svg { width: 18px; height: 18px; }
#hnd-header .hnd-topbar .hnd-wishlist-btn svg { width: 20px; height: 20px; }
#hnd-header .hnd-slot-cart :is(button, a):not(li *) img { width: 20px; height: 20px; }
#hnd-header.hnd-scrolled .hnd-topbar .hnd-burger-btn svg { width: 25px; height: 25px; }
#hnd-header.hnd-scrolled .hnd-topbar .hnd-mobile-search-btn svg { width: 24px; height: 24px; }
#hnd-header.hnd-scrolled .hnd-slot-account :is(button, a):not(li *) svg { width: 17px; height: 17px; }
#hnd-header.hnd-scrolled .hnd-topbar .hnd-wishlist-btn svg,
#hnd-header.hnd-scrolled .hnd-slot-cart :is(button, a):not(li *) img { width: 18px; height: 18px; }

/* فاصلهٔ یکسانِ ۸ پیکسل بینِ همهٔ آیکن‌ها (پیش‌تر ۱۶ بینِ منو و جست‌وجو، ۵ بینِ آیکن‌های چپ، به‌علاوهٔ
   حاشیه‌های ظرفِ افزونه‌ها). جایگاه‌های افزونه (ورود، سبد) حاشیه و فاصلهٔ خودشان را از دست می‌دهند. */
#hnd-header .hnd-icons,
#hnd-header .hnd-topbar-end { gap: 8px; }
#hnd-header .hnd-header-shortcode-slot { display: flex; align-items: center; margin: 0; padding: 0; }
#hnd-header .hnd-header-shortcode-slot > * { margin: 0; padding: 0; display: flex; align-items: center; }
#hnd-header .hnd-slot-account :is(.dml-trigger-btn, .dml-account-dd),
#hnd-header .hnd-slot-cart .dm-scm-trigger-btn { margin: 0; }

/* (۱٫۷) 1.53.1: هرچه زیرِ هدرِ چسبان sticky است از پایینِ هدر می‌ایستد، نه از بالای صفحه (نوارِ فیلترِ موبایل
   و سایدبارِ فیلترِ آرشیو، سایدبارِ بلاگ). --hg-header-h را assets/js/hg-chrome.js با اندازهٔ واقعیِ هدر به‌روز
   می‌کند (هدر هنگامِ اسکرول کوتاه می‌شود). */
body.hg-chrome-new .hagh-archive-chipbar {
    top: var(--hg-header-h, 0px);
}
@media (min-width: 992px) {
    body.hg-chrome-new .hagh-archive-sidebar {
        top: calc(var(--hg-header-h, 0px) + 16px);
        max-height: calc(100vh - var(--hg-header-h, 0px) - 32px);
    }
}
body.hg-chrome-new .hgb-side__sticky {
    top: calc(var(--hg-header-h, 0px) + 20px);
}
/* 1.56.0: سایدبارهای چسبانِ بخشِ نظرات و پرسش‌وپاسخِ صفحهٔ محصول (افزونهٔ dm-advanced-reviews، top:20px) زیرِ هدرِ
   چسبان می‌رفتند؛ همان ۲۰ پیکسل، ولی از پایینِ هدر. */
body.hg-chrome-new :is(.dm-dk-sidebar, .dmqa-sidebar) {
    top: calc(var(--hg-header-h, 0px) + 20px);
}

/* (۱٫۸) نوارِ قیمتِ لحظه‌ای: از 1.58.0 در assets/css/hg-price-strip.css (روی قالبِ «صفحه اصلی جدید» هم بار می‌شود). */

/* (۲) از homepage-new-design-front.css: «header extras» و حرکتِ کاهش‌یافته. */
#hnd-header .hnd-topbar-end {
    display: flex;
    align-items: center;
    gap: 8px; /* 1.55.1: پیش‌تر ۱۶ (مثلِ صفحهٔ اصلی)؛ حالا همان فاصلهٔ یکسانِ آیکن‌ها */
}
@media (prefers-reduced-motion: reduce) {
    #hnd-footer .hnd-f-ticker-track,
    #hnd-footer .hnd-f-brand-star {
        animation: none !important;
    }
}