/* =========================================================
   ENOVEX MOBILE MENU — STABLE PROFESSIONAL OVERRIDE
   Loaded after style.css so legacy menu rules cannot conflict.
   ========================================================= */

@media (min-width: 1101px) {
  .mobile-menu-head,
  .mobile-menu-overlay,
  .mobile-lang-panel,
  .mobile-theme-panel,
  .mobile-account-link {
    display: none !important;
  }
}

@media (max-width: 1100px) {
  :root {
    --enovex-menu-width: min(84vw, 344px);
    --enovex-menu-accent: #315cff;
    --enovex-menu-text: #18243a;
    --enovex-menu-muted: #718096;
    --enovex-menu-line: #e6ebf3;
    --enovex-menu-surface: #ffffff;
    --enovex-menu-soft: #f5f7fb;
  }

  html.menu-lock,
  body.menu-open {
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  /* Disable every legacy pseudo-overlay. */
  body.menu-open::after {
    content: none !important;
    display: none !important;
  }

  .site-header {
    z-index: 1000 !important;
  }

  .header-actions > .language-switcher,
  .header-actions > .theme-toggle,
  .header-actions > .desktop-account-link {
    display: none !important;
  }

  .menu-btn {
    display: grid !important;
    place-items: center !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
    border: 1px solid rgba(49, 92, 255, .16) !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #18243a !important;
    box-shadow: 0 8px 22px rgba(24, 36, 58, .10) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: transform .18s ease, box-shadow .18s ease !important;
    z-index: 1001 !important;
  }

  .menu-btn::before,
  .menu-btn::after {
    content: none !important;
    display: none !important;
  }

  .menu-btn i {
    position: static !important;
    font-size: 18px !important;
    transform: none !important;
  }

  .menu-btn:active {
    transform: scale(.94) !important;
  }

  body.menu-open .menu-btn {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .mobile-menu-overlay {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 1198 !important;
    background: rgba(8, 15, 28, .42) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity .24s ease, visibility .24s ease !important;
  }

  .mobile-menu-overlay.show {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html body #nav.nav {
    position: fixed !important;
    inset-block: 0 !important;
    inset-inline-end: 0 !important;
    inset-inline-start: auto !important;
    z-index: 1199 !important;
    width: var(--enovex-menu-width) !important;
    max-width: var(--enovex-menu-width) !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    padding:
      max(14px, env(safe-area-inset-top))
      14px
      max(16px, env(safe-area-inset-bottom)) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 7px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    border: 0 !important;
    border-inline-start: 1px solid var(--enovex-menu-line) !important;
    border-radius: 24px 0 0 24px !important;
    background: var(--enovex-menu-surface) !important;
    background-image: none !important;
    color: var(--enovex-menu-text) !important;
    box-shadow: -18px 0 52px rgba(8, 20, 40, .22) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    transform: translate3d(calc(100% + 24px), 0, 0) !important;
    transition: transform .32s cubic-bezier(.22, 1, .36, 1) !important;
  }

  html body[dir="rtl"] #nav.nav,
  html[dir="rtl"] body #nav.nav {
    inset-inline-end: auto !important;
    inset-inline-start: 0 !important;
    border-inline-start: 0 !important;
    border-inline-end: 1px solid var(--enovex-menu-line) !important;
    border-radius: 0 24px 24px 0 !important;
    box-shadow: 18px 0 52px rgba(8, 20, 40, .22) !important;
    transform: translate3d(calc(-100% - 24px), 0, 0) !important;
  }

  html body #nav.nav.show,
  html body[dir="rtl"] #nav.nav.show,
  html[dir="rtl"] body #nav.nav.show {
    transform: translate3d(0, 0, 0) !important;
    pointer-events: auto !important;
  }

  #nav.nav::before,
  #nav.nav::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-menu-head {
    position: relative !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
    min-height: 62px !important;
    margin: 0 0 7px !important;
    padding: 1px 1px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--enovex-menu-line) !important;
    background: var(--enovex-menu-surface) !important;
  }

  #nav.nav .mobile-menu-title {
    min-width: 0 !important;
    padding: 0 !important;
    display: block !important;
    text-align: start !important;
  }

  #nav.nav .mobile-menu-title > span {
    display: block !important;
    margin: 0 !important;
    color: var(--enovex-menu-text) !important;
    font-size: 23px !important;
    line-height: 1.05 !important;
    font-weight: 850 !important;
    letter-spacing: -.025em !important;
    text-transform: none !important;
    white-space: nowrap !important;
  }

  #nav.nav .mobile-menu-title > small {
    display: block !important;
    margin: 5px 0 0 !important;
    color: var(--enovex-menu-muted) !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    letter-spacing: .075em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  body[dir="rtl"] #nav.nav .mobile-menu-title > span,
  html[dir="rtl"] #nav.nav .mobile-menu-title > span,
  body[dir="rtl"] #nav.nav .mobile-menu-title > small,
  html[dir="rtl"] #nav.nav .mobile-menu-title > small {
    letter-spacing: 0 !important;
    text-transform: none !important;
  }

  #nav.nav .mobile-menu-close {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid var(--enovex-menu-line) !important;
    border-radius: 13px !important;
    background: var(--enovex-menu-soft) !important;
    color: var(--enovex-menu-text) !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: transform .18s ease, background .18s ease !important;
  }

  #nav.nav .mobile-menu-close::before,
  #nav.nav .mobile-menu-close::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-menu-close:active {
    transform: scale(.94) !important;
  }

  #nav.nav > a,
  #nav.nav > a.mobile-account-link {
    position: relative !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 7px 9px !important;
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    background: transparent !important;
    background-image: none !important;
    color: var(--enovex-menu-text) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: none !important;
    text-decoration: none !important;
    transition: background .18s ease, border-color .18s ease !important;
  }

  #nav.nav > a::before,
  #nav.nav > a::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav > a:hover,
  #nav.nav > a:focus-visible,
  #nav.nav > a:active {
    background: var(--enovex-menu-soft) !important;
    border-color: var(--enovex-menu-line) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  #nav.nav > a i {
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: #edf1ff !important;
    color: var(--enovex-menu-accent) !important;
    box-shadow: none !important;
    font-size: 14px !important;
  }

  #nav.nav > a span {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    color: inherit !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 760 !important;
    text-align: start !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  #nav.nav .mobile-account-link {
    display: flex !important;
  }

  #nav.nav .mobile-lang-panel,
  #nav.nav .mobile-theme-panel {
    flex: 0 0 auto !important;
    width: 100% !important;
    margin: 5px 0 0 !important;
    padding: 11px !important;
    display: grid !important;
    gap: 9px !important;
    border: 1px solid var(--enovex-menu-line) !important;
    border-radius: 16px !important;
    background: var(--enovex-menu-soft) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  #nav.nav .mobile-lang-panel p,
  #nav.nav .mobile-theme-panel p {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    border: 0 !important;
    color: var(--enovex-menu-muted) !important;
    font-size: 10.5px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: .045em !important;
    text-transform: uppercase !important;
  }

  #nav.nav .mobile-lang-panel p::before,
  #nav.nav .mobile-lang-panel p::after,
  #nav.nav .mobile-theme-panel p::before,
  #nav.nav .mobile-theme-panel p::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-lang-panel p i,
  #nav.nav .mobile-theme-panel p i {
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    display: inline-block !important;
    background: transparent !important;
    color: var(--enovex-menu-accent) !important;
    font-size: 12px !important;
  }

  #nav.nav .mobile-lang-buttons {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  #nav.nav .mobile-lang-buttons button {
    position: relative !important;
    min-width: 0 !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 7px 4px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    border: 1px solid var(--enovex-menu-line) !important;
    border-radius: 12px !important;
    background: var(--enovex-menu-surface) !important;
    color: var(--enovex-menu-muted) !important;
    box-shadow: none !important;
    cursor: pointer !important;
    overflow: hidden !important;
    transition: border-color .18s ease, background .18s ease, color .18s ease !important;
  }

  #nav.nav .mobile-lang-buttons button::before {
    content: attr(data-lang-option) !important;
    display: block !important;
    color: var(--enovex-menu-text) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
  }

  #nav.nav .mobile-lang-buttons button::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-lang-buttons button i {
    display: none !important;
  }

  #nav.nav .mobile-lang-buttons button span {
    min-width: 0 !important;
    width: 100% !important;
    display: block !important;
    color: inherit !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  #nav.nav .mobile-lang-buttons button.active {
    border-color: var(--enovex-menu-accent) !important;
    background: var(--enovex-menu-accent) !important;
    color: rgba(255, 255, 255, .84) !important;
    box-shadow: none !important;
  }

  #nav.nav .mobile-lang-buttons button.active::before {
    color: #ffffff !important;
  }

  #nav.nav .mobile-theme-panel {
    margin-top: 0 !important;
  }

  #nav.nav .mobile-theme-toggle {
    position: relative !important;
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 3px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 3px !important;
    border: 1px solid var(--enovex-menu-line) !important;
    border-radius: 12px !important;
    background: #e9edf4 !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  #nav.nav .mobile-theme-toggle::before,
  #nav.nav .mobile-theme-toggle::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option {
    position: static !important;
    width: auto !important;
    height: 34px !important;
    min-width: 0 !important;
    padding: 0 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: var(--enovex-menu-muted) !important;
    box-shadow: none !important;
    transform: none !important;
    font-size: 11px !important;
    font-weight: 780 !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option i,
  #nav.nav .mobile-theme-toggle .theme-option span {
    display: inline-block !important;
    color: inherit !important;
  }

  body:not(.dark-mode) #nav.nav .mobile-theme-toggle .theme-light,
  body.dark-mode #nav.nav .mobile-theme-toggle .theme-dark {
    background: var(--enovex-menu-surface) !important;
    color: var(--enovex-menu-accent) !important;
    box-shadow: 0 3px 10px rgba(20, 35, 58, .10) !important;
  }

  /* Dark mode remains simple and low-contrast. */
  body.dark-mode {
    --enovex-menu-text: #eef3fb;
    --enovex-menu-muted: #94a3b8;
    --enovex-menu-line: #26364d;
    --enovex-menu-surface: #0d1727;
    --enovex-menu-soft: #131f32;
  }

  body.dark-mode .menu-btn {
    border-color: #2a3a52 !important;
    background: #131f31 !important;
    color: #eef3fb !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .24) !important;
  }

  body.dark-mode #nav.nav {
    background: var(--enovex-menu-surface) !important;
    background-image: none !important;
    border-color: var(--enovex-menu-line) !important;
    box-shadow: -18px 0 52px rgba(0, 0, 0, .42) !important;
  }

  body[dir="rtl"].dark-mode #nav.nav,
  html[dir="rtl"] body.dark-mode #nav.nav {
    box-shadow: 18px 0 52px rgba(0, 0, 0, .42) !important;
  }

  body.dark-mode #nav.nav .mobile-menu-head {
    background: var(--enovex-menu-surface) !important;
    border-color: var(--enovex-menu-line) !important;
  }

  body.dark-mode #nav.nav .mobile-menu-close,
  body.dark-mode #nav.nav .mobile-lang-buttons button {
    background: #18253a !important;
    border-color: var(--enovex-menu-line) !important;
    color: #aab8cc !important;
  }

  body.dark-mode #nav.nav > a i {
    background: #182846 !important;
    color: #9eb2ff !important;
  }

  body.dark-mode #nav.nav .mobile-lang-buttons button::before {
    color: #eef3fb !important;
  }

  body.dark-mode #nav.nav .mobile-lang-buttons button.active {
    background: var(--enovex-menu-accent) !important;
    border-color: var(--enovex-menu-accent) !important;
    color: rgba(255, 255, 255, .84) !important;
  }

  body.dark-mode #nav.nav .mobile-lang-buttons button.active::before {
    color: #ffffff !important;
  }

  body.dark-mode #nav.nav .mobile-theme-toggle {
    background: #09111d !important;
    border-color: var(--enovex-menu-line) !important;
  }

  body.dark-mode #nav.nav .mobile-theme-toggle .theme-dark {
    background: #1a2a47 !important;
    color: #aebdff !important;
    box-shadow: none !important;
  }
}

