/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* ========== Mega menu (CSS-only) ========== */

/* Base: all panels hidden */
.gp-mega-panel { display: none; }

/* Desktop only */
@media (min-width:1025px) {
  .inside-navigation { position: relative; z-index: 5; }

  /* Typical panel positioning; style to taste */
  .gp-mega-panel {
    position: absolute; left: 0; right: 0; top: 100%; backdrop-filter: blur(8px);
    box-shadow: 0 12px 24px rgba(0,0,0,.08);
  }

  /* Show the right panel when its parent LI is hovered or focused */
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-air:hover)            #mega-air,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-air:focus-within)     #mega-air,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-protector:hover)      #mega-protector,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-protector:focus-within)#mega-protector,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-storm:hover)          #mega-storm,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-storm:focus-within)   #mega-storm,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-mobile:hover)         #mega-mobile,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-mobile:focus-within)  #mega-mobile,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-travel:hover)         #mega-travel,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-travel:focus-within)  #mega-travel,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-spacecase:hover)      #mega-spacecase,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-spacecase:focus-within)#mega-spacecase,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-rackmount:hover)      #mega-rackmount,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-rackmount:focus-within)#mega-rackmount,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-torches:hover)        #mega-torches,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-torches:focus-within) #mega-torches,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-accessories:hover)    #mega-accessories,
  .inside-navigation:has(.main-nav > ul > li.has-mega.mega-accessories:focus-within)#mega-accessories,
  /* Keep it open while hovering/focusing the panel itself */
  .inside-navigation:has(#mega-air:hover)           #mega-air,
  .inside-navigation:has(#mega-air:focus-within)    #mega-air,
  .inside-navigation:has(#mega-protector:hover)     #mega-protector,
  .inside-navigation:has(#mega-protector:focus-within)#mega-protector,
  .inside-navigation:has(#mega-storm:hover)         #mega-storm,
  .inside-navigation:has(#mega-storm:focus-within)  #mega-storm,
  .inside-navigation:has(#mega-mobile:hover)        #mega-mobile,
  .inside-navigation:has(#mega-mobile:focus-within) #mega-mobile,
  .inside-navigation:has(#mega-travel:hover)        #mega-travel,
  .inside-navigation:has(#mega-travel:focus-within) #mega-travel,
  .inside-navigation:has(#mega-spacecase:hover)     #mega-spacecase,
  .inside-navigation:has(#mega-spacecase:focus-within)#mega-spacecase,
  .inside-navigation:has(#mega-rackmount:hover)     #mega-rackmount,
  .inside-navigation:has(#mega-rackmount:focus-within)#mega-rackmount,
  .inside-navigation:has(#mega-torches:hover)       #mega-torches,
  .inside-navigation:has(#mega-torches:focus-within)#mega-torches,
  .inside-navigation:has(#mega-accessories:hover)   #mega-accessories,
  .inside-navigation:has(#mega-accessories:focus-within)#mega-accessories {
    display: grid; /* or block */
  }

  /* Hide native dropdowns for these parents on desktop */
  .main-navigation .main-nav > ul > li.has-mega > .sub-menu { display: none !important; }
  .main-navigation .main-nav > ul > li.has-mega.menu-item-has-children > a .dropdown-menu-toggle { display: none !important; }

  .main-navigation .main-nav > ul > li.has-mega > a::after{
    content:"\23F7";              /* or try "▼" / "▸" */
    margin-left:.4rem;
    font-size:16px;
    line-height:1;
    opacity:.9;
    transition:transform .2s ease, opacity .2s ease;
  }
  .main-navigation .main-nav > ul > li.has-mega:hover > a::after,
  .main-navigation .main-nav > ul > li.has-mega:focus-within > a::after{
    transform:rotate(180deg);
    opacity:1;
  }
}

/* Mobile: disable megas; use Off-Canvas menu */
@media (max-width:1024px) {
  .gp-mega-panel { display: none !important; }
}