/*
 * jae-callback-widget 0.2 (17.10.2026, Layout "tab" 19.10.2026). Alte Darstellung: style-v1.css (Filter jae_callback_widget_layout = v1).
 * Anpassbare Variablen wie in 0.1: --jae-cb-bottom (Abstand des runden Knopfs von unten, Landingpages setzen ihn
 * oberhalb ihrer eigenen Leiste), --jae-cb-overlay-z (Ebene des Dialogs).
 * Farben wie trigonus-redesign.css: Logo-Blau #13318a (Handlung), Kopf-Blau #415b75, Text #1f2d3d, Telefon-Gruen #2e7d32.
 */
:root { --jae-cb-bottom: 15px; --jae-cb-overlay-z: 10050; } /* Dialog ueber Kopf/Menue (z-index 9995) */

#jae-rueckrufbitte-plugin { font-family: "Open Sans", Arial, sans-serif; color: #1f2d3d; }
#jae-rueckrufbitte-plugin *,
#jae-rueckrufbitte-plugin *::before,
#jae-rueckrufbitte-plugin *::after { box-sizing: border-box; }
#jae-rueckrufbitte-plugin :focus-visible { outline: 3px solid #1f5f99; outline-offset: 2px; }

/* ---------- Ausloeser ---------- */
#jae-rueckrufbitte-plugin .jcb-launch { position: fixed; z-index: 2400; visibility: hidden; opacity: 0; transform: translateY(16px); transition: opacity .2s, transform .2s, visibility 0s linear .2s; }
#jae-rueckrufbitte-plugin.jcb--sichtbar .jcb-launch { visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .2s, visibility 0s; }
#jae-rueckrufbitte-plugin.jcb--offen .jcb-launch { visibility: hidden; opacity: 0; }
#jae-rueckrufbitte-plugin .jcb-launch a,
#jae-rueckrufbitte-plugin .jcb-launch button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; margin: 0; font: 600 16px/1.2 "Open Sans", Arial, sans-serif; text-decoration: none; cursor: pointer; }
#jae-rueckrufbitte-plugin .jcb-launch__lang { display: none; }
#jae-rueckrufbitte-plugin .jcb-launch__frage { display: none; }

/* Runder Knopf (Desktop bei "bar", ueberall bei "button"): klein, am Rand, Beschriftung als title/aria */
#jae-rueckrufbitte-plugin .jcb-launch__cb { width: 56px; height: 56px; padding: 0; border-radius: 50%; background: #fff; color: #1f2d3d; border: 1px solid #c9d3dd; box-shadow: 0 4px 14px rgba(20, 35, 50, .22); }
#jae-rueckrufbitte-plugin .jcb-launch__cb .jcb-launch__icon { font-size: 20px; color: #2e7d32; }
#jae-rueckrufbitte-plugin .jcb-launch__cb .jcb-launch__kurz { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#jae-rueckrufbitte-plugin .jcb-launch__cb:hover { border-color: #415b75; }

#jae-rueckrufbitte-plugin.jcb--button .jcb-launch { right: 12px; bottom: var(--jae-cb-bottom, 15px); }
#jae-rueckrufbitte-plugin.jcb--button .jcb-launch__tel { display: none; }

