/* 22Media Premium Pro v6.29 — desktop navigation rhythm + unclipped premium mega submenu */

/* ===== DESKTOP PRIMARY NAV: balanced breathing room ===== */
@media (min-width:981px){
  .m22-header-v66 .m22-nav-wrap,
  .m22-header-v66 .m22-nav-inner,
  .m22-header-v66 .m22-primary-nav,
  .m22-header-v66 .m22-nav-list,
  .m22-header-v66 .m22-nav-list>li{
    overflow:visible!important;
  }

  .m22-header-v66 .m22-nav-inner{
    gap:14px!important;
  }

  .m22-header-v66 .m22-nav-list{
    justify-content:center!important;
    gap:clamp(4px,.42vw,9px)!important;
    padding:0 5px!important;
  }

  .m22-header-v66 .m22-nav-list>li{
    position:relative!important;
    flex:0 0 auto!important;
  }

  .m22-header-v66 .m22-nav-list>li>a{
    min-height:39px!important;
    padding:8px clamp(7px,.48vw,11px)!important;
    border-radius:11px!important;
    line-height:1!important;
    gap:5px!important;
  }

  .m22-header-v66 .m22-nav-list>li>a .m22-menu-label{
    line-height:1.1!important;
  }

  /* Keep utilities visually detached from the editorial navigation. */
  .m22-header-v66 .m22-nav-tools{
    margin-left:8px!important;
    padding-left:12px!important;
    gap:6px!important;
  }

  /* ===== PREMIUM TWO-COLUMN SUBMENU =====
     Wider cells stop Punjab / Khyber Pakhtunkhwa and similar labels clipping. */
  .m22-header-v66 .m22-nav-list>li>.sub-menu{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(185px,1fr))!important;
    grid-auto-flow:row!important;
    gap:6px 8px!important;
    width:max-content!important;
    min-width:420px!important;
    max-width:min(470px,calc(100vw - 36px))!important;
    padding:11px!important;
    margin-top:8px!important;
    border:1px solid #dbe5f2!important;
    border-radius:17px!important;
    background:rgba(255,255,255,.995)!important;
    box-shadow:0 24px 64px rgba(7,31,72,.18)!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
    z-index:9999!important;
    overflow:visible!important;
  }

  .m22-header-v66 .m22-nav-list>li>.sub-menu>li{
    width:100%!important;
    min-width:0!important;
  }

  .m22-header-v66 .m22-nav-list>li>.sub-menu>li>a{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:43px!important;
    padding:10px 12px!important;
    border-radius:10px!important;
    color:#34445d!important;
    font-size:11.2px!important;
    font-weight:760!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  .m22-header-v66 .m22-nav-list>li>.sub-menu>li>a:hover,
  .m22-header-v66 .m22-nav-list>li>.sub-menu>li.current-menu-item>a{
    background:#eef5ff!important;
    color:#075fdc!important;
  }

  /* A small invisible hover bridge removes the gap between parent and flyout. */
  .m22-header-v66 .m22-nav-list>li.menu-item-has-children:before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:100%!important;
    height:12px!important;
    z-index:9998!important;
  }

  /* Near-right menus open inward so nothing is cut by the viewport. */
  .m22-header-v66 .m22-nav-list>li:nth-last-child(-n+5)>.sub-menu{
    left:auto!important;
    right:0!important;
  }

  /* Nested submenu, if used, stays contained and readable. */
  .m22-header-v66 .m22-nav-list .sub-menu .sub-menu{
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
  }
}

/* Laptop widths: preserve breathing room without squeezing labels. */
@media (min-width:981px) and (max-width:1580px){
  .m22-header-v66 .m22-nav-list{gap:4px!important}
  .m22-header-v66 .m22-nav-list>li>a{padding-left:7px!important;padding-right:7px!important;font-size:10.8px!important}
  .m22-header-v66 .m22-nav-list>li>.sub-menu{
    grid-template-columns:repeat(2,minmax(175px,1fr))!important;
    min-width:400px!important;
  }
}

@media (min-width:981px) and (max-width:1260px){
  .m22-header-v66 .m22-nav-list{gap:3px!important}
  .m22-header-v66 .m22-nav-list>li>a{padding-left:6px!important;padding-right:6px!important;font-size:10.2px!important}
  .m22-header-v66 .m22-nav-list>li>.sub-menu{
    grid-template-columns:repeat(2,minmax(170px,1fr))!important;
    min-width:390px!important;
  }
}

/* RTL desktop submenu mirrors cleanly. */
@media (min-width:981px){
  body.m22-lang-ur .m22-header-v66 .m22-nav-list>li>.sub-menu{
    text-align:right!important;
  }
  body.m22-lang-ur .m22-header-v66 .m22-nav-list>li:nth-last-child(-n+5)>.sub-menu{
    right:auto!important;
    left:0!important;
  }
}

/* Dark mode parity. */
.m22-dark .m22-header-v66 .m22-nav-list>li>.sub-menu,
[data-theme="dark"] .m22-header-v66 .m22-nav-list>li>.sub-menu{
  background:rgba(15,25,42,.995)!important;
  border-color:#2a3a51!important;
  box-shadow:0 26px 70px rgba(0,0,0,.38)!important;
}
.m22-dark .m22-header-v66 .m22-nav-list>li>.sub-menu>li>a,
[data-theme="dark"] .m22-header-v66 .m22-nav-list>li>.sub-menu>li>a{color:#d4deed!important}
.m22-dark .m22-header-v66 .m22-nav-list>li>.sub-menu>li>a:hover,
[data-theme="dark"] .m22-header-v66 .m22-nav-list>li>.sub-menu>li>a:hover{background:#18263b!important;color:#8fbcff!important}

/* Mobile retains the v6.28 drawer geometry; only add a little rhythm between rows. */
@media (max-width:980px){
  .m22-header-v66 .m22-nav-list{row-gap:8px!important}
  .m22-header-v66 .m22-nav-list .sub-menu{margin-top:6px!important;margin-bottom:2px!important}
}
