/* ? FINÁLNÍ PATCH (Venus/Shoptet mega menu)
   - funguje jen pro horní menu (TOP NAV), nerozbije levý strom kategorií
   - panel je full-width jako na tvém “správném” screenu
   - položky nejsou přeházené ani useknuté: vynutíme čistý grid
*/
@media (min-width: 768px) {

  /* 1) schovat defaultně jen TOP NAV submenu */
  #header .navigation > ul > li > ul.menu-level-2{
    display: none !important;
  }

  /* 2) ukázat jen při hover/focus TOP položky */
  #header .navigation > ul > li:hover > ul.menu-level-2,
  #header .navigation > ul > li:focus-within > ul.menu-level-2{
    display: block !important;

    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;

    /* full-bleed */
    width: 100vw !important;
    margin: 0 !important;
    transform: translateX(calc(50% - 50vw)) !important;

    background: #fff !important;
    padding: 26px 0 !important;
    border-top: 1px solid rgba(0,0,0,.08) !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.18) !important;

    overflow: hidden !important; /* žádné divné pruhy */
    z-index: 9999 !important;
    box-sizing: border-box !important;
  }

  /* 3) VYNUTIT LAYOUT položek: grid, žádné floaty/šířky z šablony */
  #header .navigation > ul > li:hover > ul.menu-level-2,
  #header .navigation > ul > li:focus-within > ul.menu-level-2{
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important; /* 5 sloupců jako na screenu */
    gap: 22px 56px !important;
    align-items: start !important;
  }

  /* 4) kontejnery (li) v gridu: zabít float/width a centrovat do layout šířky */
  #header .navigation > ul > li:hover > ul.menu-level-2 > li,
  #header .navigation > ul > li:focus-within > ul.menu-level-2 > li{
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;

    max-width: 1200px;            /* šířka obsahu stránky */
    box-sizing: border-box;
  }

  /* 5) udělej z celého submenu “container” stejné jako web (centrované) */
  #header .navigation > ul > li:hover > ul.menu-level-2,
  #header .navigation > ul > li:focus-within > ul.menu-level-2{
    padding-left: calc((100vw - 1200px) / 2) !important;
    padding-right: calc((100vw - 1200px) / 2) !important;
  }

  /* 6) bezpečnost: nic uvnitř nesmí roztáhnout šířku */
  #header .navigation > ul > li:hover > ul.menu-level-2 * ,
  #header .navigation > ul > li:focus-within > ul.menu-level-2 *{
    max-width: 100%;
    box-sizing: border-box;
  }

  /* 7) breakpointy */
  @media (max-width: 1200px){
    #header .navigation > ul > li:hover > ul.menu-level-2,
    #header .navigation > ul > li:focus-within > ul.menu-level-2{
      grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
      padding-left: 24px !important;
      padding-right: 24px !important;
    }
  }
  @media (max-width: 992px){
    #header .navigation > ul > li:hover > ul.menu-level-2,
    #header .navigation > ul > li:focus-within > ul.menu-level-2{
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
  }
}


/* ? Mega menu vždy úplně nahoře (nad vším), ať se nic nepřekrývá */
@media (min-width: 768px) {

  /* header nad ostatní obsah */
  #header { position: relative !important; z-index: 99990 !important; }

  /* panel mega menu úplně nejvýš */
  #header .navigation > ul > li > ul.menu-level-2,
  #header .navigation > ul > li:hover > ul.menu-level-2,
  #header .navigation > ul > li:focus-within > ul.menu-level-2{
    z-index: 99999 !important;
    position: absolute !important;
  }

  /* když má submenu ještě wrapper (často Shoptet/Venus), zvedni i ten */
  #header .navigation,
  #header .navigation *{
    position: relative;
  }
}

/* ADMIN lišta má svoje z-indexy, přetlačíme je taky */
.admin-bar,
body .admin-bar,
body .admin-menu,
body .admin-toolbar{
  z-index: 99998 !important;
}