/* =========================================================================
   ABZARBIN v6.0.0 — Mega Menu & Navigation Design System
   -------------------------------------------------------------------------
   هدر تک‌ردیفه (بازطراحی کامل طبق Specification):
     [لوگو] → [ناوبری ۷ آیتمی] → [جستجوی بزرگ] → [حساب | سبد با Badge]
     ناوبری: صفحه اصلی · فروشگاه (مگامنو) · برندها · وبلاگ · پشتیبانی ·
              درباره ما · تماس با ما

   مگامنوی «فروشگاه» v6.0.0 — پنل تمام‌عرض، فقط دسته‌بندی (Navigation-محور):
     ستون ۱  دسته‌بندی اصلی (آیکون SVG اختصاصی + نام + پیکان + هایلایت نارنجی)
     ستون ۲  زیردسته‌های دستهٔ فعال (سربرگ بولد + «مشاهده همه» + فلشِ دارد)
     ستون ۳  زیرِ زیردسته‌ها — فقط با hover روی زیردستهٔ دارای فلش؛
             سطح ۴+ با Flyout (data-kids → بازگشتی)
     نوار    پایانی مینیمال: «مشاهده همه دسته‌بندی‌ها» + «مشاهده برندها»
     ⚠ هیچ محصول تکی/قیمت/Add-to-Cart در پنل نیست — فقط درخت دسته‌بندی.

   پالت (الگوی ۷۰٪ خنثی / ۲۰٪ تیره / ۱۰٪ نارنجی):
     --abz-dark      #111820   متن اصلی تیره
     --abz-orange    #F47B20   تأکید برند (Active/CTA/Hover)
     --abz-orange-dk #D9660F   نارنجی تیره (متن روی روشن)
     --abz-orange-soft #FFF1E5 پس‌زمینه نرم نارنجی
     --abz-bg        #F7F8F9   پس‌زمینه ستون ۱
     --abz-text      #18212A   متن اصلی
     --abz-text-2    #66717C   متن ثانویه
     --abz-line      #E3E7EA   خط جداکننده
     --abz-hover     #FFF4EA   پس‌زمینه Hover

   همه سلکتورها با پیشوند abz-* و scoped؛ RTL-native (ویژگی‌های منطقی).
   ========================================================================= */

/* ---------------------------------------------------------------
   ۰) متغیرها
   --------------------------------------------------------------- */
#page.ry-v5 {
    --abz-dark: #111820;
    --abz-surface: #18222B;
    --abz-orange: #F47B20;
    --abz-orange-hi: #FF8A24;
    --abz-orange-dk: #D9660F;
    --abz-orange-soft: #FFF1E5;
    --abz-bg: #F7F8F9;
    --abz-text: #18212A;
    --abz-text-2: #66717C;
    --abz-line: #E3E7EA;
    --abz-line-2: #F0F2F4;
    --abz-hover: #FFF4EA;
    --abz-green: #199A63;
    --abz-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --abz-t: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ارتفاع هدر برای عناصر چسبان (سایدبار فروشگاه و…) — هدر تک‌ردیفه:
   ≥1200 فقط یک ردیف؛ 992-1199 ناوبری به ردیف دوم می‌رود. */
@media (min-width: 1200px) {
    #page.ry-v5 { --ry-header-h: 79px; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    #page.ry-v5 { --ry-header-h: 126px; }
}

/* ---------------------------------------------------------------
   ۰-الف) چیدمان ردیف اصلی هدر — لوگو | ناوبری | جستجو | آیکون‌ها
   --------------------------------------------------------------- */
.ry-header .ry-header-main {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 78px;
    padding: 10px 0;
}
.ry-header .ry-branding { flex-shrink: 0; }

/* جستجوی بزرگ — بخش مرکزی هدر (بین ناوبری و آیکون‌ها) */
.ry-header-main .abz-search {
    flex: 1 1 300px;
    min-width: 0;
    max-width: 520px;
    position: relative;
}
.ry-header-main .ry-actions {
    margin-inline-start: 0; /* جستجو با flex:1 فضا را پر می‌کند */
    flex-shrink: 0;
}

/* آیکون جستجو (اورلی تمام‌صفحه) فقط موبایل */
#page.ry-v5 .ry-header-main .ry-search-trigger { display: none; }

/* ---------------------------------------------------------------
   ۱) ناوبری اصلی — ۷ آیتم بین لوگو و جستجو (فقط دسکتاپ)
   --------------------------------------------------------------- */
.abz-nav {
    display: none; /* <992 منو از دراور موبایل می‌آید */
    flex: 0 1 auto;
    min-width: 0;
}
.abz-nav__list {
    display: flex;
    align-items: center;
    gap: 2px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.abz-nav__link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 9px 10px;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.7;
    color: #3D4854;
    text-decoration: none;
    border-radius: 9px;
    position: relative;
    white-space: nowrap;
    transition: color 0.16s var(--abz-ease), background 0.16s var(--abz-ease);
}
.abz-nav__link:hover {
    color: var(--abz-orange);
    background: rgba(244, 123, 32, 0.07);
}
/* خط تأکیدی زیر آیتم فعال */
.abz-nav__link::after {
    content: '';
    position: absolute;
    bottom: 2px;
    inset-inline: 11px;
    height: 2.5px;
    border-radius: 3px;
    background: var(--abz-orange);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.18s var(--abz-ease);
}
.abz-nav__item.is-active > .abz-nav__link {
    color: var(--abz-orange-dk);
}
.abz-nav__item.is-active > .abz-nav__link::after { transform: scaleX(1); }

/* آیتم «فروشگاه» — تریگر مگامنو */
.abz-nav__chev {
    display: inline-flex;
    width: 10px;
    height: 10px;
    color: #97A1AB;
    transition: transform 0.2s var(--abz-ease), color 0.16s;
}
.abz-nav__chev svg { width: 100%; height: 100%; }
.abz-nav__link--shop { font-weight: 700; }
.abz-nav__item--mega.is-open > .abz-nav__link {
    color: var(--abz-orange-dk);
    background: rgba(244, 123, 32, 0.09);
}
.abz-nav__item--mega.is-open > .abz-nav__link .abz-nav__chev {
    transform: rotate(180deg);
    color: var(--abz-orange);
}

/* ---------------------------------------------------------------
   ۲) جعبه جستجوی بزرگ + دراپ‌داون نتایج زنده
   --------------------------------------------------------------- */
.abz-search__form {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 47px;
    padding-inline-start: 14px;
    background: #F2F4F7;
    border: 1.5px solid #E3E7EA;
    border-radius: 12px;
    transition: border-color var(--abz-t), background var(--abz-t), box-shadow var(--abz-t);
}
.abz-search__form:focus-within {
    background: #FFFFFF;
    border-color: var(--abz-orange);
    box-shadow: 0 0 0 4px rgba(244, 123, 32, 0.12);
}
.abz-search__icon {
    color: #98A2AB;
    font-size: 14.5px;
    flex-shrink: 0;
    transition: color var(--abz-t);
}
.abz-search__form:focus-within .abz-search__icon { color: var(--abz-orange); }
.abz-search__input {
    flex: 1;
    min-width: 0;
    height: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    padding: 0 8px;
    font: inherit;
    font-size: 13px;
    color: var(--abz-text);
}
.abz-search__input::placeholder { color: #98A2AB; font-weight: 400; }
.abz-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.abz-search__btn {
    flex-shrink: 0;
    width: 37px;
    height: 37px;
    border: 0;
    border-radius: 9px;
    background: var(--abz-orange);
    color: #FFFFFF;
    font-size: 13.5px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background var(--abz-t), transform 0.12s;
}
.abz-search__btn:hover { background: var(--abz-orange-dk); }
.abz-search__btn:active { transform: scale(0.96); }
.abz-search__btn:focus-visible { outline: 2px solid var(--abz-orange-dk); outline-offset: 2px; }

/* --- دراپ‌داون نتایج زنده --- */
.abz-search__dd {
    position: absolute;
    top: calc(100% + 8px);
    inset-inline: 0;
    max-height: 420px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    border-radius: 14px;
    box-shadow: 0 24px 48px -12px rgba(17, 24, 32, 0.18), 0 4px 12px rgba(17, 24, 32, 0.06);
    z-index: 70;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity var(--abz-t), transform var(--abz-t), visibility 0.2s;
}
.abz-search__dd::before { /* پل Hover بین فیلد و دراپ‌داون */
    content: '';
    position: absolute;
    top: -8px;
    inset-inline: 0;
    height: 8px;
}
.abz-search.is-open .abz-search__dd {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.abz-search__dd .search-suggestion-item,
.abz-search__dd .ry-live-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px;
    text-decoration: none;
    color: var(--abz-text);
}
.abz-search__dd .search-suggestion-item:hover,
.abz-search__dd .ry-live-item:hover { background: var(--abz-hover); }
.abz-search__dd .search-suggestion-item img,
.abz-search__dd .ry-live-item img {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    object-fit: cover;
    background: var(--abz-bg);
    flex-shrink: 0;
}
.abz-search__dd .search-suggestion-item-title,
.abz-search__dd .ry-live-item-title {
    flex: 1;
    min-width: 0;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.abz-search__dd .search-suggestion-item-price,
.abz-search__dd .ry-live-item-price {
    font-size: 12px;
    font-weight: 800;
    color: var(--abz-text);
    white-space: nowrap;
}
.abz-search__dd .search-suggestion-item-price del { color: #98A2AB; }
.abz-search__dd .ss-group,
.abz-search__dd .ss-group-title,
.abz-search__dd .search-group-title {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 10px 14px 6px;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--abz-text-2);
    letter-spacing: 0.04em;
}
.abz-search__dd .ss-group-title i,
.abz-search__dd .search-group-title i {
    color: var(--abz-orange);
    font-size: 10px;
}
.abz-search__dd .ss-cat-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8.5px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--abz-text);
    text-decoration: none;
}
.abz-search__dd .ss-cat-item:hover { background: var(--abz-hover); color: var(--abz-orange); }
.abz-search__dd .ss-cat-item i {
    color: var(--abz-orange);
    font-size: 10px;
    width: 16px;
    text-align: center;
}
.abz-search__dd .ss-cat-item small {
    margin-inline-start: auto;
    font-size: 10px;
    color: #98A2AB;
}
.abz-search__dd .ss-brand-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--abz-text);
    text-decoration: none;
}
.abz-search__dd .ss-brand-item:hover { background: var(--abz-hover); }
.abz-search__dd .ss-brand-item i {
    color: var(--abz-orange);
    font-size: 11px;
}
.abz-search__dd .ss-brands {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px 14px 10px;
}
.abz-search__dd .search-no-results {
    padding: 18px 14px;
    text-align: center;
    font-size: 12px;
    color: var(--abz-text-2);
}

