/* ================================================================
   anwaltarbeitsrecht.net — Mega-Menu Hover Fix — v7 / 1.9.5
   ----------------------------------------------------------------
   Behebt die in v6 verbliebenen Hover-Bugs:

   (A) "Menue rutscht beim Hovern nach links"
       Ursache:
       - .awa-has-mega > a::after Bridge ist nur 6px hoch
         (bottom:-4px, height:6px). Zwischen Bridge-Top und Panel-
         Top entsteht ein 1-2px breiter "Dead-Zone"-Streifen.
       - Der Trigger bekommt beim :hover die animierte Underline
         (.main-header-menu > li > a::before, transform:scaleX)
         und gleichzeitig wechselt das Panel von translateY(-4px)
         auf translateY(0). Beides zusammen wirkt als "Slide nach
         links / unten".
       Loesung: Bridge volle Trigger-zu-Panel-Strecke abdecken;
       kein translateY mehr beim Open/Close (nur opacity).

   (B) "Submenu schliesst sich bevor man es erreichen kann"
       Ursache: visibility-Transition ist .12s mit delay 0s — d.h.
       beim Verlassen des Triggers verschwindet das Panel nach
       120ms. Beim diagonalen Maus-Move vom Trigger ins Panel
       reisst der :hover-State des <li> kurz ab (Dead-Zone aus A)
       und das Panel schliesst sofort.
       Loesung: Close-Delay 350ms (open: 0ms). Die Maus hat genug
       Zeit, die Trigger-zu-Panel-Luecke zu ueberbruecken.

   (C) Master-Detail-Flyout (Bundesland -> Staedte) hat dieselben
       Symptome im Innern des Panels. Selbe Behandlung.

   v7 wird NACH v6 geladen und kommt mit hoechster Spezifitaet,
   um v5 + v6 ueberzustimmen.
   ================================================================ */

body { --awa-build: "v1.9.5-hover-stable" !important; }

/* === (1) Menue-Container als Positionierungsanker ================
   Die Top-Level-<li class="awa-has-mega"> bleiben position:static
   (von v6), damit das Panel an einem stabilen Anker oberhalb
   verankert wird. Wir setzen position:relative explizit am Nav-
   Container, damit die absolute Positionierung des Panels deter-
   ministisch ist und nicht zur Astra-Header-Wrapper-Box hochwandert. */
html body .main-header-menu,
html body ul.main-header-menu,
html body .main-navigation > ul,
html body .ast-builder-menu ul.main-header-menu {
  position: relative !important;
}

/* === (2) Panel-Positionierung — KEIN translateY beim Open/Close ==
   Nur opacity + visibility transitionen; das Panel sitzt fest auf
   seiner Endposition. So entsteht keine "Slide"-Bewegung beim
   Erscheinen, und die Maus-Bridge unter dem Trigger trifft
   garantiert auf eine sichtbare Oberkante. */
html body .main-header-menu .awa-has-mega .awa-mega-panel,
html body .main-navigation .awa-has-mega .awa-mega-panel {
  transform: translateX(-50%) !important;
  /* Open sofort, Close mit 350ms Grace-Period */
  transition:
    opacity .15s ease .35s,
    visibility 0s linear .5s !important;
}

html body .main-header-menu .awa-has-mega:hover > .awa-mega-panel,
html body .main-header-menu .awa-has-mega:focus-within > .awa-mega-panel,
html body .main-navigation .awa-has-mega:hover > .awa-mega-panel,
html body .main-navigation .awa-has-mega:focus-within > .awa-mega-panel,
html body .awa-mega-panel:hover,
html body .awa-mega-panel:focus-within {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(-50%) !important;
  /* Open sofort */
  transition:
    opacity .15s ease 0s,
    visibility 0s linear 0s !important;
}

/* === (3) Volle Bridge zwischen Trigger und Panel =================
   Vorher 6px hoch (v6) — zu schmal. Jetzt 24px, deckt komplette
   Strecke von Trigger-Unterkante bis Panel-Oberkante ab. Volle
   Item-Breite + 16px Ueberhang links/rechts, damit auch diagonale
   Mausbewegungen nicht aus dem Hover-Bereich rutschen. */
html body .awa-has-mega > a {
  position: relative !important;
}
html body .awa-has-mega > a::after {
  content: "" !important;
  position: absolute !important;
  left: -16px !important;
  right: -16px !important;
  bottom: -24px !important;
  height: 28px !important;
  background: transparent !important;
  pointer-events: auto !important;
  z-index: 1 !important;
}

/* === (4) Panel beruehrt das Menue ohne Luecke ====================
   margin-top:0 ueberschreibt das margin-top:8px aus fixes-v5.css.
   Zusammen mit top:100% und der breiten Bridge oben gibt es keinen
   Pixel-Streifen ohne Hover-Coverage mehr. */
