/* ===========================================================
   mobile_menu_fix.css — corrects the mobile header layout:
   1) #menuCont kept its desktop/tablet width (78%) even while its
      inner <ul> was hidden, leaving a large invisible gap that
      pushed the hamburger button and language switcher apart and
      out of vertical alignment.
   2) The dropdown nav used a hardcoded "top:88px" that didn't
      reliably match the header's real rendered height, so on some
      devices the opened panel rendered off-position/invisible.
   3) sharedCSS.css (a framework-level stylesheet) sets a blanket
      "*{position:relative}" on every element site-wide. That's
      harmless for position:fixed (which always uses the viewport
      as its containing block, ignoring relative ancestors) but it
      is NOT harmless for position:absolute, whose containing block
      is the NEAREST positioned ancestor of ANY kind — with the
      blanket rule in play that becomes the immediate parent
      (#menuCont) rather than <header>. #menuCont's own width was
      collapsed to 0 by fix #1 above, so an absolutely-positioned
      dropdown computed width:100% of 0 = 0. Keeping the dropdown on
      position:fixed (as it always was) sidesteps this entirely, so
      we lock the header to a known height instead of guessing one.
   Loaded last so it wins the cascade over main.css/responsive.css.
   =========================================================== */
@media all and (max-width: 1199px){

  /* responsive.css sets the generic .w1200{overflow:hidden} rule, which
     also matches the header's inner wrapper (header .w1200) and would
     clip the fixed-position dropdown below right out of view */
  header, header .w1200{
    overflow:visible !important;
  }

  /* take explicit control of the header height so the dropdown's
     "top" offset below is exact, not a guess */
  header{
    min-height:64px;
  }
  header .w1200{
    display:flex !important;
    align-items:center;
    min-height:64px;
    box-sizing:border-box;
  }

  .menu_content.w90.mid{
    width:auto !important;
    flex:1 1 auto;
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
  }

  /* the nav links only ever render as a full-width fixed/absolute
     overlay (see below), so the wrapper itself shouldn't reserve
     any inline space in the header row */
  #menuCont{
    width:0 !important;
    flex:0 0 auto;
    overflow:visible;
    margin:0 !important;
  }

  #mob_menu_btn{
    position:relative;
    z-index:20;
    float:none !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    font-size:28px;
    flex:0 0 auto;
    order:2;
  }

  .header_tools.mid.w11,
  .header_tools{
    width:auto !important;
    flex:0 0 auto;
    display:flex !important;
    align-items:center;
    order:1;
  }
  .mid.la.w30{
    width:auto !important;
    display:flex !important;
    align-items:center;
  }
  a.noselect.mid.langa{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:38px;
    height:34px;
    padding:0 10px;
    margin-top:0 !important;
    font-size:14px !important;
    font-weight:700;
    border-radius:8px;
    background:var(--mc,#31485a);
    color:#fff;
  }
  /* search icon stays hidden on mobile (pre-existing behaviour) */
  div#search{ display:none !important; }

  /* dropdown nav: position:fixed is immune to the sitewide
     "*{position:relative}" reset (it always sizes/positions against
     the viewport), so width:100% here is reliably the full screen
     width. top matches the explicit header min-height set above. */
  ul#real_main_ul{
    position:fixed;
    top:64px;
    left:0;
    width:100%;
    max-height:calc(100vh - 64px);
    overflow-y:auto;
    background:#fff;
    z-index:999;
    box-shadow:0 12px 28px rgba(0,0,0,.14);
  }
  .real_main_ul_sh{
    display:none !important;
  }
}

@media all and (max-width: 575px){
  #mob_menu_btn{ font-size:26px; width:40px; height:40px; }
}

[dir="rtl"] .menu_content.w90.mid{
  text-align:right;
}