/* ---------------------------------------------------------------
   ۳) مگامنوی فروشگاه — پنل تمام‌عرض زیر هدر (فقط دسکتاپ)
   --------------------------------------------------------------- */
.abz-mega {
    position: absolute; /* نسبت به هدرِ sticky — دقیقاً زیر کل هدر */
    top: 100%;
    inset-inline: 0;
    z-index: 62;
    padding-top: 7px; /* جدایی بصری مینیمال از هدر */
    visibility: hidden;
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.24s cubic-bezier(0.32, 0.72, 0, 1), visibility 0s linear 0.24s;
}
.abz-mega.is-open {
    visibility: visible;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    transition: opacity 0.16s ease, transform 0.22s cubic-bezier(0.32, 0.72, 0, 1);
}
.abz-mega__panel {
    background: #FFFFFF;
    border-top: 1px solid var(--abz-line);
    border-bottom: 1px solid var(--abz-line);
    border-radius: 0 0 18px 18px;
    box-shadow: 0 34px 64px -20px rgba(17, 24, 32, 0.22), 0 6px 20px rgba(17, 24, 32, 0.05);
    overflow: hidden;
}

/* --- گرید چهارستونی (RTL: ستون ۱ راست‌ترین، ستون ۴ بنر/برند چپ‌ترین) --- */
.abz-mmx {
    max-width: var(--ry-container, 1280px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 264px 318px 1fr 246px;
    min-height: 452px;
}

/* ================= ستون ۱: دسته‌بندی اصلی ================= */
.abz-mmx__col1 {
    background: var(--abz-bg);
    border-inline-end: 1px solid var(--abz-line);
    padding: 14px 12px 16px;
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.abz-mmx__coltitle {
    margin: 0;
    padding: 2px 10px 10px;
    font-size: 11.5px;
    font-weight: 800;
    color: #8B95A0;
}
.abz-mmx__mains {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.abz-mmx__mains li { position: relative; }
.abz-mmx__main {
    display: flex;
    align-items: center;
    gap: 11px;
    height: 47px;
    padding: 0 10px;
    border-radius: 11px;
    text-decoration: none;
    color: var(--abz-text);
    position: relative;
    transition: background 0.15s var(--abz-ease);
}
.abz-mmx__main:hover { background: #FFFFFF; }
/* نوار indicator نارنجی — لبه راست ستون (فقط دستهٔ فعال) */
.abz-mmx__main::before {
    content: '';
    position: absolute;
    inset-inline-start: -12px;
    top: 50%;
    width: 3px;
    height: 22px;
    border-radius: 3px 0 0 3px;
    background: var(--abz-orange);
    transform: translateY(-50%) scaleY(0);
    transition: transform 0.18s var(--abz-ease);
}
.abz-mmx__main.is-on { background: var(--abz-hover); }
.abz-mmx__main.is-on .abz-mmx__mainname { color: var(--abz-orange-dk); font-weight: 800; }
.abz-mmx__main.is-on::before { transform: translateY(-50%) scaleY(1); }
.abz-mmx__main.is-on .abz-mmx__thumb {
    border-color: rgba(244, 123, 32, 0.55);
    box-shadow: 0 5px 14px -6px rgba(244, 123, 32, 0.45);
}
.abz-mmx__ico {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    color: #55606C;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.16s var(--abz-ease), color 0.16s var(--abz-ease), border-color 0.16s;
}
.abz-mmx__ico svg { width: 19px; height: 19px; }
/* آیکون تصویری دستهٔ اصلی — عکس واقعی همان شاخه (هماهنگ با محتوای سایت) */
.abz-mmx__thumb {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    box-shadow: 0 3px 8px -3px rgba(17, 24, 32, 0.14);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
    transition: border-color 0.16s, box-shadow 0.18s ease, transform 0.18s var(--abz-ease);
}
.abz-mmx__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* تصویر کامل، بدون برش */
    padding: 3px;
    transition: transform 0.22s var(--abz-ease);
}
.abz-mmx__main:hover .abz-mmx__thumb {
    border-color: rgba(244, 123, 32, 0.45);
    box-shadow: 0 8px 16px -8px rgba(17, 24, 32, 0.22);
}
.abz-mmx__main:hover .abz-mmx__thumb img { transform: scale(1.07); }
.abz-mmx__main.is-on .abz-mmx__thumb {
    border-color: var(--abz-orange);
    box-shadow: 0 0 0 2.5px rgba(244, 123, 32, 0.16);
}
.abz-mmx__mainname {
    flex: 1;
    min-width: 0;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.15s;
}
.abz-mmx__chev {
    display: inline-flex;
    width: 11px;
    height: 11px;
    color: #AEB7C0;
    flex-shrink: 0;
    transition: color 0.15s;
}
.abz-mmx__chev svg { width: 100%; height: 100%; }
.abz-mmx__main:hover .abz-mmx__ico { color: var(--abz-orange); border-color: rgba(244, 123, 32, 0.4); }
.abz-mmx__main:hover .abz-mmx__chev { color: var(--abz-orange); }
.abz-mmx__main.is-on .abz-mmx__ico {
    background: var(--abz-orange);
    border-color: var(--abz-orange);
    color: #FFFFFF;
}
.abz-mmx__main.is-on .abz-mmx__mainname { color: var(--abz-orange-dk); font-weight: 800; }
.abz-mmx__main.is-on .abz-mmx__chev { color: var(--abz-orange); }

/* ================= ستون ۲: زیردسته‌های دستهٔ فعال ================= */
.abz-mmx__col2 {
    padding: 18px 20px 16px;
    border-inline-end: 1px solid var(--abz-line);
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.abz-mmx__group {
    display: none;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}
.abz-mmx__group.is-on { display: flex; animation: abzColIn 0.16s ease; }
.abz-mmx__ghead {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--abz-line-2);
}
.abz-mmx__ghead h3 {
    margin: 0;
    font-size: 14.5px;
    font-weight: 800;
    color: var(--abz-text);
    line-height: 1.6;
}
.abz-mmx__ghead a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--abz-orange-dk);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s;
}
.abz-mmx__ghead a:hover { color: var(--abz-orange); }
.abz-mmx__ghead a i,
.abz-mmx__dhead a i {
    display: inline-flex;
    width: 13px;
    height: 13px;
}
.abz-mmx__ghead a i svg,
.abz-mmx__dhead a i svg { width: 100%; height: 100%; }
.abz-mmx__subs {
    list-style: none;
    margin: 8px 0 0;
    padding: 0;
    flex: 1;
    min-height: 0;
    max-height: 350px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
.abz-mmx__subs::-webkit-scrollbar { width: 4px; }
.abz-mmx__subs::-webkit-scrollbar-thumb { background: #D6DCE1; border-radius: 4px; }
.abz-mmx__sub {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 41px;
    padding: 0 9px;
    border-radius: 9px;
    text-decoration: none;
    color: #39434E;
    font-size: 13.5px;
    font-weight: 500;
    transition: background 0.14s var(--abz-ease), color 0.14s var(--abz-ease);
}
.abz-mmx__sub:hover { background: var(--abz-hover); }
.abz-mmx__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #C4CCD3;
    flex-shrink: 0;
    transition: background 0.15s, transform 0.15s;
}
.abz-mmx__subname {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.7;
}
.abz-mmx__subcount {
    font-size: 11px;
    font-weight: 500;
    color: #97A1AB;
    flex-shrink: 0;
}
.abz-mmx__subchev {
    display: inline-flex;
    width: 11px;
    height: 11px;
    color: #AEB7C0;
    flex-shrink: 0;
    transition: color 0.15s;
}
.abz-mmx__subchev svg { width: 100%; height: 100%; }
.abz-mmx__sub.is-on {
    background: var(--abz-hover);
    color: var(--abz-orange-dk);
    font-weight: 700;
}
.abz-mmx__sub.is-on .abz-mmx__dot { background: var(--abz-orange); transform: scale(1.25); }
.abz-mmx__sub.is-on .abz-mmx__subchev { color: var(--abz-orange); }
/* چیپ تصویری زیردسته — عکس واقعی همان زیرشاخه، جایگزین نقطهٔ ساده */
.abz-mmx__chip {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line-2);
    box-shadow: 0 2px 6px -2px rgba(17, 24, 32, 0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.18s ease;
}
.abz-mmx__chip img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* تصویر کامل، بدون برش */
    padding: 2px;
}
.abz-mmx__sub:hover .abz-mmx__chip { border-color: rgba(244, 123, 32, 0.4); }
.abz-mmx__sub.is-on .abz-mmx__chip { border-color: rgba(244, 123, 32, 0.65); }
.abz-mmx__empty {
    margin: 12px 2px 0;
    font-size: 12.5px;
    line-height: 2;
    color: var(--abz-text-2);
}

/* ================= ستون ۳: زیرِ زیردسته‌ها ================= */
.abz-mmx__col3 {
    padding: 18px 20px 16px;
    display: flex;
    flex-direction: column;
    position: relative;
    min-width: 0;
}
.abz-mmx__deep {
    display: none;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    max-width: 620px;
}
.abz-mmx__deep.is-on { display: flex; animation: abzColIn 0.16s ease; }
.abz-mmx__dhead {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--abz-line-2);
}
.abz-mmx__dhead h4 {
    margin: 0;
    font-size: 14.5px;
    font-weight: 800;
    color: var(--abz-text);
    line-height: 1.6;
}
.abz-mmx__dhead a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--abz-orange-dk);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s;
}
.abz-mmx__dhead a:hover { color: var(--abz-orange); }
.abz-mmx__kids {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(172px, 1fr));
    gap: 2px 16px;
    align-content: start;
}
.abz-mmx__kids li { position: relative; } /* لنگر Flyout سطح ۴ */
.abz-mmx__kid {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 5px 10px;
    border-radius: 9px;
    text-decoration: none;
    color: #39434E;
    font-size: 13px;
    font-weight: 500;
    transition: background 0.14s var(--abz-ease), color 0.14s var(--abz-ease);
}
.abz-mmx__kid:hover { background: var(--abz-hover); color: var(--abz-text); }
.abz-mmx__kidname {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.7;
}
.abz-mmx__kid > small {
    font-size: 11px;
    font-weight: 500;
    color: #97A1AB;
    flex-shrink: 0;
}
.abz-mmx__kidchev {
    display: inline-flex;
    width: 10px;
    height: 10px;
    color: #AEB7C0;
    flex-shrink: 0;
    transition: color 0.15s;
}
.abz-mmx__kidchev svg { width: 100%; height: 100%; }
.abz-mmx__kid--kids:hover .abz-mmx__kidchev { color: var(--abz-orange); }

