/* ============================================================
   Black Foot Logistics — Navigation hover fix (additive patch)
   Loaded after styles.css; does not modify it.
   Fixes: dropdown closing while the cursor crosses the 14px gap
   between the nav trigger and the dropdown panel.
   ============================================================ */

@media (hover: hover) and (min-width: 1025px) {

  /* Invisible bridge covering the gap between trigger and panel,
     so the cursor never technically leaves the menu while moving down. */
  .dropdown::before {
    content: '';
    position: absolute;
    top: -18px;
    left: -16px;
    right: -16px;
    height: 18px;
  }

  /* Keep the panel open via pure CSS whenever the cursor is anywhere
     over the nav item or the panel itself — independent of the JS
     mouseenter/mouseleave timing. */
  .has-dropdown:hover .dropdown,
  .has-dropdown:focus-within .dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  .has-dropdown:hover .chevron,
  .has-dropdown:focus-within .chevron {
    transform: rotate(180deg);
  }

  /* Grace period: when the cursor slips off (e.g. a diagonal path out
     the side), wait 250ms before beginning to close, giving the user
     time to come back. Opening stays instant. */
  .dropdown {
    transition-delay: 250ms;
  }
  .has-dropdown:hover .dropdown,
  .has-dropdown:focus-within .dropdown,
  .has-dropdown[data-open="true"] .dropdown {
    transition-delay: 0ms;
  }
}
