/* Yebrax CWS R7A — mobile drawer portal closure.
   On compact screens JS portals the drawer/backdrop directly under <body>,
   escaping every legacy panel stacking/overflow context. */

@media (max-width:980px){
  html{overflow-x:hidden!important;}
  body.gc-drawer-open{overflow:hidden!important;touch-action:auto!important;}

  /* Portal backdrop: always below the drawer, above the application. */
  body > #yrPanelOverlay,
  body > #yrAdminOverlay{
    display:block!important;
    position:fixed!important;
    inset:0!important;
    z-index:2147483600!important;
    background:rgba(2,12,24,.64)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity .16s ease,visibility .16s ease!important;
    -webkit-backdrop-filter:blur(2px)!important;
    backdrop-filter:blur(2px)!important;
  }
  body > #yrPanelOverlay.is-open,
  body > #yrAdminOverlay.is-open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  /* Portal drawer owns its complete visual state. Do not inherit legacy display/position. */
  body > #yrPanelSidebar,
  body > #yrAdminSidebar{
    display:flex!important;
    flex-direction:column!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    width:min(88vw,310px)!important;
    min-width:0!important;
    max-width:310px!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    z-index:2147483601!important;
    opacity:1!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .18s ease,visibility .18s ease!important;
    box-shadow:0 0 54px rgba(0,0,0,.34)!important;
    contain:none!important;
    isolation:isolate!important;
  }

  body.gc-drawer-rtl > #yrPanelSidebar,
  body.gc-drawer-rtl > #yrAdminSidebar{
    right:0!important;
    left:auto!important;
    transform:translate3d(105%,0,0)!important;
  }
  body.gc-drawer-ltr > #yrPanelSidebar,
  body.gc-drawer-ltr > #yrAdminSidebar{
    left:0!important;
    right:auto!important;
    transform:translate3d(-105%,0,0)!important;
  }

  body > #yrPanelSidebar.is-open,
  body > #yrAdminSidebar.is-open{
    transform:translate3d(0,0,0)!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  body > #yrPanelSidebar *,
  body > #yrAdminSidebar *{pointer-events:auto!important;}

  /* Keep the hamburger reachable before opening; backdrop owns outside-click after opening. */
  #yrSidebarToggle,#yrAdminSidebarToggle{
    display:inline-flex!important;
    position:relative!important;
    z-index:30!important;
    touch-action:manipulation!important;
  }

  body > #yrPanelSidebar [data-sidebar-close],
  body > #yrAdminSidebar [data-admin-sidebar-close]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    touch-action:manipulation!important;
    pointer-events:auto!important;
  }

  body > #yrPanelSidebar .panel-group__head,
  body > #yrAdminSidebar .panel-group__head,
  body > #yrPanelSidebar .panel-nav__item,
  body > #yrAdminSidebar .panel-nav__item{
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
}