/* Leiste "Anrufen | Rueckruf" mobil */
@media (max-width: 767px) {
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch { left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #d5dce4; box-shadow: 0 -4px 14px rgba(20, 35, 50, .10); }
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch__tel { width: 100%; border-radius: 6px; background: #415b75; color: #fff; border: 2px solid #415b75; }
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch__tel i { color: #fff; }
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch__cb { width: 100%; height: auto; border-radius: 6px; background: #fff; color: #415b75; border: 2px solid #415b75; box-shadow: none; }
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch__cb .jcb-launch__icon { color: #2e7d32; font-size: 16px; }
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch__cb .jcb-launch__kurz { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  /* Platz unten, damit die Leiste nie Inhalt verdeckt; fokussierte Elemente landen beim Tabben darueber */
  html.jcb-layout-bar body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  html.jcb-layout-bar { scroll-padding-bottom: 80px; }
}
@media (min-width: 768px) {
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch { right: 8px; bottom: 16px; }
  #jae-rueckrufbitte-plugin.jcb--bar .jcb-launch__tel { display: none; }
  html.jcb-layout-bar body { padding-bottom: 80px; }
}

/* ---------- Dialog ---------- */
#jae-rueckrufbitte-plugin .jcb-dialog { position: fixed; inset: 0; z-index: var(--jae-cb-overlay-z, 10050); display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(16, 30, 46, .55); }
#jae-rueckrufbitte-plugin .jcb-dialog[hidden] { display: none; }
html.jcb-offen, html.jcb-offen body { overflow: hidden; }
#jae-rueckrufbitte-plugin .jcb-dialog__panel { position: relative; width: 100%; max-width: 480px; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; background: #fff; border-radius: 8px; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); padding: 24px 24px 20px; }
#jae-rueckrufbitte-plugin .jcb-dialog__close { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f4f6f9; color: #1f2d3d; font-size: 28px; line-height: 1; cursor: pointer; }
#jae-rueckrufbitte-plugin .jcb-dialog__close:hover { background: #e3e7ec; }
#jae-rueckrufbitte-plugin h2 { margin: 0 48px 8px 0; font: 700 max(2.2rem, 22px)/1.25 "Open Sans", Arial, sans-serif; color: #1f2d3d; text-transform: none; letter-spacing: 0; }
#jae-rueckrufbitte-plugin p,
#jae-rueckrufbitte-plugin label,
#jae-rueckrufbitte-plugin legend { color: #1f2d3d; }
#jae-rueckrufbitte-plugin .jcb-intro { margin: 0 0 16px; font-size: max(1.6rem, 16px); line-height: 1.5; color: #3a4450; }
#jae-rueckrufbitte-plugin a { color: #13318a; text-decoration: underline; }
#jae-rueckrufbitte-plugin .jcb-feld { margin: 0 0 14px; padding: 0; border: 0; min-width: 0; }
#jae-rueckrufbitte-plugin .jcb-feld > label,
#jae-rueckrufbitte-plugin .jcb-zeit legend { display: block; margin: 0 0 4px; padding: 0; border: 0; font: 600 max(1.6rem, 16px)/1.4 "Open Sans", Arial, sans-serif; width: auto; }
#jae-rueckrufbitte-plugin input[type="text"],
#jae-rueckrufbitte-plugin input[type="tel"],
#jae-rueckrufbitte-plugin textarea { display: block; width: 100%; min-height: 48px; margin: 0; padding: 10px 12px; font: 400 max(1.7rem, 17px)/1.4 "Open Sans", Arial, sans-serif; color: #1f2d3d; background: #fff; border: 1px solid #8a96a3; border-radius: 6px; box-shadow: none; }
#jae-rueckrufbitte-plugin textarea { min-height: 96px; resize: vertical; }
#jae-rueckrufbitte-plugin input[aria-invalid="true"] { border: 2px solid #b3261e; }
#jae-rueckrufbitte-plugin .jcb-hinweis { display: block; margin-top: 4px; font-size: max(1.4rem, 14px); color: #55606c; }
#jae-rueckrufbitte-plugin .jcb-fehler { display: block; margin-top: 4px; font-size: max(1.4rem, 14px); color: #b3261e; font-weight: 600; }
#jae-rueckrufbitte-plugin .jcb-zeit label { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin: 0 16px 0 0; font: 400 max(1.6rem, 16px)/1.3 "Open Sans", Arial, sans-serif; cursor: pointer; }
#jae-rueckrufbitte-plugin .jcb-zeit input { position: static; margin: 0; width: 20px; height: 20px; }
#jae-rueckrufbitte-plugin .jcb-senden { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; margin: 6px 0 10px; padding: 0 20px; font: 600 max(1.7rem, 17px)/1.2 "Open Sans", Arial, sans-serif; color: #fff; background: #13318a; border: 1px solid #13318a; border-radius: 6px; cursor: pointer; }
#jae-rueckrufbitte-plugin .jcb-senden:hover { background: #0e2566; }
#jae-rueckrufbitte-plugin .jcb-senden[disabled] { opacity: .7; cursor: progress; }
#jae-rueckrufbitte-plugin .jcb-datenschutz { margin: 0 0 8px; font-size: max(1.4rem, 14px); line-height: 1.45; color: #55606c; }
#jae-rueckrufbitte-plugin .jcb-meldung { margin: 8px 0 0; padding: 12px 14px; border-radius: 6px; font-size: max(1.6rem, 16px); line-height: 1.45; }
#jae-rueckrufbitte-plugin .jcb-meldung[hidden] { display: none; }
#jae-rueckrufbitte-plugin .jcb-meldung--ok { background: #e8f3e9; border: 1px solid #2e7d32; color: #1b4d1f; }
#jae-rueckrufbitte-plugin .jcb-meldung--fehler { background: #fdecea; border: 1px solid #b3261e; color: #6b1510; }

@media (prefers-reduced-motion: reduce) {
  #jae-rueckrufbitte-plugin .jcb-launch { transition: none; }
}

/* ---------- Layout "tab" (Standard ab 19.10.2026): Reiter mit Beschriftung, Paneel waechst wie in 0.1 aus der Ecke ---------- */
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch { right: 12px; bottom: var(--jae-cb-bottom, 12px); } /* Landingpages setzen den Abstand ueber ihre eigene Leiste */
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__tel,
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__lang { display: none; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb { width: auto; height: auto; min-height: 48px; padding: 7px 16px 7px 7px; gap: 10px; border-radius: 28px; background: #fff; color: #1f2d3d; border: 1px solid #c9d3dd; box-shadow: 0 4px 14px rgba(20, 35, 50, .18); font-size: 15px; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb .jcb-launch__icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #2e7d32; color: #fff; font-size: 15px; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__frage { display: inline; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-dialog { inset: 0 0 0 auto; width: min(460px, 100vw); padding: 0; background: transparent; display: block; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-dialog[hidden] { display: none; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-dialog__panel { height: 100%; max-height: none; max-width: none; border-radius: 0; background: #415b75; color: #fff; box-shadow: -8px 0 30px rgba(0, 0, 0, .25);
  clip-path: inset(100% 0 0 100%); opacity: 0; transition: clip-path .6s ease, opacity .6s ease; }
#jae-rueckrufbitte-plugin.jcb--tab.jcb--auf .jcb-dialog__panel { clip-path: inset(0 0 0 0); opacity: 1; }
#jae-rueckrufbitte-plugin.jcb--tab h2,
#jae-rueckrufbitte-plugin.jcb--tab p,
#jae-rueckrufbitte-plugin.jcb--tab label,
#jae-rueckrufbitte-plugin.jcb--tab legend,
#jae-rueckrufbitte-plugin.jcb--tab .jcb-intro,
#jae-rueckrufbitte-plugin.jcb--tab .jcb-hinweis,
#jae-rueckrufbitte-plugin.jcb--tab .jcb-datenschutz { color: #fff; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-dialog__panel > form a { color: #fff; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-meldung a { color: inherit; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-fehler { color: #fff; background: #b3261e; padding: 2px 6px; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-dialog__close { background: rgba(255, 255, 255, .16); color: #fff; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-senden { background: #fff; color: #13318a; border-color: #fff; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-senden:hover { background: #e8ecef; }
#jae-rueckrufbitte-plugin.jcb--tab :focus-visible { outline-color: #fff; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb:focus-visible { outline-color: #13318a; }
/* Platz unten nur auf Theme-Seiten; Landingpages (tg-lp, eigene Gestaltung) bleiben unveraendert */
@media (min-width: 768px) { html.jcb-layout-tab body:not(.tg-lp) { padding-bottom: 72px; } }
@media (max-width: 767px) { html.jcb-layout-tab body:not(.tg-lp) { padding-bottom: 64px; } }
@media (prefers-reduced-motion: reduce) { #jae-rueckrufbitte-plugin.jcb--tab .jcb-dialog__panel { transition: none; } }

/* Parent-Knopf "nach oben" ueber dem runden Knopf (wie 0.1) */
.enigma_scrollup { bottom: 110px; z-index: 2000; }
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__kurz { display: none; }

/* 19.10.2026 (Alex): Rufnummer bricht nicht um; Paneel im Layout "tab" breiter, mobil nie breiter als der Bildschirm */
#jae-rueckrufbitte-plugin a[href^="tel:"] { white-space: nowrap; }
/* 19.10.2026 (Icon-Audit): Auf Landingpages ohne FA5 (nur FA4 geladen, Kit/Pro gesperrt oder entfernt) setzte .fas keine Icon-Schrift; FA4 kennt \f095 ebenfalls */
#jae-rueckrufbitte-plugin .jcb-launch__icon.fa-phone:before { content: "\f095"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome"; }

/* Runde 17 (19.10.2026): Landingpages mit eigener Alt-Kopie des Widgets (gleiche IDs, z. B. uebersicht/tabelle6.php auf
   /depot-eroeffnen-vermittlerwechsel/) stylen #rueckrufBitteButtonBox, #rueckrufBitteBox und .boxclose per ID. Diese Regeln
   trafen auch das Plugin-Markup: graue Box um den Reiter, Reitertext 22 px, zweites Schliessen-Kreuz, Dialog 97 % deckend.
   Hier nur innerhalb des Plugins zuruecksetzen; Seiten ohne solche Regeln bleiben unveraendert.
   Spezifitaet bewusst knapp ueber den ID-Regeln der Alt-Kopie und unter den Layout-Regeln (.jcb--bar setzt eigene Flaeche). */
#jae-rueckrufbitte-plugin.jcb--tab .jcb-launch, #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch:hover,
#jae-rueckrufbitte-plugin.jcb--button .jcb-launch, #jae-rueckrufbitte-plugin.jcb--button .jcb-launch:hover { background: none; border: 0; border-radius: 0; padding: 0; cursor: auto; }
#jae-rueckrufbitte-plugin .jcb-launch span { font-size: inherit; }
#jae-rueckrufbitte-plugin .jcb-dialog { opacity: 1; }
#jae-rueckrufbitte-plugin .boxclose:before { content: none; }

/* Runde 22 (20.10.2026, Alex: „auf mobile soll der rückruf button nicht permanent content blockieren, eventuell nur icon ohne text anzeigen.“):
   Unter 768 px zeigt das Layout „tab“ nur einen runden Telefonknopf (48 px) in der Ecke. Zugaenglicher Name „Rückruf vereinbaren“ ueber den vorhandenen,
   nur fuer Screenreader sichtbaren Text .jcb-launch__lang („Haben Sie Fragen?“ mobil ausgeblendet); Tippen oeffnet das Formular wie bisher. Desktop unveraendert. */
@media (max-width: 767px) {
  #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch { right: 12px; bottom: var(--jae-cb-bottom, 12px); }
  #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb { width: 48px; height: 48px; min-height: 48px; padding: 0; gap: 0; border-radius: 50%; }
  #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__cb .jcb-launch__icon { width: 38px; height: 38px; }
  #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__frage { display: none; }
  #jae-rueckrufbitte-plugin.jcb--tab .jcb-launch__lang { display: inline; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  html.jcb-layout-tab body:not(.tg-lp) { padding-bottom: 0; } /* kein Platzhalter mehr fuer eine Leiste */
}