/* ===== Vorschau Navigation und Kontakt, Fondsdepot-LP (29.10.2026, Builder A) =====
   Anlass: Alex „mit den menüs … und callback widget visibility haben wir aktuell ziemliches chaos über die landingpages und auflösungen hinweg“,
   Tablet: „wieso auf 1920 nur ein navigations element aber bei 768 zwei elemente“. Konzept: legacy_trigonus_work/regeln-navigation-kontakt/01-konzept.md §3b.
   Diese Datei lädt tabelle11.php NUR, wenn ein Vorschau-Parameter gesetzt ist (Body-Klassen lpv-*, tabelle11-konfig.php); ohne Parameter bleibt die Seite unverändert.
   Grundregeln: oben höchstens ein festes Element (Band ODER Kapitelleiste), unten höchstens ein Kontaktweg (Balken ODER Reiter); Nach-oben-Pfeil bleibt ab Desktop-Logik (Alex: „nein pfeil nicht weg lassen“). */

/* ---------- ?lpmenue=aus: Hauptmenü ganz aus (Logo im Kopf und in der Kapitelleiste führt zur Startseite; Kopf-Telefon bleibt) ---------- */
body.lpv-menue-aus #enigma_nav_top { display: none !important; }

/* ---------- ?lpmenue=statisch: Band ab 768 oben stehend, scrollt weg (Klasse tg-band-statisch, trigonus-redesign.css 3p); mobil Burger statisch (tg-burger-statisch, 3g) ---------- */

/* ---------- ?lptablet=unten: 768–991 nur der Balken unten, Band scrollt weg (ein Navigationselement wie bei 1920) ---------- */
@media (min-width: 768px) and (max-width: 991px) {
  body.lpv-tablet-unten .navigation_menu.affix { position: static !important; top: auto !important; box-shadow: none !important; }
}