/* حالت راهنما (دستهٔ بدون فرزند یا قبل از hover) */
.abz-mmx__ghost {
    position: absolute;
    inset: 0;
    display: none;
    place-content: center;
    justify-items: center;
    gap: 10px;
    padding: 24px;
    text-align: center;
    pointer-events: none;
}
.abz-mmx__ghost.is-on { display: grid; }
.abz-mmx__ghost i {
    display: inline-flex;
    width: 36px;
    height: 36px;
    color: #C6CDD4;
}
.abz-mmx__ghost i svg { width: 100%; height: 100%; }
.abz-mmx__ghost p {
    margin: 0;
    max-width: 250px;
    font-size: 12.5px;
    line-height: 2.1;
    color: #97A1AB;
}

/* ================= ستون ۴: بنر تبلیغاتی + برندهای محبوب ================= */
.abz-mmx__side {
    background: linear-gradient(180deg, #FAFBFC 0%, #F4F6F9 100%);
    border-inline-start: 1px solid var(--abz-line);
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

/* --- بنر تبلیغاتی فروش ویژه (تصویر دریل از دارایی‌های خود قالب) --- */
.abz-mmx__banner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-height: 164px;
    padding: 15px 15px 13px;
    border-radius: 16px;
    overflow: hidden;
    background: radial-gradient(130% 120% at 88% 8%, #26333F 0%, #151E29 52%, #0F1620 100%);
    color: #FFFFFF;
    text-decoration: none;
    isolation: isolate;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07), 0 10px 22px -14px rgba(17, 24, 32, 0.5);
    transition: transform 0.2s var(--abz-ease), box-shadow 0.2s ease;
}
.abz-mmx__banner:hover {
    transform: translateY(-2px);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 16px 30px -14px rgba(17, 24, 32, 0.55);
}
/* هالهٔ نارنجی پشت دریل */
.abz-mmx__banner::before {
    content: '';
    position: absolute;
    inset-inline-end: -34px;
    bottom: -34px;
    width: 158px;
    height: 158px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(244, 123, 32, 0.32) 0%, rgba(244, 123, 32, 0) 65%);
    z-index: 0;
    pointer-events: none;
}
.abz-mmx__banner-tag {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    padding: 3.5px 10px;
    border-radius: 999px;
    background: rgba(244, 123, 32, 0.16);
    border: 1px solid rgba(244, 123, 32, 0.42);
    color: #FFC48F;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.2px;
}
.abz-mmx__banner-title {
    position: relative;
    z-index: 2;
    margin: 0;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.75;
    color: #FFFFFF;
    white-space: nowrap;
}
.abz-mmx__banner-off {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    color: #B9C4CF;
    font-size: 11px;
    font-weight: 600;
}
.abz-mmx__banner-off b {
    color: var(--abz-orange);
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.5px;
}
.abz-mmx__banner-cta {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
    padding: 7.5px 13px;
    border-radius: 999px;
    background: var(--abz-orange);
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 10px 20px -8px rgba(244, 123, 32, 0.7);
    transition: background 0.15s, transform 0.15s var(--abz-ease);
}
.abz-mmx__banner:hover .abz-mmx__banner-cta { background: var(--abz-orange-dk); transform: translateX(-2px); }
.abz-mmx__banner-cta i { display: inline-flex; width: 12px; height: 12px; }
.abz-mmx__banner-cta i svg { width: 100%; height: 100%; }
.abz-mmx__banner-img {
    position: absolute;
    inset-inline-end: -22px;
    bottom: -18px;
    width: 104px;
    height: auto;
    z-index: 1;
    transform: rotate(-10deg);
    filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.5));
    transition: transform 0.25s var(--abz-ease);
    pointer-events: none;
}
.abz-mmx__banner:hover .abz-mmx__banner-img { transform: rotate(-10deg) scale(1.06) translateY(-3px); }

/* --- برندهای محبوب — لوگوی رنگی واقعی --- */
.abz-mmx__brands {
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.abz-mmx__brands-title {
    margin: 0 0 8px;
    padding: 0 2px;
    font-size: 11px;
    font-weight: 800;
    color: #8B95A0;
}
.abz-mmx__brands-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 7px;
}
.abz-mmx__brand {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    border-radius: 12px;
    text-decoration: none;
    transition: border-color 0.15s, box-shadow 0.18s ease, transform 0.18s var(--abz-ease);
    /* v6.11.0 — خط رنگی پایین چیز بر اساس رنگ اصلی برند */
    box-shadow: inset 0 -3px 0 0 var(--bzc, #F47B20);
}
.abz-mmx__brand:hover {
    border-color: var(--bzc, rgba(244, 123, 32, 0.55));
    box-shadow: inset 0 -4px 0 0 var(--bzc, #F47B20), 0 10px 20px -10px rgba(17, 24, 32, 0.25);
    transform: translateY(-2px);
}
.abz-mmx__brand-logo { display: flex; max-width: 100%; }
.abz-mmx__brand-logo img {
    max-width: 76px;
    max-height: 26px;
    width: auto;
    height: auto;
    object-fit: contain;
}
.abz-mmx__brand--all {
    grid-column: 1 / -1;
    height: 36px;
    gap: 6px;
    color: var(--abz-orange-dk);
    font-size: 11.5px;
    font-weight: 800;
    border-style: dashed;
    background: rgba(255, 255, 255, 0.6);
}
.abz-mmx__brand--all:hover { color: var(--abz-orange); }
.abz-mmx__brand--all i { display: inline-flex; width: 13px; height: 13px; }
.abz-mmx__brand--all i svg { width: 100%; height: 100%; }

/* ================= نوار «دسته‌های پرطرفدار» — الگوی نوار تصویری =================
   ردیف افقی از زیردسته‌های پرمحتواتر با تصویر واقعی (۶۴px) — هماهنگ با
   الگوی مگامنوهای فروشگاهی مدرن؛ تصویر بالا، نام پایین. */
.abz-mmx-strip {
    display: flex;
    align-items: stretch;
    gap: 18px;
    max-width: var(--ry-container, 1280px);
    margin-inline: auto;
    padding: 13px 20px 15px;
    border-top: 1px solid var(--abz-line-2);
    background: linear-gradient(180deg, #FBFCFD 0%, #FFFFFF 100%);
}
.abz-mmx-strip__label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    flex-shrink: 0;
    padding-inline-start: 6px;
    font-size: 12.5px;
    font-weight: 900;
    color: var(--abz-text);
    white-space: nowrap;
}
.abz-mmx-strip__label i {
    display: inline-flex;
    width: 15px;
    height: 15px;
    color: var(--abz-orange);
}
.abz-mmx-strip__label i svg { width: 100%; height: 100%; }
.abz-mmx-strip__row {
    display: flex;
    align-items: stretch;
    gap: 10px;
    flex: 1;
    min-width: 0;
}
.abz-mmx-strip__tile {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 8px 6px 6px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line-2);
    border-radius: 13px;
    text-decoration: none;
    transition: background 0.16s var(--abz-ease), border-color 0.16s, box-shadow 0.18s ease, transform 0.18s var(--abz-ease);
}
.abz-mmx-strip__tile:hover {
    background: #FFFFFF;
    border-color: rgba(244, 123, 32, 0.5);
    box-shadow: 0 10px 22px -10px rgba(244, 123, 32, 0.35);
    transform: translateY(-2px);
}
.abz-mmx-strip__img {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line-2);
    box-shadow: 0 4px 10px -4px rgba(17, 24, 32, 0.14);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: border-color 0.16s, box-shadow 0.2s ease, transform 0.2s var(--abz-ease);
}
.abz-mmx-strip__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.24s var(--abz-ease);
}
.abz-mmx-strip__count {
    position: absolute;
    top: 4px;
    inset-inline-start: 4px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 8px;
    background: rgba(17, 24, 32, 0.78);
    color: #FFFFFF;
    font-size: 9.5px;
    font-weight: 700;
    line-height: 17px;
    text-align: center;
}
.abz-mmx-strip__name {
    max-width: 100%;
    font-size: 11px;
    font-weight: 700;
    color: var(--abz-text);
    line-height: 1.55;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.15s;
}
.abz-mmx-strip__tile:hover .abz-mmx-strip__img {
    border-color: rgba(244, 123, 32, 0.55);
    box-shadow: 0 10px 22px -8px rgba(244, 123, 32, 0.45);
    transform: translateY(-2px);
}
.abz-mmx-strip__tile:hover .abz-mmx-strip__img img { transform: scale(1.08); }
.abz-mmx-strip__tile:hover .abz-mmx-strip__name { color: var(--abz-orange-dk); }