@media (max-width: 390px) {
  :root {
    --enovex-menu-width: min(88vw, 326px);
  }

  #nav.nav .mobile-menu-title > span {
    font-size: 21px !important;
  }

  #nav.nav > a,
  #nav.nav > a.mobile-account-link {
    min-height: 48px !important;
  }

  #nav.nav .mobile-lang-buttons {
    gap: 5px !important;
  }

  #nav.nav .mobile-lang-buttons button {
    min-height: 53px !important;
  }
}

@media (max-height: 620px) and (max-width: 1100px) {
  html body #nav.nav {
    gap: 5px !important;
    padding-top: max(10px, env(safe-area-inset-top)) !important;
    padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
  }

  #nav.nav .mobile-menu-head {
    min-height: 54px !important;
    margin-bottom: 3px !important;
    padding-bottom: 9px !important;
  }

  #nav.nav > a,
  #nav.nav > a.mobile-account-link {
    min-height: 45px !important;
    padding-block: 5px !important;
  }

  #nav.nav > a i {
    width: 33px !important;
    height: 33px !important;
    min-width: 33px !important;
  }

  #nav.nav .mobile-lang-panel,
  #nav.nav .mobile-theme-panel {
    padding: 9px !important;
    gap: 7px !important;
  }

  #nav.nav .mobile-lang-buttons button {
    min-height: 49px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-menu-overlay,
  #nav.nav,
  .menu-btn,
  #nav.nav > a,
  #nav.nav .mobile-menu-close,
  #nav.nav .mobile-lang-buttons button {
    transition: none !important;
  }
}

