/* ==== tbh-mega-nowrap-fix ==== */

/* ============================================================
   MEGA MENU — no horizontal scroll, no clipped text.
   Long links (e.g. "Driver Medicals (DVLA, HGV, Taxi, PCO)") were
   nowrap and forced the panel wider than its box, creating a scrollbar
   and clipping. Allow graceful two-line wrapping, kill overflow.
   Matches the About benchmark: equal 236px columns, 36px gaps, 30px pad.
   ============================================================ */
@media (min-width:980px){
  .nav-dropdown.nav-mega,
  .nav-dropdown.nav-mega .nav-mega-cols{
    overflow:visible !important;           /* never scroll */
  }
  .nav-mega .nav-mega-col > a[role="menuitem"]{
    white-space:normal !important;         /* was nowrap -> allow wrap */
    overflow-wrap:break-word !important;
    word-break:normal !important;
    line-height:1.34 !important;
    align-items:flex-start !important;      /* wrapped lines align left/top */
    min-width:0 !important;
    text-overflow:clip !important;
    overflow:visible !important;
  }
  /* keep the hover chevron from forcing a nowrap line */
  .nav-mega .nav-mega-col > a[role="menuitem"]::after{
    flex:0 0 auto !important;
  }
  /* equal columns, equal alignment — reinforce the About-style grid */
  .nav-mega .nav-mega-col{
    flex:0 0 236px !important;
    width:236px !important;
    max-width:236px !important;
    min-width:236px !important;
    align-self:flex-start !important;
  }
}

/* ==== tbh-nav-bridge-fix ==== */

/* ============================================================
   NAV HOVER-BRIDGE FIX (desktop mega interaction)
   The old bridge (.nav-primary-item:hover .nav-mega::before) spanned the
   full panel width and reached 44px UP over the entire trigger row, so an
   open menu captured the cursor above neighbouring triggers — they only
   opened once the cursor cleared the panel's width. This shrinks the
   bridge to the real 2-3px gap directly under the panel, never over the
   triggers, and keeps the trigger row above the panel in the stack.
   ============================================================ */
@media (min-width:980px){
  /* neutralise the oversized bridge, replace with a minimal gap bridge */
  .nav-primary-item:hover .nav-mega::before,
  .nav-primary-item .nav-mega::before{
    top:-4px !important;
    height:4px !important;      /* was 46px covering the whole trigger row */
    left:0 !important;
    right:0 !important;
    pointer-events:auto;
  }
  /* triggers always sit above the open panel and stay interactive */
  .nav-tier2 .nav-primary{ position:relative; z-index:70 !important; }
  .nav-primary-item{ z-index:71 !important; }
  .nav-primary-link,
  .nav-primary-btn{ position:relative; z-index:72 !important; }
  .nav-dropdown.nav-mega,
  .nav-dropdown{ z-index:60 !important; }
  /* panel begins exactly below the row (no upward translate over labels) */
  .nav-dropdown{ top:calc(100% + 2px) !important; }
}