/* عرض‌های میانی: نوار فشرده‌تر */
@media (max-width: 1279.98px) and (min-width: 992px) {
    .abz-mmx-strip__img { width: 56px; height: 56px; }
    .abz-mmx-strip__label { display: none; }
    .abz-mmx-strip { padding-inline: 14px; }
}

/* ================= Flyout سطح ۴+ (زیرِ زیرِ زیردسته) ================= */
.abz-fly {
    position: absolute;
    top: -7px;
    inset-inline-start: calc(100% + 9px); /* RTL: کنارِ چپِ آیتم (ادامهٔ جهت خواندن) */
    width: 240px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    border-radius: 13px;
    box-shadow: 0 22px 44px -14px rgba(17, 24, 32, 0.2), 0 4px 12px rgba(17, 24, 32, 0.06);
    padding: 9px;
    z-index: 30;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-7px);
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.17s ease, visibility 0s linear 0.17s;
}
.abz-fly.is-on {
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    transition: opacity 0.15s ease, transform 0.17s ease;
}
.abz-fly.is-flip { inset-inline-start: auto; inset-inline-end: calc(100% + 9px); }
.abz-fly__title {
    margin: 0;
    padding: 4px 9px 8px;
    font-size: 12px;
    font-weight: 800;
    color: var(--abz-orange-dk);
    border-bottom: 1px solid var(--abz-line-2);
    margin-bottom: 5px;
}
.abz-fly__list { list-style: none; margin: 0; padding: 0; }
.abz-fly__list a {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 37px;
    padding: 4px 9px;
    border-radius: 8px;
    text-decoration: none;
    color: #39434E;
    font-size: 12.5px;
    font-weight: 500;
    transition: background 0.13s, color 0.13s;
}
.abz-fly__list a:hover { background: var(--abz-hover); color: var(--abz-text); }
.abz-fly__list .abz-mmx__dot { width: 4px; height: 4px; }
.abz-fly__list a > span:not(.abz-mmx__dot) {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.abz-fly__list a > small {
    font-size: 10.5px;
    color: #97A1AB;
    flex-shrink: 0;
}

/* ================= نوار پایانی مینیمال ================= */
.abz-mega__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px max(16px, calc((100% - var(--ry-container, 1280px)) / 2 + 20px)) 13px;
    border-top: 1px solid var(--abz-line);
    background: #FAFBFC;
}
.abz-mega__allcats {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 700;
    color: var(--abz-orange-dk);
    text-decoration: none;
    transition: color 0.15s;
}
.abz-mega__allcats i {
    display: inline-flex;
    width: 15px;
    height: 15px;
    transition: transform 0.18s var(--abz-ease);
}
.abz-mega__allcats i svg { width: 100%; height: 100%; }
.abz-mega__allcats:hover { color: var(--abz-orange); }
.abz-mega__allcats:hover i { transform: translateX(-3px); }
.abz-mega__allbrands {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--abz-text-2);
    text-decoration: none;
    transition: color 0.15s;
}
.abz-mega__allbrands i {
    display: inline-flex;
    width: 14px;
    height: 14px;
}
.abz-mega__allbrands i svg { width: 100%; height: 100%; }
.abz-mega__allbrands:hover { color: var(--abz-orange-dk); }

/* انیمیشن سوئیچ ستون‌ها */
@keyframes abzColIn {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: none; }
}

/* ---------------------------------------------------------------
   ۴) آکاردئون موبایل + برندهای محبوب (داخل دراور)
   --------------------------------------------------------------- */
.abz-acc { margin-top: 18px; }
.abz-acc__label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 4px 10px;
    font-size: 11px;
    font-weight: 800;
    color: var(--abz-text-2);
    letter-spacing: 0.03em;
}
.abz-acc__label i { color: var(--abz-orange); font-size: 11px; display: inline-flex; width: 13px; height: 13px; }
.abz-acc__label i svg { width: 100%; height: 100%; }
.abz-acc__item {
    border: 1px solid var(--abz-line);
    border-radius: 12px;
    background: #FFFFFF;
    margin-bottom: 8px;
    overflow: hidden;
}
.abz-acc__item.is-open {
    border-color: rgba(244, 123, 32, 0.45);
    box-shadow: 0 10px 22px -12px rgba(244, 123, 32, 0.35);
}
.abz-acc__head {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    background: transparent;
    border: 0;
    cursor: pointer;
    font: inherit;
    text-align: start;
}
.abz-acc__head:focus-visible { outline: 2px solid var(--abz-orange); outline-offset: -2px; }
.abz-acc__ico {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: var(--abz-hover);
    color: var(--abz-orange);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.abz-acc__ico svg { width: 18px; height: 18px; }
.abz-acc__name {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    font-weight: 700;
    color: var(--abz-text);
    text-align: start;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.abz-acc__count {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 600;
    color: var(--abz-text-2);
    background: var(--abz-bg);
    border-radius: 999px;
    padding: 2.5px 8px;
}
.abz-acc__chev {
    flex-shrink: 0;
    display: inline-flex;
    width: 11px;
    height: 11px;
    color: #98A2AB;
    transition: transform 0.22s var(--abz-ease);
}
.abz-acc__chev svg { width: 100%; height: 100%; }
.abz-acc__item.is-open .abz-acc__chev { transform: rotate(180deg); }
.abz-acc__panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.26s var(--abz-ease);
}
.abz-acc__item.is-open .abz-acc__panel { grid-template-rows: 1fr; }
.abz-acc__inner { overflow: hidden; }
.abz-acc__all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 14px;
    font-size: 12px;
    font-weight: 700;
    color: var(--abz-orange);
    background: var(--abz-hover);
    text-decoration: none;
}
.abz-acc__all i { display: inline-flex; width: 12px; height: 12px; }
.abz-acc__all i svg, .abz-acc__kid-all i svg { width: 100%; height: 100%; }
.abz-acc__sub {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 15px;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--abz-text);
    text-decoration: none;
    border-top: 1px solid var(--abz-line-2);
    transition: background 0.16s var(--abz-ease);
}
.abz-acc__sub small,
.abz-acc__subcount {
    margin-inline-start: auto;
    font-size: 10px;
    color: #98A2AB;
    flex-shrink: 0;
}
.abz-acc__sub:hover { background: var(--abz-hover); }
.abz-acc__thumb { /* بندانگشتی تصویر زیردسته — قاب استاندارد کامل (بدون برش) */
    width: 40px;
    height: 40px;
    border-radius: 9px;
    border: 1px solid var(--abz-line-2);
    background: var(--abz-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}
.abz-acc__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 3px;
}
.abz-acc__thumb--main { /* تصویر دستهٔ اصلی در ردیف اول آکاردئون — به‌جای آیکون */
    width: 46px;
    height: 46px;
    border-radius: 11px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    box-shadow: 0 3px 8px -3px rgba(17, 24, 32, 0.16);
}
.abz-acc__thumb--main img { object-fit: cover; padding: 0; }