/* =========================================================
   ENOVEX MOBILE MENU — FINAL POLISH
   Blur backdrop, compact language names, refined theme control.
   ========================================================= */
@media (max-width: 1100px) {
  :root {
    --enovex-menu-width: min(82vw, 330px);
  }

  .mobile-menu-overlay {
    background: rgba(5, 12, 24, .38) !important;
    backdrop-filter: blur(9px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(9px) saturate(115%) !important;
  }

  body.dark-mode .mobile-menu-overlay {
    background: rgba(2, 7, 16, .52) !important;
  }

  html body #nav.nav {
    gap: 6px !important;
    padding-inline: 13px !important;
    border-radius: 22px 0 0 22px !important;
  }

  html body[dir="rtl"] #nav.nav,
  html[dir="rtl"] body #nav.nav {
    border-radius: 0 22px 22px 0 !important;
  }

  #nav.nav > a,
  #nav.nav > a.mobile-account-link {
    min-height: 48px !important;
    padding: 6px 8px !important;
    border-radius: 13px !important;
  }

  #nav.nav > a i {
    flex-basis: 34px !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
  }

  #nav.nav > a span {
    font-size: 13.5px !important;
  }

  #nav.nav .mobile-lang-panel,
  #nav.nav .mobile-theme-panel {
    margin-top: 4px !important;
    padding: 10px !important;
    gap: 8px !important;
    border-radius: 15px !important;
  }

  #nav.nav .mobile-lang-panel p,
  #nav.nav .mobile-theme-panel p {
    font-size: 10px !important;
    letter-spacing: .035em !important;
  }

  #nav.nav .mobile-lang-panel p i,
  #nav.nav .mobile-theme-panel p i {
    display: grid !important;
    place-items: center !important;
    width: 25px !important;
    height: 25px !important;
    border-radius: 8px !important;
    background: rgba(49, 92, 255, .10) !important;
    color: var(--enovex-menu-accent) !important;
    font-size: 11px !important;
  }

  #nav.nav .mobile-lang-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  #nav.nav .mobile-lang-buttons button {
    min-height: 42px !important;
    padding: 6px 4px !important;
    flex-direction: row !important;
    gap: 0 !important;
    border-radius: 11px !important;
  }

  #nav.nav .mobile-lang-buttons button::before,
  #nav.nav .mobile-lang-buttons button::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-lang-buttons button span {
    display: block !important;
    width: auto !important;
    color: inherit !important;
    font-size: 10.5px !important;
    line-height: 1.15 !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  #nav.nav .mobile-lang-buttons button.active {
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(49, 92, 255, .20) !important;
  }

  #nav.nav .mobile-theme-toggle {
    height: 44px !important;
    min-height: 44px !important;
    padding: 4px !important;
    border-radius: 13px !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option {
    height: 34px !important;
    gap: 7px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option i {
    font-size: 13px !important;
  }

  body:not(.dark-mode) #nav.nav .mobile-theme-toggle .theme-light,
  body.dark-mode #nav.nav .mobile-theme-toggle .theme-dark {
    color: #fff !important;
    background: linear-gradient(135deg, #315cff, #2498ff) !important;
    box-shadow: 0 5px 14px rgba(49, 92, 255, .24) !important;
  }

  body.dark-mode #nav.nav .mobile-theme-toggle .theme-dark {
    color: #fff !important;
    background: linear-gradient(135deg, #315cff, #6b5cff) !important;
    box-shadow: 0 5px 14px rgba(49, 92, 255, .24) !important;
  }
}

