/**
 * Theme Name: nanofit Child
 * Description: Child theme for the nanofit
 * Author: LineThemes
 * Template: nanofit
 */

/* ===== DESKTOP MEGA MENU FIX (NanoFit) ===== */
@media (min-width: 992px) {

  /* Make header the positioning reference */
  .site-header,
  header {
    position: relative;
    z-index: 999;
  }

  /* Parent menu item */
  .mega-3col {
    position: static !important;
  }

  /* Mega menu container */
  .mega-3col > .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;

    display: grid;
    grid-template-columns: repeat(3, 1fr);

    width: 100%;
    max-width: 1200px;
    margin: 0 auto;

    padding: 30px 40px;
    gap: 20px;

    background: #d71920; /* match your red */
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);

    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
  }

  /* Show on hover */
  .mega-3col:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
  }

  /* Menu items */
  .mega-3col > .sub-menu li {
    width: 100%;
  }

  .mega-3col > .sub-menu li a {
    color: #fff;
    padding: 8px 0;
    display: block;
    font-weight: 500;
    text-transform: uppercase;
  }

  .mega-3col > .sub-menu li a:hover {
    opacity: 0.8;
  }
}

/**/

/* ===== NANO FIT 5-COLUMN MEGA MENU – SIDE OFFSET FIX ===== */
@media (min-width: 992px) {

  /* Header must control positioning */
  header,
  .site-header,
  .header-inner {
    position: relative;
    z-index: 999;
  }

  /* Parent menu item */
  .mega-5col {
    position: static !important;
  }

  /* Force mega menu to break out of nav width */
  .mega-5col > .sub-menu {
    position: absolute !important;
    top: 100%;
    left: 0 !important;
    right: 0 !important;

    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    max-width: 1400px;
    width: 100%;

    padding: 30px 40px;
    gap: 12px 24px;

    background: #d71920;
    box-shadow: 0 20px 40px rgba(0,0,0,0.25);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease;
  }

  /* Show menu */
  .mega-5col:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  /* Menu items */
  .mega-5col > .sub-menu li {
    width: 100%;
  }

  .mega-5col > .sub-menu li a {
    display: block;
    padding: 6px 0;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
  }

}