/* --- سطح سوم: زیرشاخه‌های زیردسته (آکاردئون تودرتو) --- */
.abz-acc__group { border-top: 1px solid var(--abz-line-2); }
.abz-acc__subhead {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 7px 15px;
    background: transparent;
    border: 0;
    cursor: pointer;
    font: inherit;
    text-align: start;
}
.abz-acc__subhead:focus-visible { outline: 2px solid var(--abz-orange); outline-offset: -2px; }
.abz-acc__subname {
    flex: 1;
    min-width: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--abz-text);
    text-align: start;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.18s var(--abz-ease);
}
.abz-acc__subchev {
    flex-shrink: 0;
    display: inline-flex;
    width: 10px;
    height: 10px;
    color: #98A2AB;
    transition: transform 0.22s var(--abz-ease);
}
.abz-acc__subchev svg { width: 100%; height: 100%; }
.abz-acc__group.is-open .abz-acc__subchev { transform: rotate(180deg); }
.abz-acc__group.is-open .abz-acc__subname { color: var(--abz-orange); }
.abz-acc__subpanel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.24s var(--abz-ease);
}
.abz-acc__group.is-open .abz-acc__subpanel { grid-template-rows: 1fr; }
.abz-acc__subinner { overflow: hidden; }
.abz-acc__kid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 15px;
    margin-inline-start: 34px;
    background: var(--abz-bg);
    border-inline-start: 2px solid var(--abz-line);
    font-size: 12px;
    font-weight: 500;
    color: var(--abz-text);
    text-decoration: none;
    transition: background 0.15s var(--abz-ease), border-color 0.15s var(--abz-ease), color 0.15s var(--abz-ease);
}
.abz-acc__kid small {
    font-size: 10px;
    color: #98A2AB;
    flex-shrink: 0;
}
.abz-acc__kid:hover {
    background: var(--abz-hover);
    border-inline-start-color: var(--abz-orange);
    color: var(--abz-orange);
}

/* --- سطح چهارم: آکاردئون تودرتوی دوم (اگر داده داشت) --- */
.abz-acc__kidgrp { background: var(--abz-bg); }
.abz-acc__kidhead {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 15px;
    margin-inline-start: 34px;
    background: var(--abz-bg);
    border: 0;
    border-inline-start: 2px solid var(--abz-line);
    cursor: pointer;
    font: inherit;
    text-align: start;
}
.abz-acc__kidhead > span {
    flex: 1;
    min-width: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--abz-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.abz-acc__kidhead > small { font-size: 10px; color: #98A2AB; flex-shrink: 0; }
.abz-acc__kidhead > i {
    display: inline-flex;
    width: 10px;
    height: 10px;
    color: #98A2AB;
    transition: transform 0.2s var(--abz-ease);
}
.abz-acc__kidhead > i svg { width: 100%; height: 100%; }
.abz-acc__kidgrp.is-open .abz-acc__kidhead > i { transform: rotate(180deg); color: var(--abz-orange); }
.abz-acc__kidgrp.is-open .abz-acc__kidhead > span { color: var(--abz-orange); }
.abz-acc__kidgrp.is-open .abz-acc__kidhead { border-inline-start-color: var(--abz-orange); }
.abz-acc__kidpanel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.22s var(--abz-ease);
}
.abz-acc__kidgrp.is-open .abz-acc__kidpanel { grid-template-rows: 1fr; }
.abz-acc__kidgrp .abz-acc__kid { margin-inline-start: 48px; }

.abz-acc__kid-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8.5px 15px;
    margin-inline-start: 34px;
    background: var(--abz-hover);
    border-inline-start: 2px solid var(--abz-orange);
    font-size: 11.5px;
    font-weight: 800;
    color: var(--abz-orange);
    text-decoration: none;
}
.abz-acc__kid-all i { display: inline-flex; width: 11px; height: 11px; }

/* --- برندهای محبوب موبایل — چیپ لوگوی رنگی --- */
.abz-mbrands-m { margin-top: 4px; }
.abz-mbrands-m__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}
.abz-mbrands-m__chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 9px 5px 7px;
    background: #FFFFFF;
    border: 1px solid var(--abz-line);
    border-radius: 11px;
    text-decoration: none;
    transition: border-color 0.18s var(--abz-ease), background 0.18s var(--abz-ease);
    /* v6.11.0 — خط رنگی پایین چیز بر اساس رنگ اصلی برند */
    box-shadow: inset 0 -3px 0 0 var(--bzc, #F47B20);
}
.abz-mbrands-m__chip:hover { border-color: var(--bzc, rgba(244, 123, 32, 0.5)); background: var(--abz-hover); }
.abz-mbrands-m__chip--all {
    justify-content: center;
    flex-direction: row;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--abz-orange);
    background: var(--abz-hover);
    border-color: rgba(244, 123, 32, 0.4);
}
.abz-mbrands-m__chip--all i { display: inline-flex; width: 12px; height: 12px; }
.abz-mbrands-m__chip--all i svg { width: 100%; height: 100%; }
.abz-mbrands-m__logo {
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.abz-mbrands-m__logo img {
    max-width: 64px;
    max-height: 26px;
    object-fit: contain;
}
.abz-mbrands-m__chip > span:not(.abz-mbrands-m__logo) {
    font-size: 10.5px;
    font-weight: 600;
    color: var(--abz-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* ---------------------------------------------------------------
   ۵) ریسپانسیو
   --------------------------------------------------------------- */

/* ≥992: ناوبری دیده می‌شود (بین لوگو و جستجو) */
@media (min-width: 992px) {
    .abz-nav { display: block; }
}

/* 992 تا 1199: ناوبری به ردیف دوم می‌رود (جستجو در ردیف اول می‌ماند) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .ry-header .ry-header-main {
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        column-gap: 14px;
        row-gap: 0;
        padding: 8px 0;
    }
    .ry-header .ry-branding { grid-area: 1 / 1; }
    .ry-header-main .abz-search { grid-area: 1 / 2; max-width: none; padding-inline: 16px; }
    .ry-header .ry-actions { grid-area: 1 / 3; }
    .abz-nav {
        grid-area: 2 / 1 / 3 / 4;
        border-top: 1px solid var(--abz-line-2);
        margin-top: 6px;
        padding: 4px 0 2px;
    }
    .abz-nav__list { gap: 0; }
    .abz-nav__link { padding: 8px 9px; font-size: 12.5px; }
    /* پنل مگامنو زیر کل هدر (شامل ردیف ناوبری) باز می‌شود */
}

/* <992: موبایل — ناوبری و جستجو از دراور/اورلی می‌آیند */
@media (max-width: 991.98px) {
    .abz-nav { display: none; }
    .ry-header-main .abz-search { display: none; }
    #page.ry-v5 .ry-header-main .ry-search-trigger { display: inline-flex; }
}

/* پنل مگامنو در عرض‌های مختلف */
@media (min-width: 992px) and (max-width: 1279.98px) {
    .abz-mmx { grid-template-columns: 246px 300px 1fr 224px; min-height: 430px; }
    .abz-mmx__kids { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
    .abz-mmx__banner-img { width: 78px; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* ستون بصری (بنر/برند) در این عرض جا نمی‌شود — پنل سه‌ستونه می‌ماند */
    .abz-mmx__side { display: none; }
    .abz-mmx { grid-template-columns: 236px 288px 1fr; }
}
@media (min-width: 992px) and (max-width: 1099.98px) {
    .abz-mmx { grid-template-columns: 216px 262px 1fr; min-height: 400px; }
    .abz-mmx__mainname { font-size: 13px; }
    .abz-mmx__sub, .abz-mmx__kid { font-size: 13px; }
}

/* موبایل: دراپ‌داون جستجو زیر فرم موبایل — جا نگرفتن عرض */
@media (max-width: 480px) {
    .abz-mbrands-m__grid { grid-template-columns: repeat(2, 1fr); }
}

/* کاهش حرکت */
@media (prefers-reduced-motion: reduce) {
    .abz-mega,
    .abz-mega.is-open,
    .abz-mmx__group.is-on,
    .abz-mmx__deep.is-on,
    .abz-fly,
    .abz-fly.is-on,
    .abz-nav__chev,
    .abz-mega__allcats i,
    .abz-mmx__thumb,
    .abz-mmx__thumb img,
    .abz-mmx__banner,
    .abz-mmx__banner-img,
    .abz-mmx__banner-cta,
    .abz-mmx__brand {
        transition: none;
        animation: none;
    }
}

/* =========================================================================
   v6.3.0 — پوستهٔ تیرهٔ مگامنو (Dark Workshop Skin)
   -------------------------------------------------------------------------
   درخواست کاربر: «بک‌گراند خیلی زیبا مثل عکس با کاور، از رنگ سفید دربیاد،
   همسان با تم رنگی سایت، خوانا و زیباتر». طرح و ترکیب ستون‌ها دست‌نخورده؛
   فقط لایهٔ رنگی روی همان ساختار:
     • پس‌زمینه: عکس کارگاه تیرهٔ باندل‌شده (assets/img/megamenu/) زیر
       پوشش گرادیان تیرهٔ ۹۳٪ + هالهٔ کهربایی — «عکس زیر کاور پنهان»
     • بازتعریف توکن‌های abz-* در محدودهٔ پنل → متن گرم روشن، خطوط شیشه‌ای
     • سطح‌های تصویر (thumb/chip/لوگو/محصول) سفید می‌مانند تا عکس‌ها
       واقعی و خوانا دیده شوند (الگوی donyayesazha)
     • ریل محصولات زیردسته (AJAX) + اسکرول سفارشی فهرست‌های بلند
   ========================================================================= */

/* ---------- ۰) بازتعریف توکن‌ها در محدودهٔ پنل ---------- */
#page.ry-v5 .abz-mega__panel,
#page.ry-v5 .abz-mega__panel .abz-fly {
    --abz-bg: rgba(255, 255, 255, 0.035);
    --abz-text: #F5F0EA;
    --abz-text-2: #A9A29A;
    --abz-line: rgba(255, 255, 255, 0.095);
    --abz-line-2: rgba(255, 255, 255, 0.06);
    --abz-hover: rgba(244, 123, 32, 0.12);
    --abz-orange-dk: #FFB066; /* متن نارنجی روی زمینهٔ تیره */
    --abz-orange-soft: rgba(244, 123, 32, 0.14);
}

/* ---------- ۱) پنل: عکس + کاور ---------- */
/* v6.4 — کاور روشن‌تر شد (درخواست کاربر: «عکس واضح‌تر دیده شود») + خود عکس ۳۰٪
   روشن‌تر شد؛ تعادل خوانایی حفظ شده: متن روشن روی زمینهٔ تیره. */
#page.ry-v5 .abz-mega__panel {
    background:
        linear-gradient(180deg, rgba(26, 21, 18, 0.80) 0%, rgba(23, 19, 16, 0.86) 58%, rgba(19, 15, 12, 0.92) 100%),
        radial-gradient(1050px 520px at 86% -8%, rgba(244, 123, 32, 0.17), transparent 62%),
        radial-gradient(700px 380px at 4% 108%, rgba(124, 45, 18, 0.22), transparent 64%),
        url('../img/megamenu/bg-workshop-dark.jpg') center 24% / 920px auto repeat-x,
        #1A1512;
    border-top-color: rgba(244, 123, 32, 0.28);
    border-bottom: 1px solid rgba(0, 0, 0, 0.55);
    box-shadow: 0 44px 80px -24px rgba(8, 5, 3, 0.72), 0 10px 30px rgba(8, 5, 3, 0.3);
    color: #F5F0EA;
}

/* ---------- ۲) ستون ۱ ---------- */
#page.ry-v5 .abz-mmx__col1 {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0%, rgba(255, 255, 255, 0.012) 100%);
    border-inline-end-color: var(--abz-line);
}
#page.ry-v5 .abz-mmx__coltitle { color: #8E867D; }
#page.ry-v5 .abz-mmx__mains {
    max-height: 448px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(244, 123, 32, 0.4) transparent;
    padding-inline-end: 3px;
}
#page.ry-v5 .abz-mmx__mains::-webkit-scrollbar { width: 4px; }
#page.ry-v5 .abz-mmx__mains::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.16); border-radius: 4px; }
#page.ry-v5 .abz-mmx__mains::-webkit-scrollbar-thumb:hover { background: rgba(244, 123, 32, 0.65); }
#page.ry-v5 .abz-mmx__main:hover { background: rgba(255, 255, 255, 0.05); }
#page.ry-v5 .abz-mmx__main.is-on {
    background: linear-gradient(90deg, rgba(244, 123, 32, 0.16), rgba(244, 123, 32, 0.05) 70%, transparent);
}
#page.ry-v5 .abz-mmx__ico {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.13);
    color: #C9C2B9;
}
#page.ry-v5 .abz-mmx__thumb {
    background: #FFFFFF; /* عکس واقعی روی سطح سفید */
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 6px 16px -8px rgba(0, 0, 0, 0.65);
}
#page.ry-v5 .abz-mmx__chev { color: #7E766D; }
#page.ry-v5 .abz-mmx__main:hover .abz-mmx__thumb { box-shadow: 0 10px 20px -8px rgba(0, 0, 0, 0.7); }
#page.ry-v5 .abz-mmx__main.is-on .abz-mmx__thumb {
    border-color: rgba(244, 123, 32, 0.8);
    box-shadow: 0 0 0 2.5px rgba(244, 123, 32, 0.22), 0 10px 22px -8px rgba(0, 0, 0, 0.7);
}