@media (max-width: 390px) {
  :root {
    --enovex-menu-width: min(86vw, 318px);
  }

  #nav.nav .mobile-lang-buttons button span {
    font-size: 10px !important;
  }
}

/* ==========================================================
   FINAL THEME PANEL REPAIR — 2026-07-10
   One authoritative mobile rule-set. Prevents legacy RTL/theme
   declarations from stretching, clipping or overlapping controls.
   ========================================================== */
@media (max-width: 900px) {
  #nav.nav .mobile-theme-panel,
  body[dir="rtl"] #nav.nav .mobile-theme-panel,
  html[dir="rtl"] #nav.nav .mobile-theme-panel,
  html[lang="ku"] #nav.nav .mobile-theme-panel,
  html[lang="ar"] #nav.nav .mobile-theme-panel {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 6px 0 0 !important;
    padding: 12px !important;
    overflow: hidden !important;
    border: 1px solid var(--enovex-menu-line) !important;
    border-radius: 16px !important;
    background: var(--enovex-menu-surface) !important;
    box-shadow: none !important;
    transform: none !important;
    direction: ltr !important;
  }

  #nav.nav .mobile-theme-panel::before,
  #nav.nav .mobile-theme-panel::after,
  body[dir="rtl"] #nav.nav .mobile-theme-panel::before,
  html[dir="rtl"] #nav.nav .mobile-theme-panel::before,
  html[lang="ku"] #nav.nav .mobile-theme-panel::before,
  html[lang="ar"] #nav.nav .mobile-theme-panel::before {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-theme-panel .mobile-panel-label,
  body[dir="rtl"] #nav.nav .mobile-theme-panel .mobile-panel-label,
  html[dir="rtl"] #nav.nav .mobile-theme-panel .mobile-panel-label,
  html[lang="ku"] #nav.nav .mobile-theme-panel .mobile-panel-label,
  html[lang="ar"] #nav.nav .mobile-theme-panel .mobile-panel-label {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--enovex-menu-muted) !important;
    font-size: 10.5px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: .04em !important;
    text-align: center !important;
    white-space: normal !important;
    overflow: visible !important;
    transform: none !important;
    direction: inherit !important;
  }

  html[lang="ku"] #nav.nav .mobile-theme-panel .mobile-panel-label,
  html[lang="ar"] #nav.nav .mobile-theme-panel .mobile-panel-label {
    direction: rtl !important;
    letter-spacing: 0 !important;
  }

  #nav.nav .mobile-theme-panel .mobile-panel-label::before,
  #nav.nav .mobile-theme-panel .mobile-panel-label::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-theme-panel .mobile-panel-label i {
    position: static !important;
    display: grid !important;
    place-items: center !important;
    flex: 0 0 27px !important;
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(49,92,255,.25) !important;
    border-radius: 9px !important;
    background: rgba(49,92,255,.10) !important;
    color: var(--enovex-menu-accent) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    transform: none !important;
  }

  #nav.nav .mobile-theme-toggle,
  body[dir="rtl"] #nav.nav .mobile-theme-toggle,
  html[dir="rtl"] #nav.nav .mobile-theme-toggle,
  html[lang="ku"] #nav.nav .mobile-theme-toggle,
  html[lang="ar"] #nav.nav .mobile-theme-toggle {
    position: relative !important;
    isolation: isolate !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    margin: 0 !important;
    padding: 4px !important;
    overflow: hidden !important;
    border: 1px solid var(--enovex-menu-line) !important;
    border-radius: 13px !important;
    background: var(--enovex-menu-soft) !important;
    box-shadow: none !important;
    transform: none !important;
    direction: ltr !important;
  }

  #nav.nav .mobile-theme-toggle::before,
  #nav.nav .mobile-theme-toggle::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option,
  body[dir="rtl"] #nav.nav .mobile-theme-toggle .theme-option,
  html[dir="rtl"] #nav.nav .mobile-theme-toggle .theme-option,
  html[lang="ku"] #nav.nav .mobile-theme-toggle .theme-option,
  html[lang="ar"] #nav.nav .mobile-theme-toggle .theme-option {
    position: static !important;
    inset: auto !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    margin: 0 !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--enovex-menu-muted) !important;
    box-shadow: none !important;
    font-size: 11.5px !important;
    line-height: 1 !important;
    font-weight: 780 !important;
    text-align: center !important;
    white-space: nowrap !important;
    transform: none !important;
    opacity: 1 !important;
    direction: inherit !important;
  }

  html[lang="ku"] #nav.nav .mobile-theme-toggle .theme-option,
  html[lang="ar"] #nav.nav .mobile-theme-toggle .theme-option {
    direction: rtl !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option::before,
  #nav.nav .mobile-theme-toggle .theme-option::after {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option i {
    position: static !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: 13px !important;
    line-height: 1 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  #nav.nav .mobile-theme-toggle .theme-option > span {
    position: static !important;
    display: block !important;
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: inherit !important;
    font: inherit !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    transform: none !important;
  }

  body:not(.dark-mode) #nav.nav .mobile-theme-toggle .theme-light,
  body.dark-mode #nav.nav .mobile-theme-toggle .theme-dark {
    background: linear-gradient(135deg, #315cff, #2498ff) !important;
    color: #fff !important;
    box-shadow: 0 5px 14px rgba(49,92,255,.22) !important;
  }

  body.dark-mode #nav.nav .mobile-theme-toggle .theme-dark {
    background: linear-gradient(135deg, #315cff, #675cff) !important;
  }

  body:not(.dark-mode) #nav.nav .mobile-theme-toggle .theme-dark,
  body.dark-mode #nav.nav .mobile-theme-toggle .theme-light {
    background: transparent !important;
    color: var(--enovex-menu-muted) !important;
    box-shadow: none !important;
  }
}