html body .main-header-menu .awa-has-mega .awa-mega-panel,
html body .main-navigation .awa-has-mega .awa-mega-panel {
  top: 100% !important;
  margin-top: 0 !important;
}

/* === (5) Top-Level <a> bewegt sich beim Hover NICHT ==============
   v5's Underline-Animation (transform:scaleX am ::before) ist
   harmlos, aber andere Hover-States koennten transform/translate
   bringen. Wir zwingen alle Top-Level-Trigger zu transform:none
   im Hover-State (Ausnahme: CTA "Anfrage stellen" als letztes
   Item, das bekommt :hover translateY(-1px) als Mikro-Lift). */
html body .main-header-menu > li:not(:last-child) > a,
html body .main-navigation > ul > li:not(:last-child) > a {
  transform: none !important;
}
html body .main-header-menu > li:not(:last-child) > a:hover,
html body .main-header-menu > li:not(:last-child) > a:focus-visible,
html body .main-navigation > ul > li:not(:last-child) > a:hover,
html body .main-navigation > ul > li:not(:last-child) > a:focus-visible {
  transform: none !important;
}

/* === (6) Cross-Item Snap-Close (aus v6 uebernommen, geschaerft) ==
   Wenn ein anderes Top-Level :hover/:focus bekommt, schliesst das
   aktuell offene Panel sofort — verhindert Ueberlappung. Wichtig:
   transition:none, damit die Grace-Period aus (2) hier nicht greift. */
html body .main-header-menu:has(.awa-has-mega:hover) .awa-has-mega:not(:hover):not(:focus-within) > .awa-mega-panel,
html body .main-navigation:has(.awa-has-mega:hover) .awa-has-mega:not(:hover):not(:focus-within) > .awa-mega-panel,
html body .main-header-menu:has(.awa-has-mega:focus-within) .awa-has-mega:not(:hover):not(:focus-within) > .awa-mega-panel,
html body .main-navigation:has(.awa-has-mega:focus-within) .awa-has-mega:not(:hover):not(:focus-within) > .awa-mega-panel {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 0s, visibility 0s !important;
}

/* === (7) Master-Detail-Flyout (Bundesland -> Staedte) ============
   Selbe Probleme im Innenleben: Flyout schliesst sofort beim
   Maus-Move vom Master-<li> in den Flyout-Bereich, wenn die
   Bridge nicht trifft. Wir geben hier ebenfalls eine Grace-Period
   und vergroessern die laterale Bridge. */
html body .awa-mega-master-detail .awa-md-item > .awa-md-flyout {
  transition:
    opacity .15s ease .25s,
    visibility 0s linear .4s !important;
}
html body .awa-mega-master-detail .awa-md-item:hover > .awa-md-flyout,
html body .awa-mega-master-detail .awa-md-item:focus-within > .awa-md-flyout {
  transition:
    opacity .15s ease 0s,
    visibility 0s linear 0s !important;
}

/* Default-Aktiv-Flyout: gleiches Timing-Pattern beibehalten */
html body .awa-mega-master-detail .awa-md-wrapper:not(:hover):not(:focus-within) .awa-md-item:first-child > .awa-md-flyout {
  transition:
    opacity .15s ease 0s,
    visibility 0s linear 0s !important;
}

/* Master-Trigger-Bridge: breiter als v5 (16px -> 32px) und auch
   vertikal etwas Ueberhang, damit der Cursor beim diagonalen Move
   vom Master-Item-Trigger ins Flyout nicht aus dem Hover-Bereich
   rutscht. */
html body .awa-mega-master-detail .awa-md-item:hover > .awa-md-trigger::after,
html body .awa-mega-master-detail .awa-md-item:focus-within > .awa-md-trigger::after {
  content: "" !important;
  position: absolute !important;
  top: -6px !important;
  bottom: -6px !important;
  left: 100% !important;
  width: 32px !important;
  background: transparent !important;
  pointer-events: auto !important;
  z-index: 6 !important;
}

/* === (8) Caret-Drehung weich, keine Layout-Auswirkung ============
   Die Caret-Animation aus v5 (rotate(180deg) beim Hover) ist OK,
   aber wir fixieren Breite und transform-origin, damit kein Layout-
   Shift entsteht. */
html body .awa-menu-caret {
  width: .7em !important;
  height: .7em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transform-origin: center center !important;
  will-change: transform !important;
}

/* === (9) Reduzierte Bewegung beibehalten =========================
   prefers-reduced-motion respektieren — kein Fade, keine Bridge-
   Animation. Panel snapt direkt. */
@media (prefers-reduced-motion: reduce) {
  html body .main-header-menu .awa-has-mega .awa-mega-panel,
  html body .main-navigation .awa-has-mega .awa-mega-panel,
  html body .awa-mega-master-detail .awa-md-item > .awa-md-flyout {
    transition: opacity 0s, visibility 0s !important;
  }
}