/* ---------- ۳) ستون ۲ ---------- */
#page.ry-v5 .abz-mmx__col2 { border-inline-end-color: var(--abz-line); }
#page.ry-v5 .abz-mmx__subs {
    max-height: 372px;
    scrollbar-color: rgba(244, 123, 32, 0.4) transparent;
}
#page.ry-v5 .abz-mmx__subs::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.16); }
#page.ry-v5 .abz-mmx__subs::-webkit-scrollbar-thumb:hover { background: rgba(244, 123, 32, 0.65); }
#page.ry-v5 .abz-mmx__sub { color: #D9D2C9; }
#page.ry-v5 .abz-mmx__sub:hover { color: #FFFFFF; }
#page.ry-v5 .abz-mmx__subcount,
#page.ry-v5 .abz-mmx__sub .abz-mmx__subcount { color: #7E766D; }
#page.ry-v5 .abz-mmx__sub.is-on { color: #FFB066; }
#page.ry-v5 .abz-mmx__dot { background: rgba(255, 255, 255, 0.28); }
#page.ry-v5 .abz-mmx__chip {
    background: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 5px 14px -8px rgba(0, 0, 0, 0.7);
}
#page.ry-v5 .abz-mmx__ghead h3 { color: #FFFFFF; letter-spacing: -0.01em; }

/* ---------- ۴) ستون ۳: زیرزیردسته + ریل محصولات ---------- */
#page.ry-v5 .abz-mmx__kids {
    max-height: 268px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(244, 123, 32, 0.4) transparent;
    padding-inline-end: 4px;
}
#page.ry-v5 .abz-mmx__kids::-webkit-scrollbar { width: 4px; }
#page.ry-v5 .abz-mmx__kids::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.16); border-radius: 4px; }
#page.ry-v5 .abz-mmx__kids::-webkit-scrollbar-thumb:hover { background: rgba(244, 123, 32, 0.65); }
#page.ry-v5 .abz-mmx__kid { color: #D9D2C9; }
#page.ry-v5 .abz-mmx__kid:hover { color: #FFFFFF; }
#page.ry-v5 .abz-mmx__kid > small { color: #7E766D; }
#page.ry-v5 .abz-mmx__dhead h4 { color: #FFFFFF; }
#page.ry-v5 .abz-mmx__ghost i { color: #5B544C; }
#page.ry-v5 .abz-mmx__ghost p { color: #8E867D; }

/* ریل محصولات زیردسته (hover) — کارت‌های کوچک با عکس سفید */
#page.ry-v5 .abz-mmx__prods {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.12);
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-height: 0;
}
#page.ry-v5 .abz-mmx__prods[hidden] { display: none; }
#page.ry-v5 .abz-mmx__phead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
#page.ry-v5 .abz-mmx__ptitle {
    margin: 0;
    font-size: 12.5px;
    font-weight: 800;
    color: #FFFFFF;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#page.ry-v5 .abz-mmx__pall {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 700;
    color: #FFB066;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s;
}
#page.ry-v5 .abz-mmx__pall:hover { color: #FF8A24; }
#page.ry-v5 .abz-mmx__pall i { display: inline-flex; width: 12px; height: 12px; }
#page.ry-v5 .abz-mmx__pall i svg { width: 100%; height: 100%; }
#page.ry-v5 .abz-mmx__prow {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}
#page.ry-v5 .abz-mmx__prod {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 7px 6px 8px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    text-decoration: none;
    transition: background 0.16s var(--abz-ease), border-color 0.16s, transform 0.18s var(--abz-ease);
}
#page.ry-v5 .abz-mmx__prod:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(244, 123, 32, 0.5);
    transform: translateY(-2px);
}
#page.ry-v5 .abz-mmx__prod-img {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 9px;
    background: #FFFFFF; /* عکس محصول روی سفید — خوانا و واقعی */
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#page.ry-v5 .abz-mmx__prod-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 4px;
    transition: transform 0.22s var(--abz-ease);
}
#page.ry-v5 .abz-mmx__prod:hover .abz-mmx__prod-img img { transform: scale(1.07); }
#page.ry-v5 .abz-mmx__prod-img--empty::after {
    content: '⚒';
    font-size: 22px;
    color: #D8D2C9;
}
#page.ry-v5 .abz-mmx__prod-off {
    position: absolute;
    top: 4px;
    inset-inline-start: 4px;
    padding: 1.5px 5px;
    border-radius: 7px;
    background: #F4511E;
    color: #FFFFFF;
    font-size: 9px;
    font-weight: 800;
    line-height: 1.5;
    direction: rtl;
}
#page.ry-v5 .abz-mmx__prod-name {
    font-size: 10.5px;
    font-weight: 600;
    color: #E4DED5;
    line-height: 1.65;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 34px;
}
#page.ry-v5 .abz-mmx__prod:hover .abz-mmx__prod-name { color: #FFFFFF; }
#page.ry-v5 .abz-mmx__prod-price {
    display: flex;
    flex-direction: column;
    gap: 1px;
    font-style: normal;
}
#page.ry-v5 .abz-mmx__prod-price ins {
    font-size: 10.5px;
    font-weight: 800;
    color: #FFB066;
    text-decoration: none;
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#page.ry-v5 .abz-mmx__prod-price del {
    font-size: 9px;
    color: #8E867D;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* اسکلت لودینگ */