/* =========================================================
   ENOVEX MOBILE MENU — PRIVATE BACKDROP
   Strongly obscures page content while preserving a soft blur.
   ========================================================= */
@media (max-width: 1100px) {
  .mobile-menu-overlay {
    background: rgba(239, 243, 251, .88) !important;
    backdrop-filter: blur(28px) saturate(120%) brightness(.98) !important;
    -webkit-backdrop-filter: blur(28px) saturate(120%) brightness(.98) !important;
  }

  body.dark-mode .mobile-menu-overlay {
    background: rgba(3, 8, 18, .90) !important;
    backdrop-filter: blur(30px) saturate(112%) brightness(.64) !important;
    -webkit-backdrop-filter: blur(30px) saturate(112%) brightness(.64) !important;
  }

  /* Safari fallback: page remains hidden even without backdrop-filter support. */
  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .mobile-menu-overlay {
      background: rgba(239, 243, 251, .97) !important;
    }

    body.dark-mode .mobile-menu-overlay {
      background: rgba(3, 8, 18, .98) !important;
    }
  }
}

/* =========================================================
   FINAL PRIVACY BACKDROP — authoritative last rule
   The page must not remain readable while the mobile menu is open.
   ========================================================= */
@media (max-width: 1100px) {
  body.menu-open .mobile-menu-overlay,
  .mobile-menu-overlay.show {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    z-index: 2147483645 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    background: rgba(246, 248, 253, .985) !important;
    backdrop-filter: blur(42px) saturate(80%) brightness(1.02) !important;
    -webkit-backdrop-filter: blur(42px) saturate(80%) brightness(1.02) !important;
    transition: opacity .22s ease, visibility .22s ease !important;
  }

  body.dark-mode.menu-open .mobile-menu-overlay,
  body.dark-mode .mobile-menu-overlay.show {
    background: rgba(3, 8, 18, .985) !important;
    backdrop-filter: blur(42px) saturate(75%) brightness(.48) !important;
    -webkit-backdrop-filter: blur(42px) saturate(75%) brightness(.48) !important;
  }

  /* Keep the drawer above every page element and above the privacy layer. */
  html body #nav.nav,
  html body #nav.nav.show,
  html body[dir="rtl"] #nav.nav,
  html body[dir="rtl"] #nav.nav.show,
  html[dir="rtl"] body #nav.nav,
  html[dir="rtl"] body #nav.nav.show {
    z-index: 2147483646 !important;
  }

  /* Extra fallback for browsers with unreliable backdrop-filter support. */
  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    body.menu-open .mobile-menu-overlay,
    .mobile-menu-overlay.show {
      background: #f6f8fd !important;
    }

    body.dark-mode.menu-open .mobile-menu-overlay,
    body.dark-mode .mobile-menu-overlay.show {
      background: #030812 !important;
    }
  }
}

