/* Base reset — ID selector beats old .site-header !important rules */
            #site-header {
              position: sticky;
              top: 0;
              left: 0;
              right: 0;
              padding: 0 !important;
              margin: 0;
              border-radius: 0 !important;
              overflow: visible !important;
              /* خودِ هدر شفاف می‌ماند؛ شیشه‌ی مات (frosted glass) روی .sh-bar اعمال می‌شود
                 تا backdrop-filter یک containing block برای #mobile-menu-overlayِ fixed نسازد */
              background: transparent !important;
              border-bottom: none; /* خط نازک زیرین به .sh-bar منتقل شد تا با گردیِ گوشه‌ها هماهنگ خم شود */
              box-shadow: none !important;
              transition: box-shadow 0.25s ease, border-color 0.25s ease !important;
              z-index: 1000;
              min-height: 0 !important;
            }
            #site-header.scrolled {
              box-shadow: 0 2px 20px rgba(0,0,0,0.08) !important;
              border-bottom-color: transparent;
              background: transparent !important; /* بک‌گراند شیشه‌ای روی .sh-bar است، نه اینجا */
            }

            /* ---- Layout bar ----
               بک‌گراند شیشه‌ای مات (frosted glass) اینجاست، نه روی #site-header.
               علت: #mobile-menu-overlay با position:fixed خواهرِ همین .sh-bar است؛
               اگر backdrop-filter روی #site-header بود یک containing block می‌ساخت و
               ارتفاع منوی موبایل به هدر محدود می‌شد. روی .sh-bar این مشکل پیش نمی‌آید
               چون منوی موبایل فرزندِ .sh-bar نیست. */
            .sh-bar {
              width: 100%;
              background: rgba(255, 255, 255, 0.72);
              -webkit-backdrop-filter: blur(18px) saturate(180%);
              backdrop-filter: blur(18px) saturate(180%);
              border-radius: 0 0 16px 16px; /* گوشه‌های پایینِ هدر: گردیِ ملو، ریز و زیبا */
              box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05); /* خط نازک زیر هدر که هم‌راستا با گردیِ گوشه‌ها خم می‌شود */
              transition: background 0.25s ease;
            }
            #site-header.scrolled .sh-bar {
              background: rgba(255, 255, 255, 0.85);
            }
            .sh-inner {
              max-width: 1320px;
              margin: 0 auto;
              padding: 0 32px;
              height: 72px;
              display: flex;
              align-items: center;
              gap: 8px;
              direction: rtl;
              position: relative;
            }

            /* ---- Logo ---- */
            .sh-logo {
              display: inline-flex;
              align-items: center;
              flex-shrink: 0;
              text-decoration: none;
              margin-left: 24px;
            }
            .sh-logo img {
              height: 52px;
              width: auto;
              display: block;
              object-fit: contain;
            }

            /* ---- Desktop Nav ---- */
            .sh-nav {
              display: flex;
              align-items: center;
              gap: 2px;
              flex: 1;
            }
            .sh-nav__item {
              position: relative;
            }
            .sh-nav__link {
              display: inline-flex;
              align-items: center;
              gap: 4px;
              padding: 8px 13px;
              color: #334155;
              text-decoration: none;
              font-size: 0.875rem;
              font-weight: 500;
              border-radius: 8px;
              border: none;
              background: none;
              cursor: pointer;
              font-family: inherit;
              white-space: nowrap;
              transition: color 0.15s ease, background 0.15s ease;
              line-height: 1;
            }
            .sh-nav__link:hover {
              color: #c44569;
              background: rgba(196,69,105,0.07);
            }
            .sh-nav__link.sh-nav--active {
              color: #c44569;
              background: rgba(196,69,105,0.07);
            }
            .sh-chevron {
              width: 14px;
              height: 14px;
              flex-shrink: 0;
              opacity: 0.55;
              transition: transform 0.2s ease;
            }
            .sh-nav__item:hover .sh-chevron,
            .sh-nav__item:focus-within .sh-chevron {
              transform: rotate(180deg);
              opacity: 0.8;
            }

            /* ---- Mega Menu ---- */
            .sh-mega {
              position: absolute;
              top: calc(100% + 14px);
              right: 0;
              min-width: 540px;
              max-width: 680px;
              background: #fff;
              border: 1px solid rgba(0,0,0,0.07);
              border-radius: 16px;
              box-shadow: 0 16px 48px rgba(0,0,0,0.11), 0 4px 12px rgba(0,0,0,0.05);
              padding: 24px;
              opacity: 0;
              visibility: hidden;
              transform: translateY(-6px);
              transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
              z-index: 200;
              pointer-events: none;
              direction: rtl;
            }
            .sh-nav__item:hover .sh-mega,
            .sh-nav__item:focus-within .sh-mega {
              opacity: 1;
              visibility: visible;
              transform: translateY(0);
              pointer-events: auto;
            }
            .sh-mega__grid {
              display: grid;
              grid-template-columns: repeat(2, 1fr);
              gap: 0 32px;
            }
            .sh-mega__cat {
              margin-bottom: 18px;
            }
            .sh-mega__cat-name {
              font-size: 0.8125rem;
              font-weight: 700;
              color: #c44569;
              padding-bottom: 6px;
              margin-bottom: 6px;
              border-bottom: 1px solid rgba(196,69,105,0.12);
            }
            .sh-mega__cat-name a {
              color: inherit;
              text-decoration: none;
            }
            .sh-mega__cat-name a:hover { text-decoration: underline; }
            .sh-mega__sub {
              list-style: none;
              margin: 0;
              padding: 0;
            }
            .sh-mega__sub li + li { margin-top: 2px; }
            .sh-mega__sub a {
              display: block;
              padding: 4px 0;
              font-size: 0.8125rem;
              color: #64748b;
              text-decoration: none;
              transition: color 0.12s;
            }
            .sh-mega__sub a:hover { color: #c44569; }
            .sh-mega__all-link {
              display: flex;
              align-items: center;
              justify-content: center;
              gap: 6px;
              margin-top: 18px;
              padding: 10px;
              background: rgba(196,69,105,0.06);
              color: #c44569;
              font-size: 0.875rem;
              font-weight: 600;
              text-decoration: none;
              border-radius: 10px;
              transition: background 0.15s;
              border-top: 1px solid rgba(196,69,105,0.08);
            }
            .sh-mega__all-link:hover { background: rgba(196,69,105,0.12); }

            /* ---- Spacer ---- */
            .sh-spacer { flex: 1; }

            /* ---- Action Buttons ---- */
            .sh-actions {
              display: flex;
              align-items: center;
              gap: 4px;
              flex-shrink: 0;
            }
            .sh-action-btn {
              display: inline-flex;
              align-items: center;
              justify-content: center;
              width: 40px;
              height: 40px;
              border-radius: 10px;
              color: #64748b;
              background: none;
              border: none;
              cursor: pointer;
              text-decoration: none;
              transition: color 0.15s, background 0.15s;
              position: relative;
              flex-shrink: 0;
              -webkit-tap-highlight-color: transparent;
            }
            .sh-action-btn:hover {
              color: #c44569;
              background: rgba(196,69,105,0.07);
            }
            .sh-action-btn svg {
              width: 20px;
              height: 20px;
              flex-shrink: 0;
            }
            .sh-action-badge {
              position: absolute;
              top: 3px;
              left: 3px;
              background: #c44569;
              color: #fff;
              font-size: 9px;
              font-weight: 700;
              border-radius: 8px;
              min-width: 16px;
              height: 16px;
              display: none;
              align-items: center;
              justify-content: center;
              padding: 0 4px;
              line-height: 1;
              border: 1.5px solid #fff;
            }
            .sh-action-badge:not(:empty) { display: flex; }

            /* ---- Cart Button ---- */
            .sh-cart-btn {
              display: inline-flex;
              align-items: center;
              gap: 7px;
              padding: 9px 16px;
              background: #c44569;
              color: #fff;
              border: none;
              border-radius: 10px;
              font-size: 0.875rem;
              font-weight: 600;
              cursor: pointer;
              position: relative;
              transition: background 0.15s, box-shadow 0.15s, transform 0.1s;
              font-family: inherit;
              flex-shrink: 0;
              box-shadow: 0 2px 10px rgba(196,69,105,0.28);
              -webkit-tap-highlight-color: transparent;
              text-decoration: none;
            }
            .sh-cart-btn:hover {
              background: #a8304f;
              box-shadow: 0 4px 14px rgba(196,69,105,0.38);
              transform: translateY(-1px);
            }
            .sh-cart-btn:active { transform: translateY(0); }
            .sh-cart-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
            .sh-cart-count {
              background: rgba(255,255,255,0.22);
              color: #fff;
              font-size: 11px;
              font-weight: 700;
              border-radius: 6px;
              min-width: 20px;
              height: 20px;
              display: none;
              align-items: center;
              justify-content: center;
              padding: 0 5px;
              line-height: 1;
              border: 1.5px solid rgba(255,255,255,0.35);
            }
            .sh-cart-count:not(:empty) { display: flex; }

            /* ---- Mobile right group (hamburger + resellers) ---- */
            .sh-mobile-right {
              display: none; /* hidden on desktop */
              align-items: center;
              gap: 6px;
              flex-shrink: 0;
            }

            /* ---- Mobile Hamburger ---- */
            .sh-hamburger {
              display: none;
              align-items: center;
              justify-content: center;
              width: 40px;
              height: 40px;
              min-width: 40px;
              border-radius: 10px;
              background: rgba(196,69,105,0.09);
              border: none;
              cursor: pointer;
              color: #c44569;
              transition: background 0.15s;
              flex-shrink: 0;
              -webkit-tap-highlight-color: transparent;
              margin-left: 8px;
            }
            .sh-hamburger:hover { background: rgba(196,69,105,0.15); }
            .sh-hamburger svg { width: 20px; height: 20px; }

            /* ---- Drawer Panel ---- */
            .sh-drawer__panel {
              display: flex;
              flex-direction: column;
            }
            .sh-drawer__head {
              display: flex;
              align-items: center;
              justify-content: space-between;
              padding: 18px 20px;
              border-bottom: 1px solid #f1f5f9;
              flex-shrink: 0;
            }
            .sh-drawer__head-logo img {
              height: 38px;
              width: auto;
            }
            .sh-drawer__close {
              display: flex;
              align-items: center;
              justify-content: center;
              width: 36px;
              height: 36px;
              border-radius: 8px;
              background: #f8fafc;
              border: 1px solid #e2e8f0;
              color: #64748b;
              cursor: pointer;
              transition: background 0.15s, color 0.15s, border-color 0.15s;
              flex-shrink: 0;
              -webkit-tap-highlight-color: transparent;
            }
            .sh-drawer__close:hover {
              background: #fee2e9;
              color: #c44569;
              border-color: rgba(196,69,105,0.3);
            }
            .sh-drawer__close svg { width: 18px; height: 18px; }
            .sh-drawer__body {
              flex: 1;
              overflow-y: auto;
              -webkit-overflow-scrolling: touch;
            }
            .sh-drawer__user {
              padding: 14px 16px;
              border-bottom: 1px solid #f1f5f9;
            }
            .sh-drawer__user-btn {
              display: flex;
              align-items: center;
              gap: 10px;
              width: 100%;
              padding: 11px 14px;
              background: rgba(196,69,105,0.05);
              border: 1.5px solid rgba(196,69,105,0.18);
              border-radius: 11px;
              color: #c44569;
              font-size: 0.875rem;
              font-weight: 600;
              text-decoration: none;
              transition: background 0.15s;
              font-family: inherit;
              cursor: pointer;
              direction: rtl;
              text-align: right;
            }
            .sh-drawer__user-btn:hover { background: rgba(196,69,105,0.1); }
            .sh-drawer__user-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
            .sh-drawer__nav { padding: 8px 12px; }
            .sh-drawer__nav-link {
              display: flex;
              align-items: center;
              gap: 12px;
              padding: 12px 10px;
              border-radius: 10px;
              color: #5BC2E7;
              text-decoration: none;
              font-size: 0.9375rem;
              font-weight: 500;
              transition: background 0.15s, color 0.15s;
              -webkit-tap-highlight-color: transparent;
            }
            .sh-drawer__nav-link:hover {
              background: #f8fafc;
              color: #E76BA3;
            }
            .sh-drawer__nav-link:hover .sh-drawer__nav-icon {
              background: rgba(231,107,163,0.1);
              color: #E76BA3;
            }
            .sh-drawer__nav-icon {
              width: 36px;
              height: 36px;
              border-radius: 9px;
              background: rgba(91,194,231,0.1);
              display: flex;
              align-items: center;
              justify-content: center;
              flex-shrink: 0;
              color: #5BC2E7;
              transition: background 0.15s, color 0.15s;
            }
            .sh-drawer__nav-icon svg { width: 18px; height: 18px; }
            .sh-drawer__sep {
              height: 1px;
              background: #f1f5f9;
              margin: 4px 10px;
            }
            .sh-drawer__foot {
              padding: 16px 20px;
              border-top: 1px solid #f1f5f9;
              display: flex;
              gap: 10px;
              align-items: center;
              justify-content: flex-end;
              flex-shrink: 0;
            }
            .sh-drawer__social {
              display: flex;
              align-items: center;
              justify-content: center;
              width: 40px;
              height: 40px;
              border-radius: 10px;
              background: #f1f5f9;
              color: #64748b;
              text-decoration: none;
              transition: background 0.15s, color 0.15s;
            }
            .sh-drawer__social:hover {
              background: rgba(196,69,105,0.1);
              color: #c44569;
            }
            .sh-drawer__social svg { width: 20px; height: 20px; }

            /* ---- Mini cart overlay ---- */
            .mini-cart-overlay {
              position: fixed;
              inset: 0;
              z-index: 10009;
              background: rgba(0,0,0,0.3);
              display: none;
              backdrop-filter: blur(2px);
            }
            .mini-cart-overlay.show { display: block; }

            /* ---- Responsive: Tablet + Mobile ---- */
            @media (max-width: 1023px) {
              /*
               * Three-zone symmetric layout (RTL):
               *   RIGHT: [☰  نمایندگان]   CENTER: [LOGO]   LEFT: [🔍]
               */
              .sh-inner {
                height: 60px;
                padding: 0 16px;
                gap: 0;
                justify-content: space-between;
              }

              /* Show the mobile right group */
              .sh-mobile-right { display: flex; }

              /* Show hamburger inside the group */
              .sh-hamburger { display: flex; }

              /* Logo: lifted out of flex flow and truly centered */
              .sh-logo {
                position: absolute;
                left: 50%;
                transform: translateX(-50%);
                margin: 0;
                pointer-events: auto;
                z-index: 1;
              }
              .sh-logo img { height: 52px; }

              /* Hide desktop-only elements */
              .sh-nav    { display: none; }
              .sh-spacer { display: none; }
              .sh-action-btn--desktop { display: none; }

              /* Cart lives in sticky bottom nav — not needed here */
              .sh-cart-btn { display: none; }

              /* Search — symmetric & harmonious with the hamburger */
              .sh-action-btn.js-search-btn {
                width: 44px;
                height: 44px;
                border-radius: 12px;
                background: linear-gradient(135deg, #ff6b9d 0%, #c44569 100%);
                color: #fff;
                border: 2px solid rgba(255, 255, 255, 0.35);
                box-shadow: 0 4px 15px rgba(255, 107, 157, 0.3);
                transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
              }
              .sh-action-btn.js-search-btn:hover {
                color: #fff;
                background: linear-gradient(135deg, #ff6b9d 0%, #c44569 100%);
                border-color: rgba(255, 255, 255, 0.6);
                box-shadow: 0 6px 20px rgba(255, 107, 157, 0.4);
                transform: scale(1.05);
              }
              .sh-action-btn.js-search-btn:active { transform: scale(0.96); }
              .sh-action-btn.js-search-btn svg {
                width: 22px;
                height: 22px;
                stroke-width: 2.4;
              }

              /* Hamburger: matched size & radius for true symmetry */
              .sh-hamburger {
                width: 44px;
                height: 44px;
                min-width: 44px;
                border-radius: 12px;
              }
              .sh-hamburger svg { width: 22px; height: 22px; stroke-width: 2.4; }
              .mobile-hamburger-btn {
                width: 44px !important;
                height: 44px !important;
              }
            }

            @media (max-width: 480px) {
              .sh-inner { padding: 0 12px; }
              .sh-logo img { height: 52px; }
            }

            /* ---- Active nav state ---- */
            .sh-nav__link[aria-current="page"],
            .sh-nav__link.sh-nav--active {
              color: #c44569;
              background: rgba(196,69,105,0.07);
            }