/* GOV-UX-83: el submenu de la barra COLAPSADA se puede alcanzar con el mouse.

   El bug (dueno, 1-oct, en produccion): con la barra en iconos, el submenu
   aparecia al pasar por el icono y desaparecia al ir hacia el. Medido con el
   mouse real (Chromium, 1366x768): el cartel con el nombre y la lista del
   submenu tienen `margin-left:10px` (app.min.css), asi que entre el icono
   (0-75 px) y el cartel (85 px) hay 10 px que no son de nadie -- el puntero
   pasa por `.page-content`, el `<li>` pierde el :hover y el tema esconde todo
   con `display:none`. El tema lo tapaba con un `.nav-link::before` de 280 px
   de ancho, pero desde GOV-UX-82 la lista scrollea (`overflow`) y ese puente
   quedo recortado a los 75 px de la barra. Ir en diagonal hacia el submenu
   tambien lo cerraba: el puntero pisa el icono de abajo.

   Arreglo, como un menu de verdad: lo que se ve lo decide la clase
   `.sge-flyout-open` que pone main-nav-enterprise_part2.js (con retardo de
   cierre, tolerancia a la diagonal, teclado y tap), no el :hover. Aca: (1) con
   el JS activo (`html.sge-flyout-js`) el :hover solo ya no muestra nada; (2) el
   item abierto muestra cartel y submenu con los mismos estilos que el tema le
   da al :hover; (3) un puente de 10 px pegado al cartel tapa el hueco. Sin JS
   (o si este archivo no carga) queda el comportamiento del tema. Expandido y
   movil no se tocan: todo empieza con data-menu-size=condensed. */

/* (1) Con JS, el :hover solo no abre: asi no hay dos submenus a la vez
   mientras el puntero cruza otro icono camino al panel abierto. */
html.sge-flyout-js[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item:not(.sge-flyout-open):hover > .collapse,
html.sge-flyout-js[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item:not(.sge-flyout-open):hover > .collapsing,
html.sge-flyout-js[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item:not(.sge-flyout-open):hover > .nav-link > .nav-text {
    display: none;
}

/* (2) El item abierto: copia de las reglas `.nav-item:hover` del tema
   (app.min.css, condensed), con el panel y el cartel en position:fixed como
   los dejo GOV-UX-82 (el top lo pone el JS desde la fila). */
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse,
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapsing {
    display: block;
    height: inherit !important;
    margin-top: -1px;
    transition: none !important;
    position: fixed;
    left: var(--bs-main-nav-width-sm);
    z-index: 1030;
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav,
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapsing > .sub-navbar-nav {
    background: var(--bs-secondary-bg);
    border: 0 solid var(--bs-border-color);
    box-shadow: var(--bs-box-shadow-lg);
    padding-left: 0;
    width: calc(var(--bs-main-nav-width) - var(--bs-main-nav-width-sm));
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav > .sub-nav-item {
    padding: 0;
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav > .sub-nav-item > .sub-nav-link {
    padding: calc(var(--bs-main-nav-item-padding-y) * .75) var(--bs-main-nav-item-padding-x);
    z-index: 5;
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav > .sub-nav-item > .sub-nav-link > .nav-text {
    display: block;
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav .sub-nav-item .sub-nav-link {
    color: var(--bs-body-color);
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav .sub-nav-item .sub-nav-link:hover,
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav .sub-nav-item .sub-nav-link:focus,
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav .sub-nav-item .sub-nav-link[aria-expanded=true] {
    color: var(--bs-primary);
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .collapse > .sub-navbar-nav .sub-nav-item .collapse {
    top: 0;
}
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .nav-link > .nav-text {
    align-items: center;
    background: var(--bs-secondary-bg);
    border: 0 solid var(--bs-border-color);
    box-shadow: var(--bs-box-shadow-lg);
    color: var(--bs-body-color);
    display: flex;
    left: var(--bs-main-nav-width-sm);
    line-height: var(--bs-main-nav-item-icon-size);
    padding: var(--bs-main-nav-item-padding-y) var(--bs-main-nav-item-padding-x);
    position: fixed;
    width: calc(var(--bs-main-nav-width) - var(--bs-main-nav-width-sm));
    z-index: 1030;
}

/* (3) El puente: los 10 px del margin-left del cartel pasan a ser del cartel
   (un pseudo-elemento es parte de su elemento para el :hover y para el
   mouseover), asi que ir del icono al cartel en linea recta nunca sale del
   item. Medido sin esto: x=75..84 en la fila del icono es `.page-content`. */
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav > .nav-item.sge-flyout-open > .nav-link > .nav-text::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 100%;
    width: 10px;
}

/* (4) El boton "?" de la guia (sge-guide.css: fixed, 44 px, a 20 px del
   borde de abajo a la izquierda) queda ENCIMA del ultimo icono de la barra
   colapsada: medido con la lista scrolleada al fondo, el centro del icono de
   Soporte es el boton y su submenu no se podia abrir. Un margen abajo en la
   lista deja que el ultimo icono suba por encima del boton. */
html[data-menu-size=condensed] .wrapper .main-nav .navbar-nav {
    padding-bottom: 72px;
}