/* =========================================================
   FINAL VISIBLE BLUR BACKDROP — 50% transparency
   Keep the website visible behind the drawer, but softly blurred.
   ========================================================= */
@media (max-width: 1100px) {
  body.menu-open .mobile-menu-overlay,
  .mobile-menu-overlay.show {
    background: rgba(235, 241, 252, 0.50) !important;
    backdrop-filter: blur(14px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(115%) !important;
    opacity: 1 !important;
  }

  body.dark-mode.menu-open .mobile-menu-overlay,
  body.dark-mode .mobile-menu-overlay.show {
    background: rgba(3, 9, 22, 0.50) !important;
    backdrop-filter: blur(14px) saturate(110%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(110%) !important;
  }

  /* Do not replace the transparent layer with an opaque fallback. */
  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    body.menu-open .mobile-menu-overlay,
    .mobile-menu-overlay.show {
      background: rgba(235, 241, 252, 0.50) !important;
    }

    body.dark-mode.menu-open .mobile-menu-overlay,
    body.dark-mode .mobile-menu-overlay.show {
      background: rgba(3, 9, 22, 0.50) !important;
    }
  }
}

/* =========================================================
   FINAL MOBILE NAVBAR CONFLICT FIX — 2026-07-10
   One centered glass menu, visible blurred page, clean labels.
   ========================================================= */
@media (max-width: 1100px) {
  .mobile-menu-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1198 !important;
    display: block !important;
    background: rgba(7, 14, 28, .28) !important;
    backdrop-filter: blur(15px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(15px) saturate(115%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity .25s ease, visibility .25s ease !important;
  }

  .mobile-menu-overlay.show {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html body #nav.nav,
  html body[dir="rtl"] #nav.nav,
  html[dir="rtl"] body #nav.nav {
    position: fixed !important;
    inset: auto !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: min(calc(100vw - 28px), 370px) !important;
    max-width: 370px !important;
    height: auto !important;
    max-height: min(86dvh, 720px) !important;
    padding: 14px !important;
    border: 1px solid rgba(255, 255, 255, .62) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .78) !important;
    box-shadow: 0 24px 70px rgba(5, 15, 35, .25) !important;
    backdrop-filter: blur(24px) saturate(145%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(145%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate(-50%, -47%) scale(.96) !important;
    transition: transform .3s cubic-bezier(.22,1,.36,1), opacity .22s ease, visibility .22s ease !important;
  }

  html body #nav.nav.show,
  html body[dir="rtl"] #nav.nav.show,
  html[dir="rtl"] body #nav.nav.show {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate(-50%, -50%) scale(1) !important;
  }

  body.dark-mode #nav.nav,
  body[dir="rtl"].dark-mode #nav.nav,
  html[dir="rtl"] body.dark-mode #nav.nav {
    border-color: rgba(255, 255, 255, .12) !important;
    background: rgba(10, 20, 36, .80) !important;
    box-shadow: 0 26px 75px rgba(0, 0, 0, .48) !important;
  }

  #nav.nav .mobile-menu-head,
  body.dark-mode #nav.nav .mobile-menu-head {
    background: transparent !important;
  }

  /* Show only full language names; remove EN / AR / KU abbreviations. */
  #nav.nav .mobile-lang-buttons button::before {
    content: none !important;
    display: none !important;
  }

  #nav.nav .mobile-lang-buttons button {
    min-height: 44px !important;
    flex-direction: row !important;
    padding: 8px 7px !important;
  }

  #nav.nav .mobile-lang-buttons button span {
    font-size: 10px !important;
    line-height: 1.2 !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* Prevent the hidden header menu button from leaving an odd visual layer. */
  body.menu-open .menu-btn {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

@media (max-width: 390px) {
  html body #nav.nav,
  html body[dir="rtl"] #nav.nav,
  html[dir="rtl"] body #nav.nav {
    width: calc(100vw - 22px) !important;
    padding: 12px !important;
    border-radius: 21px !important;
    max-height: 88dvh !important;
  }
}