/* ---------- ?lptablet=oben: 768–991 wie Desktop: Kapitelleiste oben ab dem Wegweiser, kein Balken (v5.js: Umschaltpunkt 768) ---------- */
@media (min-width: 768px) and (max-width: 991px) {
  body.lpv-tablet-oben .v5-kap { top: 0; bottom: auto; transform: translateY(-110%); transition: transform .2s; visibility: hidden; border-top: 0; border-bottom: 1px solid var(--line, #d9dcdf); box-shadow: 0 2px 10px rgba(15, 36, 83, .08); }
  body.lpv-tablet-oben .v5-kap.is-sichtbar { transform: none; visibility: visible; }
  body.lpv-tablet-oben .v5-kap__in { min-height: 64px; padding-top: 0; padding-bottom: 0; gap: 12px; }
  body.lpv-tablet-oben .v5-kap__logo { display: flex; }
  body.lpv-tablet-oben .v5-kap__tel { display: flex; gap: 10px; }
  body.lpv-tablet-oben .v5-kap__tel > a { display: none; } /* Nummer passt bei 768 nicht in die Zeile; „Rückruf“ bleibt (?lpkontakt=leiste), Kopf-Telefon oben auf der Seite */
  body.lpv-tablet-oben .v5-kap__liste { flex-direction: row; gap: 0; }
  body.lpv-tablet-oben .v5-kap__liste a { padding: 10px 5px; font-size: 14px; white-space: nowrap; border-bottom: 3px solid transparent; } /* sechs Kapitel, Logo und Hauptknopf einzeilig bei 768 */
  body.lpv-tablet-oben.lpv-cta .v5-kap__tel { display: none !important; } /* Hauptknopf und „Rückruf“ passen bei 768 nicht nebeneinander; Konfliktregel §2.4: Hauptknopf vor Kontaktweg (Kontakt: Kopf-Telefon, Kontaktblock; mit ?lpkontakt=reiter der Reiter) */
  body.lpv-tablet-oben .v5-kap__liste li:last-child a { border-bottom: 3px solid transparent; }
  body.lpv-tablet-oben .v5-kap__liste a.is-aktiv { border-bottom-color: var(--blue, #13318a); }
  body.lpv-tablet-oben .v5-bar { display: none !important; }
  body.lpv-tablet-oben.tg-kopf26 .enigma_footer_area { padding-bottom: 0 !important; } /* kein Platz für den Balken nötig (v5.css: 76 px bis 991) */
  body.lpv-tablet-oben a.enigma_scrollup[style*="block"], body.lpv-tablet-oben a.enigma_scrollup[style*="inline"] { display: block !important; } /* Pfeil wie am Desktop (v6.css ab 992) */
}

/* ---------- ?lpkontakt=reiter: Plugin-Reiter wie Flexgold, Telefon/Rückruf in der Kapitelleiste aus (Alex: „stand von flexgold … als default“) ---------- */
@media (min-width: 992px) {
  html body.lpv-kontakt-reiter #jae-rueckrufbitte-plugin { display: block !important; }
  body.lpv-kontakt-reiter .v5-kap__tel { display: none !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
  html body.lpv-kontakt-reiter.lpv-tablet-oben #jae-rueckrufbitte-plugin { display: block !important; }
  body.lpv-kontakt-reiter.lpv-tablet-oben .v5-kap__tel { display: none !important; }
}
/* über der Banktabelle weicht der Reiter (Konzept §2.2: Tabellenknöpfe rechts nie verdeckt), ohne Bewegung */
/* 29.10.2026 Freigabe Alex (N11): „kompromiss variante trägt nur bei 1440 - bei 1024 würden die kleinen buttons trotzdem überdecken und ich würde mit text dauerhaft setzen“ → Reiter bleibt über der Banktabelle
   mit Text sichtbar (Standard); stattdessen blendet er bei Inaktivität aus, wenn er Inhalt überdeckt (js/tg26-ruhe.js). Die folgende Ausblendregel gilt nur noch als alter Stand ?ueberbanken=aus. */
@media (max-width: 1599px) { body.lpv-kontakt-reiter.lpv-ub-aus.v5-ueber-banken #jae-rueckrufbitte-plugin:not(.jcb--offen) .jcb-launch { visibility: hidden !important; opacity: 0 !important; transition: none !important; } } /* 29.10.2026 Alex: „auf 1920px verdeckt er nichts“: ab 1600 px liegt der Reiter (203 px + 12 px) neben der 1132 px breiten Tabelle und bleibt sichtbar */

/* ---------- ?lpcta=weg|vergleich: Hauptknopf rechts in der Kapitelleiste statt der Telefonnummer ---------- */
.v5-kap__cta { flex: none; white-space: nowrap; }
body.lpv-cta .v5-kap__tel > a { display: none; } /* Nummer weicht; „Rückruf“ bleibt bei ?lpkontakt=leiste als zweiter, heller Knopf */
@media (max-width: 991px) { body.lpv-cta:not(.lpv-tablet-oben) .v5-kap__cta { display: none; } } /* dort steht der Hauptknopf im Balken */
@media (max-width: 767px) { body.lpv-cta .v5-kap__cta { display: none; } }

/* ---------- ?xs=kompakt: unter 400 px Kapitel und Rückruf im Balken nur als Symbol, Hauptknopf breiter ---------- */
@media (max-width: 399px) {
  body.lpv-xs-kompakt .v5-bar__kap, body.lpv-xs-kompakt .v5-bar__tel { min-width: 48px; width: 48px; padding: 0; }
  body.lpv-xs-kompakt .v5-bar__kap span, body.lpv-xs-kompakt .v5-bar__tel span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  body.lpv-xs-kompakt .v5-bar__tel img { width: 32px; height: 32px; }
  body.lpv-xs-kompakt .v5-bar { gap: 6px; }
  body.lpv-xs-kompakt .v5-bar .v5-bar__haupt { padding: 8px 10px; white-space: nowrap; } /* „Fondsdepots vergleichen“ einzeilig ab 360 px (gemessen: ohne kompakt zweizeilig bei 360 und 375) */
}

@media (prefers-reduced-motion: reduce) { body[class*="lpv-"] .v5-kap { transition: none !important; } }

/* ---------- ?lpmenue=tausch (29.10.2026, Alex): Band klebt mit, bis es ausgetauscht wird. Ab 992 px wie bisher (Kapitelleiste ersetzt das Band, v5.css Korrektur 09);
   unter 992 px (Tablet und Handy) verschwindet Band bzw. Menü-Knopf genau dann, wenn unten der Balken erscheint (Body-Klasse v5-bar-an aus v5.js), und kommt zurück, wenn der Balken geht. ---------- */
@media (max-width: 991px) {
  body.lpv-menue-tausch #enigma_nav_top, body.lpv-menue-tausch .navigation_menu.affix { transition: transform .2s ease, visibility .2s; }
  body.lpv-menue-tausch.v5-bar-an #enigma_nav_top, body.lpv-menue-tausch.v5-bar-an .navigation_menu.affix { transform: translateY(-130%) !important; visibility: hidden !important; }
}
@media (prefers-reduced-motion: reduce) { body.lpv-menue-tausch #enigma_nav_top, body.lpv-menue-tausch .navigation_menu.affix { transition: none; } }

/* ---------- ?lpkontakt=reitertel (29.10.2026, Alex: Conversion-Kompromiss zu Punkt 3): Reiter wie Flexgold, sichtbar die Telefonnummer statt „Haben Sie Fragen?“; Klick öffnet weiter den Rückruf (title „Rückruf vereinbaren“) ---------- */
@media (min-width: 768px) {
  body.lpv-kontakt-reitertel #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__frage { display: none !important; }
  body.lpv-kontakt-reitertel #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb::after { content: "06181 908061-10"; white-space: nowrap; font-weight: 600; }
}

/* ---------- ?ueberbanken=sichtbar|knopf (29.10.2026, Alex): Reiter über der Banktabelle nicht ausblenden (sichtbar) bzw. dort zum runden Knopf ohne Text verkleinern (knopf, wie mobil) ---------- */
@media (min-width: 768px) and (max-width: 1599px) {
  body.lpv-kontakt-reiter.v5-ueber-banken:is(.lpv-ub-sichtbar, .lpv-ub-knopf) #jae-rueckrufbitte-plugin:not(.jcb--offen) .jcb-launch { visibility: visible !important; opacity: 1 !important; }
  body.lpv-ub-knopf.v5-ueber-banken #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb { width: 48px; height: 48px; min-height: 48px; padding: 0; gap: 0; border-radius: 50%; justify-content: center; }
  body.lpv-ub-knopf.v5-ueber-banken #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb .jcb-launch__icon { width: 38px; height: 38px; margin: 0; }
  body.lpv-ub-knopf.v5-ueber-banken #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__frage { display: none; }
}

/* ---------- Nach-oben-Pfeil gestapelt (29.10.2026, Freigabe Alex: „gestapelt + ux bedingung freigegeben.“; Zusatz Alex: „icon nicht mit button aligned … button meint den pfeil nach oben hier“) ----------
   Standard (Body-Klasse lpv-hoch-stapel, tabelle11-konfig.php; alter Stand ?hoch=frei: Pfeil 30 px rechts, 110 px unten, 45 px über dem Reiter).
   Pfeil 8 px über dem sichtbaren Reiter (50 px ab --jae-cb-bottom 15 px, gleiche rechte Kante 12 px) bzw. über dem runden Knopf (?ueberbanken=knopf: 48 px, gleiche Mittelachse).
   UX-Bedingung: ohne sichtbaren Knopf (Reiter noch nicht eingeblendet, ?lpkontakt=leiste, mit ?ueberbanken=aus über der Banktabelle unter 1600 px ausgeblendet) unten in der Ecke.
   Kein Übergang: der Pfeil springt im selben Moment wie der Wechsel Reiter ↔ Knopf. Unter 768 px bleibt der Pfeil aus (v5.css, untere Leiste). */
body.lpv-hoch-stapel a.enigma_scrollup { right: 12px !important; bottom: 15px !important; transition: none !important; }
@media (min-width: 768px) {
  body.lpv-hoch-stapel.lpv-kontakt-reiter:has(#jae-rueckrufbitte-plugin.jcb--sichtbar:not(.jcb--offen)) a.enigma_scrollup { bottom: calc(var(--jae-cb-bottom, 15px) + 50px + 14px) !important; }
}
@media (min-width: 768px) and (max-width: 1599px) {
  body.lpv-hoch-stapel.lpv-kontakt-reiter.lpv-ub-aus.v5-ueber-banken:has(#jae-rueckrufbitte-plugin) a.enigma_scrollup { bottom: 15px !important; } /* nur ?ueberbanken=aus: Reiter weicht → Pfeil in die Ecke */
  body.lpv-hoch-stapel.lpv-kontakt-reiter.lpv-ub-knopf.v5-ueber-banken:has(#jae-rueckrufbitte-plugin.jcb--sichtbar:not(.jcb--offen)) a.enigma_scrollup { bottom: calc(var(--jae-cb-bottom, 15px) + 48px + 14px) !important; right: calc(12px + (48px - 45px) / 2) !important; } /* runder Knopf 48 px, Pfeil 45 px breit: Mittelachsen gleich */
}

/* 30.10.2026 Alex: Abstand Pfeil zum Reiter/Knopf 8 → 14 px (der 2-px-Rand des Pfeils wirkte zu nah) */

/* ---------- ?ctaweich=1 (30.10.2026): mitlaufender Vergleichsknopf weicht weich aus (v5.js setzt .is-weich), Platz bleibt, ausgeblendet nicht fokussierbar (visibility) ---------- */
body.lpv-ctaweich #v5-kap-cta, body.lpv-ctaweich #v5-bar-haupt { transition: background-color .15s, border-color .15s, opacity .25s ease, visibility 0s linear 0s; }
body.lpv-ctaweich #v5-kap-cta.is-weich, body.lpv-ctaweich #v5-bar-haupt.is-weich { opacity: 0; visibility: hidden; pointer-events: none; transition: background-color .15s, border-color .15s, opacity .25s ease, visibility 0s linear .25s; }
@media (prefers-reduced-motion: reduce) { body.lpv-ctaweich #v5-kap-cta, body.lpv-ctaweich #v5-bar-haupt { transition: none !important; } }
/* ?ctaweich=ux (30.10.2026): Balken gleitet beim Weichen nach unten weg, statt sofort zu verschwinden (visibility erst nach dem Gleiten); Rückweg-Knopf ?fscta=1 in der Fondssuche linksbündig */
@media (max-width: 991px) {
  body.lpv-ctaweich-ux .v5-bar { transition: transform .2s, visibility 0s linear .2s; }
  body.lpv-ctaweich-ux .v5-bar.is-sichtbar { transition: transform .2s, visibility 0s linear 0s; }
}
@media (prefers-reduced-motion: reduce) { body.lpv-ctaweich-ux .v5-bar, body.lpv-ctaweich-ux .v5-bar.is-sichtbar { transition: none !important; } }
body.lpv-ctaweich-ux #fondssuche p.v5-sec__akt:has(> a[data-herkunft="v6-fsuche-tabelle"]) { text-align: left !important; }
/* ?ctaweich=ux, Alex: „wenn ich auf 320px über die tabelle scrolle kommt der burger das ist nicht gut.“ Weicht der Balken (Tabelle, Strecke ab Rechnerknopf, großer Knopf), bleibt seine Stelle leer:
   Band bzw. Menü-Knopf kommen nicht als Ersatz zurück. Sie erscheinen nur dort, wo die Tausch-Regel sie ohnehin zeigt (vor dem Ende des Hero, solange kein Balkenplatz besteht). */
@media (max-width: 991px) {
  body.lpv-menue-tausch.lpv-ctaweich-ux.v5-bar-platz #enigma_nav_top, body.lpv-menue-tausch.lpv-ctaweich-ux.v5-bar-platz .navigation_menu.affix { transform: translateY(-130%) !important; visibility: hidden !important; }
}