#page.ry-v5 .abz-mmx__pskel {
    aspect-ratio: 1 / 1.45;
    border-radius: 12px;
    background: linear-gradient(100deg, rgba(255,255,255,0.04) 35%, rgba(255,255,255,0.09) 50%, rgba(255,255,255,0.04) 65%);
    background-size: 220% 100%;
    animation: abzSkel 1.15s linear infinite;
}
@keyframes abzSkel {
    from { background-position: 200% 0; }
    to { background-position: -60% 0; }
}
@media (prefers-reduced-motion: reduce) {
    #page.ry-v5 .abz-mmx__pskel { animation: none; }
}

/* ---------- ۵) ستون ۴: بنر + برندها ---------- */
#page.ry-v5 .abz-mmx__side {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.015) 100%);
    border-inline-start-color: var(--abz-line);
}
#page.ry-v5 .abz-mmx__brands-title { color: #8E867D; }
#page.ry-v5 .abz-mmx__brand {
    background: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.85);
    box-shadow: 0 8px 18px -10px rgba(0, 0, 0, 0.55);
}
#page.ry-v5 .abz-mmx__brand--all {
    background: rgba(244, 123, 32, 0.1);
    border-color: rgba(244, 123, 32, 0.45);
}
#page.ry-v5 .abz-mmx__banner {
    background: radial-gradient(135% 130% at 88% 6%, #2A231D 0%, #1A1410 55%, #120D0A 100%);
    box-shadow: inset 0 0 0 1px rgba(244, 123, 32, 0.22), 0 16px 30px -18px rgba(0, 0, 0, 0.8);
}
#page.ry-v5 .abz-mmx__banner:hover {
    box-shadow: inset 0 0 0 1px rgba(244, 123, 32, 0.4), 0 20px 36px -18px rgba(0, 0, 0, 0.85);
}
#page.ry-v5 .abz-mmx__banner-off { color: #C9C2B9; }

/* ---------- ۶) نوار پرطرفدار + فوتر پنل ---------- */
#page.ry-v5 .abz-mmx-strip {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(0, 0, 0, 0.16) 100%);
    border-top-color: rgba(255, 255, 255, 0.08);
}
#page.ry-v5 .abz-mmx-strip__label { color: #FFFFFF; }
#page.ry-v5 .abz-mmx-strip__tile {
    background: rgba(255, 255, 255, 0.045);
    border-color: rgba(255, 255, 255, 0.09);
}
#page.ry-v5 .abz-mmx-strip__tile:hover { background: rgba(255, 255, 255, 0.08); }
#page.ry-v5 .abz-mmx-strip__img {
    background: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: 0 8px 18px -8px rgba(0, 0, 0, 0.6);
}
#page.ry-v5 .abz-mmx-strip__name { color: #E4DED5; }
#page.ry-v5 .abz-mmx-strip__count { background: rgba(244, 123, 32, 0.85); }
#page.ry-v5 .abz-mega__foot {
    background: rgba(0, 0, 0, 0.28);
    border-top-color: rgba(255, 255, 255, 0.08);
}
#page.ry-v5 .abz-mega__allbrands { color: #A9A29A; }

/* ---------- ۷) Flyout سطح ۴ ---------- */
#page.ry-v5 .abz-fly {
    background: #241E19;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 26px 50px -16px rgba(0, 0, 0, 0.8), 0 4px 14px rgba(0, 0, 0, 0.4);
}
#page.ry-v5 .abz-fly__list a { color: #D9D2C9; }
#page.ry-v5 .abz-fly__list a:hover { color: #FFFFFF; }
#page.ry-v5 .abz-fly__list a > small { color: #7E766D; }

/* ---------- ۸) موبایل: پدینگ/لمس بهتر در دراور ---------- */
@media (max-width: 991.98px) {
    .abz-acc__head { min-height: 52px; }
    .abz-acc__subhead { min-height: 48px; }
    .abz-acc__kid { min-height: 44px; }
    .abz-mbrands-m__chip { padding: 10px 5px 9px; }
    .abz-mbrands-m__grid { gap: 8px; }
}
/* تبلت ۶۴۰-۹۹۱: گرید برند ۳تایی سرجای خود می‌ماند؛ در ناوگیشن لمسی
   ریل محصولات غیرفعال است (اولین تپ = سوئیچ، دومین تپ = ناوبری). */


/* =========================================================================
   v6.4.0 — پوستهٔ تیرهٔ دراور موبایل (Mobile Dark Workshop Skin)
   -------------------------------------------------------------------------
   درخواست کاربر: «منوی موبایلی را مثل donyayesazha درست کن که مگامنو را
   نشان بدهد، بک‌گراند دقیقاً مثل منوی دسکتاپ، کامل ریسپانسیو».
     • پس‌زمینهٔ دراور: همان عکس کارگاه + همان کاور/هالهٔ پنل دسکتاپ
     • ساختار الگوی donyayesazha موبایل: سربرگ، جستجوی سفید، کاشی‌های
       صفحه، نوار تصویری پرطرفدار، آکاردئون دسته‌ها با عکس، برندها، خدمات
     • سطح‌های تصویر سفید می‌مانند (عکس واقعی خوانا — الگوی دسکتاپ)
     • هدف لمسی ≥ 44px و فونت 16px ورودی (ضد زوم iOS)
   ========================================================================= */

/* ---------- ۰) توکن‌های تیره در محدودهٔ دراور ---------- */
#page.ry-v5 .ry-mobile-panel,
#page.ry-v5 .ry-mobile-panel .abz-fly {
    --abz-bg: rgba(255, 255, 255, 0.045);
    --abz-text: #F5F0EA;
    --abz-text-2: #A9A29A;
    --abz-line: rgba(255, 255, 255, 0.10);
    --abz-line-2: rgba(255, 255, 255, 0.065);
    --abz-hover: rgba(244, 123, 32, 0.13);
    --abz-orange-dk: #FFB066;
    --abz-orange-soft: rgba(244, 123, 32, 0.14);
}

/* ---------- ۱) بدنهٔ دراور: عکس + کاور (هم‌خانوادهٔ پنل دسکتاپ) ---------- */
#page.ry-v5 .ry-mobile-panel {
    background:
        linear-gradient(180deg, rgba(26, 21, 18, 0.88) 0%, rgba(23, 19, 16, 0.92) 55%, rgba(18, 14, 11, 0.96) 100%),
        radial-gradient(640px 300px at 88% -6%, rgba(244, 123, 32, 0.17), transparent 62%),
        radial-gradient(520px 320px at 0% 106%, rgba(124, 45, 18, 0.22), transparent 64%),
        url('../img/megamenu/bg-workshop-dark.jpg') center 18% / 640px auto repeat-x,
        #1A1512 !important; /* باید بر !important قدیمی بیرون‌برد شود */
    color: #F5F0EA;
    box-shadow: -30px 0 70px -20px rgba(5, 3, 2, 0.8);
}
/* اورلی پشت دراور کمی تیره‌تر */
#page.ry-v5 .ry-mobile-overlay {
    background: rgba(12, 9, 6, 0.62);
    backdrop-filter: blur(4px);
}

/* ---------- ۲) سربرگ دراور ---------- */
#page.ry-v5 .ry-mobile-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    padding: 14px 16px calc(14px);
}
#page.ry-v5 .ry-mobile-header .ry-branding-title,
#page.ry-v5 .ry-mobile-header .custom-logo-link { color: #fff; }
#page.ry-v5 .ry-mobile-header .site-logo img { border-radius: 8px; }
#page.ry-v5 .ry-mobile-close {
    background: rgba(244, 123, 32, 0.14);
    border-color: rgba(244, 123, 32, 0.4);
    color: #FFB066;
}
#page.ry-v5 .ry-mobile-close:active {
    background: #F47B20;
    border-color: #F47B20;
    color: #fff;
}

/* ---------- ۳) جستجو: قرص سفید (الگوی donyayesazha) ---------- */
#page.ry-v5 .ry-mobile-search {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding: 12px 14px;
}
#page.ry-v5 .ry-mobile-search form {
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.55);
}
#page.ry-v5 .ry-mobile-search input { color: #1C1917; font-size: 16px; } /* ضد زوم iOS */
#page.ry-v5 .ry-mobile-search input::placeholder { color: #A8A29E; }
#page.ry-v5 .ry-mobile-search button {
    background: linear-gradient(150deg, #F47B20, #E8630C);
    color: #fff;
}

/* ---------- ۴) اسکرول ناوبری ---------- */
#page.ry-v5 .ry-mobile-nav {
    padding: 16px 14px calc(30px + env(safe-area-inset-bottom, 0px));
    scrollbar-width: thin;
    scrollbar-color: rgba(244, 123, 32, 0.4) transparent;
}
#page.ry-v5 .ry-mobile-nav::-webkit-scrollbar { width: 4px; }
#page.ry-v5 .ry-mobile-nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.16); border-radius: 4px; }
#page.ry-v5 .ry-mobile-nav::-webkit-scrollbar-thumb:hover { background: rgba(244, 123, 32, 0.6); }

