/*
 * Ngo-Alshula-sa v4.2.7
 * Header dropdown overlay final patch.
 * يضمن ظهور القوائم الفرعية فوق الهيرو وكل أقسام الصفحة بدون قص أو تداخل.
 */
:root{
  --ngo-header-layer-final: 2147482000;
  --ngo-dropdown-layer-final: 2147483000;
}

html,
body{
  overflow-x: clip;
}

.ngo-site-header,
.site-header.ngo-site-header,
body .ngo-site-header{
  position: relative !important;
  z-index: var(--ngo-header-layer-final) !important;
  overflow: visible !important;
  isolation: auto !important;
  transform: none !important;
  contain: none !important;
}

.ngo-site-header *,
.ngo-site-header .ngo-container,
.ngo-site-header .ngo-header-inner,
.ngo-site-header .ngo-main-menu,
.ngo-site-header .ngo-main-menu > div,
.ngo-site-header .ngo-main-menu ul,
.ngo-site-header .ngo-main-menu li,
.ngo-site-header nav{
  overflow: visible !important;
  contain: none !important;
}

.ngo-hero,
.ngo-page-hero,
.ngo-site-main,
.site-main,
.site-content,
#content,
main,
.ngo-section{
  position: relative !important;
  z-index: 0 !important;
}

@media (min-width: 901px){
  body .ngo-site-header .ngo-main-menu{
    position: relative !important;
    z-index: calc(var(--ngo-header-layer-final) + 1) !important;
  }

  body .ngo-site-header .ngo-main-menu > div > ul,
  body .ngo-site-header .ngo-main-menu > ul,
  body .ngo-site-header #primary-menu{
    overflow: visible !important;
  }

  body .ngo-site-header .ngo-main-menu > div > ul > li,
  body .ngo-site-header .ngo-main-menu > ul > li,
  body .ngo-site-header #primary-menu > li{
    position: relative !important;
    overflow: visible !important;
    z-index: 1 !important;
  }

  body .ngo-site-header .ngo-main-menu > div > ul > li:hover,
  body .ngo-site-header .ngo-main-menu > ul > li:hover,
  body .ngo-site-header #primary-menu > li:hover,
  body .ngo-site-header .ngo-main-menu > div > ul > li:focus-within,
  body .ngo-site-header .ngo-main-menu > ul > li:focus-within,
  body .ngo-site-header #primary-menu > li:focus-within{
    z-index: var(--ngo-dropdown-layer-final) !important;
  }

  body .ngo-site-header .ngo-main-menu .sub-menu,
  body .ngo-site-header .ngo-main-menu .children{
    z-index: var(--ngo-dropdown-layer-final) !important;
    background: #fff !important;
    border: 1px solid rgba(226,232,240,.98) !important;
    box-shadow: 0 28px 90px rgba(15,23,42,.22) !important;
    max-height: min(72vh, 560px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    clip-path: none !important;
    transform-origin: top center !important;
    will-change: opacity, transform !important;
  }

  /* JS يضع القوائم الكبيرة كـ fixed عند فتحها لمنع قصها خلف الهيرو */
  body .ngo-site-header .ngo-main-menu .sub-menu.is-fixed-dropdown,
  body .ngo-site-header .ngo-main-menu .children.is-fixed-dropdown{
    position: fixed !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    top: var(--ngo-dropdown-fixed-top, 120px) !important;
    left: var(--ngo-dropdown-fixed-left, 24px) !important;
    right: auto !important;
    transform: translateY(0) scale(1) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html[dir="rtl"] body .ngo-site-header .ngo-main-menu .sub-menu.is-fixed-dropdown,
  html[dir="rtl"] body .ngo-site-header .ngo-main-menu .children.is-fixed-dropdown{
    right: auto !important;
    left: var(--ngo-dropdown-fixed-left, 24px) !important;
  }

  body .ngo-site-header .ngo-main-menu .sub-menu.is-fixed-dropdown:after,
  body .ngo-site-header .ngo-main-menu .children.is-fixed-dropdown:after{
    content: "" !important;
    position: fixed !important;
    top: calc(var(--ngo-dropdown-fixed-top, 120px) - 14px) !important;
    left: var(--ngo-dropdown-fixed-left, 24px) !important;
    width: var(--ngo-dropdown-fixed-width, 260px) !important;
    height: 14px !important;
    background: transparent !important;
  }
}

@media (max-width: 900px){
  body .ngo-site-header{
    position: sticky !important;
    top: 0 !important;
    z-index: var(--ngo-header-layer-final) !important;
  }

  body.admin-bar .ngo-site-header{
    top: 46px !important;
  }

  body .ngo-site-header .ngo-main-menu{
    z-index: var(--ngo-dropdown-layer-final) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }
}