/* ---------- ۵) کاشی‌های صفحه (الگوی dsk-mobile-pages) ---------- */
#page.ry-v5 .rmm-pages {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin-bottom: 6px;
}
#page.ry-v5 .rmm-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 78px;
    padding: 10px 6px 9px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.09);
    color: #E9E2D9;
    text-decoration: none;
    transition: background 0.16s var(--abz-ease, ease), border-color 0.16s, transform 0.16s;
}
#page.ry-v5 .rmm-page i {
    font-size: 17px;
    color: #FFB066;
    line-height: 1;
}
#page.ry-v5 .rmm-page span {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
#page.ry-v5 .rmm-page:active { transform: scale(0.97); }
#page.ry-v5 .rmm-page.is-current {
    background: linear-gradient(160deg, rgba(244, 123, 32, 0.22), rgba(244, 123, 32, 0.09));
    border-color: rgba(244, 123, 32, 0.55);
    color: #FFFFFF;
}
#page.ry-v5 .rmm-page.is-current i { color: #FF9A3D; }
/* اگر مدیر منو اختصاص داده باشد (wp_nav_menu) — ردیف‌های تیره */
#page.ry-v5 .ry-mobile-nav > ul > li > a,
#page.ry-v5 .rmm-link {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.09);
    color: #F5F0EA;
}
#page.ry-v5 .ry-mobile-nav > ul > li > a > i:first-child,
#page.ry-v5 .rmm-link > i:first-child {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.12);
    color: #FFB066;
}
#page.ry-v5 .ry-mobile-nav a:hover,
#page.ry-v5 .ry-mobile-nav a:active,
#page.ry-v5 .rmm-link:hover {
    background: rgba(244, 123, 32, 0.14);
    border-color: rgba(244, 123, 32, 0.45);
    color: #FFFFFF;
}
#page.ry-v5 .ry-mobile-nav a:hover > i:first-child,
#page.ry-v5 .rmm-link:hover > i:first-child {
    background: #F47B20;
    border-color: #F47B20;
    color: #fff;
}

/* ---------- ۶) برچسب دسته‌بندی‌ها + نوار پرطرفدار ---------- */
#page.ry-v5 .abz-acc { margin-top: 20px; }
#page.ry-v5 .abz-acc__label {
    color: #A9A29A;
    font-size: 11.5px;
}
#page.ry-v5 .abz-acc__label i { color: #FFB066; }
/* نوار پرطرفدار — همان نوار دسکتاپ در حالت اسکرول افقی */
#page.ry-v5 .abz-acc__pop {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    padding: 2px 2px 10px;
    margin: 0 -2px 12px;
    scrollbar-width: none;
}
#page.ry-v5 .abz-acc__pop::-webkit-scrollbar { display: none; }
#page.ry-v5 .abz-pop-m {
    flex: 0 0 auto;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    width: 76px;
    text-decoration: none;
}
#page.ry-v5 .abz-pop-m__img {
    width: 60px;
    height: 60px;
    border-radius: 14px;
    background: #FFFFFF; /* عکس واقعی روی سفید — خوانا */
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: 0 8px 18px -8px rgba(0, 0, 0, 0.65);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: transform 0.18s var(--abz-ease, ease), box-shadow 0.18s;
}
#page.ry-v5 .abz-pop-m__img img { width: 100%; height: 100%; object-fit: cover; }
#page.ry-v5 .abz-pop-m:active .abz-pop-m__img {
    transform: scale(0.95);
    box-shadow: 0 0 0 2.5px rgba(244, 123, 32, 0.3), 0 8px 18px -8px rgba(0, 0, 0, 0.65);
}
#page.ry-v5 .abz-pop-m__name {
    font-size: 10.5px;
    font-weight: 700;
    color: #E4DED5;
    line-height: 1.5;
    text-align: center;
    max-width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 30px;
}

/* ---------- ۷) آکاردئون دسته‌ها — سطح ۱ ---------- */
#page.ry-v5 .abz-acc__item {
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    margin-bottom: 8px;
}
#page.ry-v5 .abz-acc__item.is-open {
    border-color: rgba(244, 123, 32, 0.5);
    background: rgba(255, 255, 255, 0.055);
    box-shadow: 0 14px 28px -14px rgba(0, 0, 0, 0.65);
}
#page.ry-v5 .abz-acc__name { color: #F5F0EA; }
#page.ry-v5 .abz-acc__count {
    color: #FFD9B0;
    background: rgba(244, 123, 32, 0.16);
    border: 1px solid rgba(244, 123, 32, 0.28);
}
#page.ry-v5 .abz-acc__chev,
#page.ry-v5 .abz-acc__subchev,
#page.ry-v5 .abz-acc__kidhead > i { color: #8E867D; }
#page.ry-v5 .abz-acc__ico {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #FFB066;
}
#page.ry-v5 .abz-acc__thumb {
    background: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 6px 14px -7px rgba(0, 0, 0, 0.65);
}
#page.ry-v5 .abz-acc__thumb--main {
    background: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 16px -8px rgba(0, 0, 0, 0.7);
}
#page.ry-v5 .abz-acc__all {
    color: #FFB066;
    background: rgba(244, 123, 32, 0.13);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* ---------- ۸) سطح ۲ و ۳ ---------- */
#page.ry-v5 .abz-acc__sub { color: #D9D2C9; }
#page.ry-v5 .abz-acc__sub:hover { color: #FFFFFF; background: rgba(255, 255, 255, 0.05); }
#page.ry-v5 .abz-acc__sub small,
#page.ry-v5 .abz-acc__subcount,
#page.ry-v5 .abz-acc__kid small,
#page.ry-v5 .abz-acc__kidhead > small { color: #8E867D; }
#page.ry-v5 .abz-acc__subname { color: #E4DED5; }
#page.ry-v5 .abz-acc__kid { color: #D9D2C9; border-inline-start-color: rgba(255, 255, 255, 0.14); }
#page.ry-v5 .abz-acc__kid:hover {
    background: rgba(255, 255, 255, 0.055);
    border-inline-start-color: #F47B20;
    color: #FFB066;
}
#page.ry-v5 .abz-acc__kidgrp,
#page.ry-v5 .abz-acc__kidhead { background: transparent; }
#page.ry-v5 .abz-acc__kid-all { color: #FFB066; }
#page.ry-v5 .abz-acc__kid-all:hover { color: #FF8A24; }

/* ---------- ۹) برندها ---------- */
#page.ry-v5 .abz-mbrands-m__chip {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
}
#page.ry-v5 .abz-mbrands-m__chip span:not(.abz-mbrands-m__logo) { color: #D9D2C9; }
#page.ry-v5 .abz-mbrands-m__logo {
    background: #FFFFFF;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.25);
}
#page.ry-v5 .abz-mbrands-m__chip--all {
    background: rgba(244, 123, 32, 0.12);
    border-color: rgba(244, 123, 32, 0.4);
    color: #FFB066;
}

/* ---------- ۱۰) خدمات (۲×۲ شیشه‌ای) ---------- */
#page.ry-v5 .rmm-service {
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
}
#page.ry-v5 .rmm-service:hover {
    background: rgba(244, 123, 32, 0.12);
    border-color: rgba(244, 123, 32, 0.4);
}
#page.ry-v5 .rmm-service i { color: #FFB066; }
#page.ry-v5 .rmm-service span { color: #F5F0EA; }
#page.ry-v5 .rmm-service small { color: #A9A29A; }

/* ---------- ۱۱) فوتر دراور: تلفن + حساب ---------- */
#page.ry-v5 .ry-mobile-footer {
    background: rgba(10, 7, 5, 0.55);
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(10px);
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
}
#page.ry-v5 .rmm-footer-btn {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #F5F0EA;
    min-height: 48px;
}
#page.ry-v5 .rmm-footer-btn.primary {
    background: linear-gradient(150deg, #F47B20, #E8630C);
    border-color: transparent;
    color: #FFFFFF;
    box-shadow: 0 12px 26px -10px rgba(244, 123, 32, 0.55);
}
#page.ry-v5 .rmm-footer-btn.primary i { color: #FFFFFF; }

/* ---------- ۱۲) لمس + ریسپانسیو داخل دراور ---------- */
@media (max-width: 991.98px) {
    #page.ry-v5 .abz-acc__head { min-height: 54px; }
    #page.ry-v5 .abz-acc__subhead { min-height: 48px; }
    #page.ry-v5 .abz-acc__kid,
    #page.ry-v5 .abz-acc__kidhead { min-height: 44px; }
    #page.ry-v5 .rmm-page { min-height: 80px; }
}
@media (max-width: 360px) {
    #page.ry-v5 .rmm-pages { gap: 7px; }
    #page.ry-v5 .rmm-page { min-height: 72px; }
    #page.ry-v5 .rmm-page span { font-size: 10.5px; }
    #page.ry-v5 .abz-pop-m { width: 68px; }
    #page.ry-v5 .abz-pop-m__img { width: 54px; height: 54px; }
}
@media (prefers-reduced-motion: reduce) {
    #page.ry-v5 .ry-mobile-panel,
    #page.ry-v5 .rmm-page,
    #page.ry-v5 .abz-pop-m__img { transition: none; }
}